diff --git a/lib/app-layout/index.js b/lib/app-layout/index.js index 1b49239f2..c4c08584d 100644 --- a/lib/app-layout/index.js +++ b/lib/app-layout/index.js @@ -19,7 +19,7 @@ const NoteEditor = React.lazy(() => ); export const AppLayout = ({ - isFocusMode, + isFocusMode = false, isNavigationOpen, isNoteInfoOpen, isNoteOpen, @@ -85,7 +85,7 @@ export const AppLayout = ({ }; AppLayout.propTypes = { - isFocusMode: PropTypes.bool.isRequired, + isFocusMode: PropTypes.bool, isNavigationOpen: PropTypes.bool.isRequired, isNoteInfoOpen: PropTypes.bool.isRequired, isNoteOpen: PropTypes.bool.isRequired, diff --git a/lib/state/settings/actions.js b/lib/state/settings/actions.js index 5376f2165..5f61d3635 100644 --- a/lib/state/settings/actions.js +++ b/lib/state/settings/actions.js @@ -32,15 +32,11 @@ export const setLineLength = lineLength => ({ lineLength, }); -export const setSortOrder = sortReversed => ({ - type: 'setSortReversed', - sortReversed, -}); - export const toggleSortOrder = () => (dispatch, getState) => { - const { settings: { sortReversed } } = getState(); - - dispatch(setSortOrder(!sortReversed)); + dispatch({ + type: 'setSortReversed', + sortReversed: !getState().settings.sortReversed, + }); }; export const setSortType = sortType => ({ @@ -48,15 +44,11 @@ export const setSortType = sortType => ({ sortType, }); -export const setSortTagsAlpha = sortTagsAlpha => ({ - type: 'setSortTagsAlpha', - sortTagsAlpha, -}); - export const toggleSortTagsAlpha = () => (dispatch, getState) => { - const { settings: { sortTagsAlpha } } = getState(); - - dispatch(setSortTagsAlpha(!sortTagsAlpha)); + dispatch({ + type: 'setSortTagsAlpha', + sortTagsAlpha: !getState().settings.sortTagsAlpha, + }); }; export const setMarkdown = markdownEnabled => ({ @@ -74,24 +66,16 @@ export const setWPToken = token => ({ token, }); -export const setFocusMode = focusModeEnabled => ({ - type: 'setFocusMode', - focusModeEnabled, -}); - export const toggleFocusMode = () => (dispatch, getState) => { - const { settings: { focusModeEnabled } } = getState(); - - dispatch(setFocusMode(!focusModeEnabled)); + dispatch({ + type: 'setFocusMode', + focusModeEnabled: !getState().settings.focusModeEnabled, + }); }; -export const setSpellCheck = spellCheckEnabled => ({ - type: 'setSpellCheck', - spellCheckEnabled, -}); - export const toggleSpellCheck = () => (dispatch, getState) => { - const { settings: { spellCheckEnabled } } = getState(); - - dispatch(setSpellCheck(!spellCheckEnabled)); + dispatch({ + type: 'setSpellCheck', + spellCheckEnabled: !getState().settings.spellCheckEnabled, + }); }; diff --git a/lib/state/settings/reducer.js b/lib/state/settings/reducer.js index 30d45a7bc..8717b28d7 100644 --- a/lib/state/settings/reducer.js +++ b/lib/state/settings/reducer.js @@ -1,113 +1,52 @@ -import { combineReducers } from 'redux'; import { clamp } from 'lodash'; -const sortType = (state = 'modificationDate', action) => { - if ('setSortType' !== action.type) { - return state; - } - - return action.sortType; -}; - -const sortReversed = (state = false, action) => { - if ('setSortReversed' !== action.type) { - return state; - } - - return action.sortReversed; -}; - -const sortTagsAlpha = (state = false, action) => { - if ('setSortTagsAlpha' !== action.type) { - return state; - } - - return action.sortTagsAlpha || false; -}; - -const theme = (state = 'light', action) => { - if ('setTheme' !== action.type) { - return state; - } - - return action.theme; -}; - -const focusModeEnabled = (state = false, action) => { - if ('setFocusMode' !== action.type) { - return state; - } - - return action.focusModeEnabled; -}; - -const fontSize = (state = 16, { type, fontSize: size = 16 }) => { - if ('setFontSize' !== type) { - return state; - } - - return clamp(size, 10, 30); -}; - -const noteDisplay = (state = 'comfy', action) => { - if ('setNoteDisplay' !== action.type) { - return state; - } - - return action.noteDisplay; -}; - -const lineLength = (state = 'narrow', action) => { - if ('setLineLength' !== action.type) { - return state; - } - - return action.lineLength; -}; - -const accountName = (state = null, action) => { - if ('setAccountName' !== action.type) { - return state; - } - - return action.accountName; -}; - -const markdownEnabled = (state = false, action) => { - if ('setMarkdownEnabled' !== action.type) { - return state; - } - - return action.markdownEnabled; -}; - -const wpToken = (state = false, action) => { - if ('setWPToken' !== action.type) { - return state; - } - - return action.token; -}; - -const spellCheckEnabled = (state = true, action) => { - if ('setSpellCheck' !== action.type) { - return state; - } - - return action.spellCheckEnabled; -}; - -export default combineReducers({ - accountName, - focusModeEnabled, - fontSize, - lineLength, - markdownEnabled, - noteDisplay, - sortType, - sortReversed, - sortTagsAlpha, - spellCheckEnabled, - theme, - wpToken, -}); +export const initialState = { + accountName: null, + focusModeEnabled: false, + fontSize: 16, + lineLength: 'narrow', + markdownEnabled: false, + noteDisplay: 'comfy', + sortReversed: false, + sortTagsAlpha: false, + sortType: 'modificationDate', + spellCheckEnabled: true, + theme: 'light', + wpToken: false, +}; + +function reducer(state = initialState, action) { + switch (action.type) { + case 'setAccountName': + return { ...state, accountName: action.accountName }; + case 'setFocusMode': + return { ...state, focusModeEnabled: action.focusModeEnabled }; + case 'setFontSize': + return { + ...state, + fontSize: clamp(action.fontSize || initialState.fontSize, 10, 30), + }; + case 'setLineLength': + return { ...state, lineLength: action.lineLength }; + case 'setMarkdownEnabled': + return { ...state, markdownEnabled: action.markdownEnabled }; + case 'setNoteDisplay': + return { ...state, noteDisplay: action.noteDisplay }; + case 'setSortReversed': + return { ...state, sortReversed: action.sortReversed }; + case 'setSortTagsAlpha': + return { ...state, sortTagsAlpha: action.sortTagsAlpha }; + case 'setSortType': + return { ...state, sortType: action.sortType }; + case 'setSpellCheck': + return { ...state, spellCheckEnabled: action.spellCheckEnabled }; + case 'setTheme': + return { ...state, theme: action.theme }; + case 'setWPToken': + return { ...state, wpToken: action.token }; + default: + return state; + } +} + +export default reducer;