Merge pull request #248 from jekyll/messages

Separate frontend messages into a file

Author: mertkahyaoglu

docs/frontend/constants.md

@@ -7,6 +7,19 @@ permalink: /frontend/constants/
 
 Stores all of the action creators' names
 
+## Messages
+
+Stores the following messages;
+
+* confirm delete message
+* confirm leave message
+* confirm override static file message
+* not found message
+* notification messages
+* validation messages
+
+This allows us to control all of the messages in a single place and also will help us localize the admin panel in the future.
+
 ## API
 
 Stores all of the API endpoints

lib/jekyll-admin/server/static_file.rb

@@ -50,8 +50,7 @@ def static_files
         site.static_files
       end
 
-      def file_list_dir(path)
-      end
+      def file_list_dir(path) end
 
       def static_file
         static_files.find { |f| f.path == static_file_path }

src/actions/collections.js

@@ -1,7 +1,10 @@
 import * as ActionTypes from '../constants/actionTypes';
 import _ from 'underscore';
 import moment from 'moment';
-
+import { validationError } from '../actions/utils';
+import { get, put, del } from '../utils/fetch';
+import { validator } from '../utils/validation';
+import { slugify } from '../utils/helpers';
 import {
   getCollectionsUrl,
   getCollectionUrl,
@@ -10,18 +13,16 @@ import {
   putCollectionDocumentUrl,
   deleteCollectionDocumentUrl
 } from '../constants/api';
-
 import {
   getCollections,
   getCollection,
   getCollectionDocuments
 } from '../constants/api';
-
-import { validationError } from '../actions/utils';
-
-import { get, put, del } from '../utils/fetch';
-import { validator } from '../utils/validation';
-import { slugify } from '../utils/helpers';
+import {
+  getTitleRequiredMessage,
+  getFilenameRequiredMessage,
+  getFilenameNotValidMessage
+} from '../constants/messages';
 
 export function fetchCollections() {
   return dispatch => {
@@ -76,15 +77,15 @@ export function putDocument(id, collection) {
         'path': 'required'
       };
       let messages = {
-        'title.required': 'The title is required.',
-        'path.required': 'The filename is required.'
+        'title.required': getTitleRequiredMessage(),
+        'path.required': getFilenameRequiredMessage()
       };
       if (collection == 'posts') {
         validations['path'] = 'required|date';
-        messages['path.date'] = 'The filename is not valid.';
+        messages['path.date'] = getFilenameNotValidMessage();
       }else {
         validations['path'] = 'required|filename';
-        messages['path.filename'] = 'The filename is not valid.';
+        messages['path.filename'] = getFilenameNotValidMessage();
       }
       const errors = validator(metadata, validations, messages);
       if(errors.length) {
@@ -101,7 +102,6 @@ export function putDocument(id, collection) {
       }),
       raw_content
     });
-    // TODO dispatch({type: ActionTypes.PUT_DOCUMENT_REQUEST, doc});
     return put(
       putCollectionDocumentUrl(
         collection, id || path.substring(path.lastIndexOf('/') + 1)

src/actions/config.js

@@ -1,8 +1,7 @@
 import * as ActionTypes from '../constants/actionTypes';
 import { getConfigurationUrl, putConfigurationUrl } from '../constants/api';
-
+import { getParserErrorMessage } from '../constants/messages';
 import { addNotification } from './notifications';
-
 import { get, put } from '../utils/fetch';
 import { toJSON } from '../utils/helpers';
 
@@ -24,7 +23,7 @@ export function putConfig(config) {
     try {
       json = toJSON(config);
     } catch (e) {
-      return dispatch(addNotification('Parse Error', e.message, 'error'));
+      return dispatch(addNotification(getParserErrorMessage(), e.message, 'error'));
     }
     return put(
       putConfigurationUrl(),

src/actions/datafiles.js

@@ -1,20 +1,18 @@
 import * as ActionTypes from '../constants/actionTypes';
 import _ from 'underscore';
-
+import { getParserErrorMessage } from '../constants/messages';
+import { validationError } from './utils';
+import { addNotification } from './notifications';
+import { get, put, del } from '../utils/fetch';
+import { toJSON } from '../utils/helpers';
+import { validator } from '../utils/validation';
 import {
   getDataFilesUrl,
   getDataFileUrl,
   putDataFileUrl,
   deleteDataFileUrl
 } from '../constants/api';
 
-import { validationError } from './utils';
-import { addNotification } from './notifications';
-
-import { get, put, del } from '../utils/fetch';
-import { toJSON } from '../utils/helpers';
-import { validator } from '../utils/validation';
-
 export function fetchDataFiles() {
   return (dispatch) => {
     dispatch({ type: ActionTypes.FETCH_DATAFILES_REQUEST});
@@ -60,7 +58,7 @@ export function putDataFile(filename, data) {
     try {
       json = toJSON(data);
     } catch (e) {
-      return dispatch(addNotification('Parse Error', e.message, 'error'));
+      return dispatch(addNotification(getParserErrorMessage(), e.message, 'error'));
     }
     return put(
       putDataFileUrl(filename),

src/actions/pages.js

@@ -1,18 +1,20 @@
 import * as ActionTypes from '../constants/actionTypes';
 import _ from 'underscore';
-
+import { validationError } from '../actions/utils';
+import { get, put, del } from '../utils/fetch';
+import { validator } from '../utils/validation';
+import { slugify } from '../utils/helpers';
 import {
   getPagesUrl,
   getPageUrl,
   putPageUrl,
   deletePageUrl
 } from '../constants/api';
-
-import { validationError } from '../actions/utils';
-
-import { get, put, del } from '../utils/fetch';
-import { validator } from '../utils/validation';
-import { slugify } from '../utils/helpers';
+import {
+  getTitleRequiredMessage,
+  getFilenameRequiredMessage,
+  getFilenameNotValidMessage
+} from '../constants/messages';
 
 export function fetchPages() {
   return (dispatch) => {
@@ -49,8 +51,8 @@ export function putPage(name) {
         metadata,
         { 'path': 'required|filename' },
         {
-          'path.required': 'The filename is required.',
-          'path.filename': 'The filename is not valid.'
+          'path.required': getTitleRequiredMessage(),
+          'path.filename': getFilenameNotValidMessage()
         }
       );
       if (errors.length) {
@@ -67,7 +69,6 @@ export function putPage(name) {
       }),
       raw_content
     });
-    // TODO dispatch({type: ActionTypes.PUT_PAGE_REQUEST, page});
     return put(
       putPageUrl(name || path),
       page,

src/actions/staticfiles.js

@@ -1,17 +1,20 @@
 import * as ActionTypes from '../constants/actionTypes';
 import _ from 'underscore';
-
+import { get, put, del } from '../utils/fetch';
+import { addNotification } from './notifications';
+import {
+  getSuccessMessage,
+  getErrorMessage,
+  getUploadSuccessMessage,
+  getUploadErrorMessage
+} from '../constants/messages';
 import {
   getStaticFilesUrl,
   getStaticFileUrl,
   putStaticFileUrl,
   deleteStaticFileUrl
 } from '../constants/api';
 
-import { get, put, del } from '../utils/fetch';
-
-import { addNotification } from './notifications';
-
 export function fetchStaticFiles() {
   return dispatch => {
     dispatch({ type: ActionTypes.FETCH_STATICFILES_REQUEST});
@@ -47,8 +50,8 @@ export function uploadStaticFiles(files) {
           });
           dispatch(fetchStaticFiles());
           dispatch(addNotification(
-            'Success',
-            `${file.name} uploaded successfully`,
+            getSuccessMessage(),
+            getUploadSuccessMessage(file.name),
             'success'
           ));
         })
@@ -58,8 +61,8 @@ export function uploadStaticFiles(files) {
             error
           });
           dispatch(addNotification(
-            'Upload Error',
-            `Error occurred uploading the file.`,
+            getErrorMessage(),
+            getUploadErrorMessage(),
             'error'
           ));
         });

src/constants/messages.js

@@ -0,0 +1,44 @@
+// inline messages
+export const getDeleteMessage = (filename) =>
+  `Are you sure that you want to delete "${filename}" ?`;
+
+export const getLeaveMessage = () =>
+  "You have unsaved changes on this page. Are you sure you want to leave?";
+
+export const getNotFoundMessage = (type) =>
+  `No ${type} found.`;
+
+export const getOverrideMessage = (filename) =>
+  `${filename} will be overwritten. Continue anyway?`;
+
+// notification messages
+export const getParserErrorMessage = () => "Parse Error";
+
+export const getSuccessMessage = () => "Success";
+
+export const getErrorMessage = () => "Error";
+
+export const getUploadSuccessMessage = (filename) =>
+  `${filename} uploaded successfully`;
+
+export const getUploadErrorMessage = () =>
+  `Error occurred uploading the file.`;
+
+export const getFetchErrorMessage = (filename) =>
+  `Could not fetch the ${filename}`;
+
+export const getUpdateErrorMessage = (filename) =>
+  `Could not update the ${filename}`;
+
+export const getDeleteErrorMessage = (filename) =>
+  `Could not delete the ${filename}`;
+
+// validation messages
+export const getTitleRequiredMessage = () =>
+  "The title is required.";
+
+export const getFilenameRequiredMessage = () =>
+  "The filename is required.";
+
+export const getFilenameNotValidMessage = () =>
+  "The filename is not valid.";

src/containers/views/Configuration.js

@@ -2,12 +2,9 @@ import React, { Component, PropTypes } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { withRouter } from 'react-router';
-
-// Components
 import Editor from '../../components/Editor';
-
-// Actions
 import { putConfig, onEditorChange } from '../../actions/config';
+import { getLeaveMessage } from '../../constants/messages';
 
 export class Configuration extends Component {
 
@@ -17,9 +14,9 @@ export class Configuration extends Component {
   }
 
   routerWillLeave(nextLocation) {
-    const { editorChanged } = this.props;
-    if (editorChanged)
-      return 'You have unsaved changes on this page. Are you sure you want to leave?';
+    if (this.props.editorChanged) {
+      return getLeaveMessage();
+    }
   }
 
   handleSaveClick() {

src/containers/views/DataFileEdit.js

@@ -4,17 +4,12 @@ import { bindActionCreators } from 'redux';
 import { browserHistory, withRouter } from 'react-router';
 import { Link } from 'react-router';
 import _ from 'underscore';
-
-// Constants
-import { ADMIN_PREFIX } from '../../constants';
-
-// Components
 import Splitter from '../../components/Splitter';
 import Editor from '../../components/Editor';
-
-// Actions
 import { fetchDataFile, putDataFile, deleteDataFile, onDataFileChanged } from '../../actions/datafiles';
 import { clearErrors } from '../../actions/utils';
+import { ADMIN_PREFIX } from '../../constants';
+import { getLeaveMessage, getDeleteMessage, getNotFoundMessage } from '../../constants/messages';
 
 export class DataFileEdit extends Component {
 
@@ -30,9 +25,9 @@ export class DataFileEdit extends Component {
   }
 
   routerWillLeave(nextLocation) {
-    const { datafileChanged } = this.props;
-    if (datafileChanged)
-      return 'You have unsaved changes on this page. Are you sure you want to leave?';
+    if (this.props.datafileChanged) {
+      return getLeaveMessage();
+    }
   }
 
   handleClickSave() {
@@ -45,7 +40,7 @@ export class DataFileEdit extends Component {
 
   handleClickDelete(filename) {
     const { deleteDataFile } = this.props;
-    const confirm = window.confirm(`Are you sure that you want to delete "${filename}" ?`);
+    const confirm = window.confirm(getDeleteMessage(filename));
     if (confirm) {
       deleteDataFile(filename);
       browserHistory.push(`${ADMIN_PREFIX}/datafiles`);
@@ -60,7 +55,7 @@ export class DataFileEdit extends Component {
     }
 
     if (_.isEmpty(datafile)) {
-      return <h1>{`Could not find the data file.`}</h1>;
+      return <h1>{getNotFoundMessage("data file")}</h1>;
     }
 
     const { slug, ext, raw_content, content } = datafile;