diff --git a/lib/app.tsx b/lib/app.tsx index 0083a4447..8f11629b7 100644 --- a/lib/app.tsx +++ b/lib/app.tsx @@ -30,6 +30,7 @@ import { pick, values, } from 'lodash'; +import { toggleSimperiumConnectionStatus } from './state/ui/actions'; import * as settingsActions from './state/settings/actions'; @@ -82,6 +83,8 @@ function mapDispatchToProps(dispatch, { noteBucket }) { setAuthorized: () => dispatch(reduxActions.auth.setAuthorized()), setSearchFocus: () => dispatch(actionCreators.setSearchFocus({ searchFocus: true })), + setSimperiumConnectionStatus: connected => + dispatch(toggleSimperiumConnectionStatus(connected)), }; } @@ -166,18 +169,14 @@ export const App = connect( .on('update', debounce(this.props.loadTags, 200)) .on('remove', this.props.loadTags); - const { - actions: { setConnectionStatus }, - } = this.props; - this.props.client .on('authorized', this.onAuthChanged) .on('unauthorized', this.onAuthChanged) .on('message', setLastSyncedTime) .on('message', this.syncActivityHooks) .on('send', this.syncActivityHooks) - .on('connect', () => setConnectionStatus({ isOffline: false })) - .on('disconnect', () => setConnectionStatus({ isOffline: true })); + .on('connect', () => this.props.setSimperiumConnectionStatus(true)) + .on('disconnect', () => this.props.setSimperiumConnectionStatus(false)); this.onLoadPreferences(() => // Make sure that tracking starts only after preferences are loaded diff --git a/lib/components/sync-status/index.tsx b/lib/components/sync-status/index.tsx index dee68aa76..85aedc7d0 100644 --- a/lib/components/sync-status/index.tsx +++ b/lib/components/sync-status/index.tsx @@ -1,16 +1,20 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; import AlertIcon from '../../icons/alert'; import SyncIcon from '../../icons/sync'; import SyncStatusPopover from './popover'; -class SyncStatus extends Component { - static propTypes = { - isOffline: PropTypes.bool.isRequired, - unsyncedNoteIds: PropTypes.array.isRequired, - }; +import * as S from '../../state'; +import * as T from '../../types'; + +type StateProps = { + simperiumConnected: boolean; + unsyncedNoteIds: T.EntityId[]; +}; +class SyncStatus extends Component { state = { anchorEl: null, }; @@ -24,7 +28,7 @@ class SyncStatus extends Component { }; render() { - const { isOffline, unsyncedNoteIds } = this.props; + const { simperiumConnected, unsyncedNoteIds } = this.props; const { anchorEl } = this.state; const popoverId = 'sync-status__popover'; @@ -33,9 +37,9 @@ class SyncStatus extends Component { const unit = unsyncedChangeCount === 1 ? 'change' : 'changes'; const text = unsyncedChangeCount ? `${unsyncedChangeCount} unsynced ${unit}` - : isOffline - ? 'No connection' - : 'All changes synced'; + : simperiumConnected + ? 'All changes synced' + : 'No connection'; return (
@@ -49,7 +53,7 @@ class SyncStatus extends Component { tabIndex="0" > - {isOffline ? : } + {simperiumConnected ? : } {text}
@@ -65,4 +69,12 @@ class SyncStatus extends Component { } } -export default SyncStatus; +const mapStateToProps: S.MapState = ({ + appState: state, + ui: { simperiumConnected }, +}) => ({ + simperiumConnected, + unsyncedNoteIds: state.unsyncedNoteIds, +}); + +export default connect(mapStateToProps)(SyncStatus); diff --git a/lib/flux/app-state.ts b/lib/flux/app-state.ts index c035077b9..97653b19f 100644 --- a/lib/flux/app-state.ts +++ b/lib/flux/app-state.ts @@ -52,7 +52,6 @@ const initialState: AppState = { shouldPrint: false, searchFocus: false, unsyncedNoteIds: [], // note bucket only - isOffline: true, // disconnected from Simperium server }; export const actionMap = new ActionMap({ @@ -718,15 +717,6 @@ export const actionMap = new ActionMap({ unsyncedNoteIds: { $set: noteIds }, }); }, - - setConnectionStatus( - state: AppState, - { isOffline }: { isOffline: boolean } - ) { - return update(state, { - isOffline: { $set: isOffline }, - }); - }, }, }); diff --git a/lib/navigation-bar/index.tsx b/lib/navigation-bar/index.tsx index 61a2fb919..fac251c4b 100644 --- a/lib/navigation-bar/index.tsx +++ b/lib/navigation-bar/index.tsx @@ -21,7 +21,6 @@ export class NavigationBar extends Component { autoHideMenuBar: PropTypes.bool, dialogs: PropTypes.array.isRequired, isElectron: PropTypes.bool.isRequired, - isOffline: PropTypes.bool.isRequired, onAbout: PropTypes.func.isRequired, onOutsideClick: PropTypes.func.isRequired, onSettings: PropTypes.func.isRequired, @@ -30,7 +29,6 @@ export class NavigationBar extends Component { selectedTag: PropTypes.object, showNavigation: PropTypes.bool.isRequired, showTrash: PropTypes.bool.isRequired, - unsyncedNoteIds: PropTypes.array.isRequired, }; static defaultProps = { @@ -69,13 +67,10 @@ export class NavigationBar extends Component { const { autoHideMenuBar, isElectron, - isOffline, onAbout, onSettings, onShowAllNotes, - unsyncedNoteIds, } = this.props; - return (
@@ -125,7 +120,7 @@ export class NavigationBar extends Component { )}
- +
); @@ -135,11 +130,9 @@ export class NavigationBar extends Component { const mapStateToProps = ({ appState: state, settings }) => ({ autoHideMenuBar: settings.autoHideMenuBar, dialogs: state.dialogs, - isOffline: state.isOffline, selectedTag: state.tag, showNavigation: state.showNavigation, showTrash: state.showTrash, - unsyncedNoteIds: state.unsyncedNoteIds, }); const { diff --git a/lib/state/action-types.ts b/lib/state/action-types.ts index 63a5454aa..649a18109 100644 --- a/lib/state/action-types.ts +++ b/lib/state/action-types.ts @@ -53,6 +53,10 @@ export type SetWPToken = Action<'setWPToken', { token: string }>; */ export type FilterNotes = Action<'FILTER_NOTES', { notes: T.NoteEntity[] }>; export type SetAuth = Action<'AUTH_SET', { status: AuthState }>; +export type ToggleSimperiumConnectionStatus = Action< + 'SIMPERIUM_CONNECTION_STATUS_TOGGLE', + { simperiumConnected: boolean } +>; export type ToggleTagDrawer = Action<'TAG_DRAWER_TOGGLE', { show: boolean }>; export type ActionType = @@ -71,6 +75,7 @@ export type ActionType = | SetSpellCheck | SetTheme | SetWPToken + | ToggleSimperiumConnectionStatus | ToggleTagDrawer; export type ActionCreator = (...args: any[]) => A; diff --git a/lib/state/index.ts b/lib/state/index.ts index eaabbfccf..4c5ed5b09 100644 --- a/lib/state/index.ts +++ b/lib/state/index.ts @@ -31,7 +31,6 @@ export type AppState = { editorMode: T.EditorMode; editingTags: boolean; filter: string; - isOffline: boolean; isViewingRevisions: boolean; listTitle: T.TranslatableString; nextDialogKey: number; diff --git a/lib/state/ui/actions.ts b/lib/state/ui/actions.ts index d0c58dc12..62a30ac26 100644 --- a/lib/state/ui/actions.ts +++ b/lib/state/ui/actions.ts @@ -8,6 +8,13 @@ export const filterNotes: A.ActionCreator = ( notes, }); +export const toggleSimperiumConnectionStatus: A.ActionCreator = ( + simperiumConnected: boolean +) => ({ + type: 'SIMPERIUM_CONNECTION_STATUS_TOGGLE', + simperiumConnected, +}); + export const toggleTagDrawer: A.ActionCreator = ( show: boolean ) => ({ diff --git a/lib/state/ui/reducer.ts b/lib/state/ui/reducer.ts index 5b780de2a..816956e9f 100644 --- a/lib/state/ui/reducer.ts +++ b/lib/state/ui/reducer.ts @@ -12,6 +12,11 @@ const filteredNotes: A.Reducer = ( action ) => ('FILTER_NOTES' === action.type ? action.notes : state); +const simperiumConnected: A.Reducer = (state = false, action) => + 'SIMPERIUM_CONNECTION_STATUS_TOGGLE' === action.type + ? action.simperiumConnected + : state; + const visiblePanes: A.Reducer = ( state = defaultVisiblePanes, action @@ -25,4 +30,8 @@ const visiblePanes: A.Reducer = ( return state; }; -export default combineReducers({ filteredNotes, visiblePanes }); +export default combineReducers({ + filteredNotes, + simperiumConnected, + visiblePanes, +});