Move to redux-actions.

src/EteSyncContext.tsx

@@ -11,7 +11,7 @@ import JournalView from './JournalView';
 import JournalFetcher from './JournalFetcher';
 
 import { routeResolver, getPalette } from './App';
-import { store, StoreState, FetchStatus, CredentialsType, CredentialsData, fetchCredentials } from './store';
+import { store, StoreState, CredentialsType, CredentialsData, fetchCredentials } from './store';
 
 import * as C from './Constants';
 
@@ -93,10 +93,9 @@ class EteSyncContext extends React.Component {
   }
 
   render() {
-    if (((this.props.credentials.status === FetchStatus.Initial) &&
-      (this.props.credentials.value === null)) ||
-      (this.props.credentials.status === FetchStatus.Failure)) {
-
+    if (this.props.credentials.fetching) {
+      return (<div>Loading</div>);
+    } else if (this.props.credentials.value === null) {
       let advancedSettings = null;
       if (this.state.showAdvanced) {
         advancedSettings = (
@@ -141,7 +140,7 @@ class EteSyncContext extends React.Component {
       return (
         <div style={styles.holder}>
           <Paper zDepth={2} style={styles.paper}>
-            {(this.props.credentials.error !== undefined) && (<div>Error! {this.props.credentials.error.message}</div>)}
+            {(this.props.credentials.error) && (<div>Error! {this.props.credentials.error.message}</div>)}
             <h2>Please Log In</h2>
             <form style={styles.form} onSubmit={this.generateEncryption}>
               <TextField
@@ -185,8 +184,6 @@ class EteSyncContext extends React.Component {
           </Paper>
         </div>
       );
-    } else if (this.props.credentials.status === FetchStatus.Request) {
-      return (<div>Loading</div>);
     }
 
     let context = this.props.credentials.value as CredentialsData;

src/store.tsx

@@ -1,5 +1,6 @@
 import { createStore, combineReducers, applyMiddleware } from 'redux';
 import { persistReducer, persistStore } from 'redux-persist';
+import { createActions, handleAction, handleActions } from 'redux-actions';
 import session from 'redux-persist/lib/storage/session';
 import thunkMiddleware from 'redux-thunk';
 import { createLogger } from 'redux-logger';
@@ -10,22 +11,9 @@ import * as EteSync from './api/EteSync';
 
 const loggerMiddleware = createLogger();
 
-enum Actions {
-  FETCH_CREDENTIALS = 'FETCH_CREDENTIALS',
-  FETCH_JOURNALS = 'FETCH_JOURNALS',
-  FETCH_ENTRIES = 'FETCH_ENTRIES',
-}
-
-export enum FetchStatus {
-  Initial = 'INITIAL',
-  Request = 'REQUEST',
-  Failure = 'FAILURE',
-  Success = 'SUCCESS',
-}
-
 export interface FetchType<T> {
-  status: FetchStatus;
   value: T | null;
+  fetching?: boolean;
   error?: Error;
 }
 
@@ -54,35 +42,26 @@ export interface StoreState {
   };
 }
 
-function credentialsSuccess(creds: CredentialsData) {
+function fetchTypeIdentityReducer(state: FetchType<any>, action: any) {
+  if (action.error) {
     return {
-    type: Actions.FETCH_CREDENTIALS,
-    status: FetchStatus.Success,
-    credentials: creds,
+      value: null,
+      error: action.payload,
     };
-}
-
-function credentialsRequest() {
+  } else {
+    const fetching = (action.payload === undefined) ? true : undefined;
     return {
-    type: Actions.FETCH_CREDENTIALS,
-    status: FetchStatus.Request,
+      fetching,
+      value: (action.payload === undefined) ? null : action.payload,
     };
   }
-
-function credentialsFailure(error: Error) {
-  return {
-    type: Actions.FETCH_CREDENTIALS,
-    status: FetchStatus.Failure,
-    error
-  };
 }
 
-export function fetchCredentials(username: string, password: string, encryptionPassword: string, server: string) {
+export const { fetchCredentials, logout } = createActions({
+  FETCH_CREDENTIALS: (username: string, password: string, encryptionPassword: string, server: string) => {
     const authenticator = new EteSync.Authenticator(server);
 
-    return (dispatch: any) => {
-      dispatch(credentialsRequest());
-
+    return new Promise((resolve, reject) => {
       authenticator.getAuthToken(username, password).then(
         (authToken) => {
           const creds = new EteSync.Credentials(username, authToken);
@@ -94,93 +73,52 @@ export function fetchCredentials(username: string, password: string, encryptionP
             encryptionKey: derived,
           };
 
-          dispatch(credentialsSuccess(context));
+          resolve(context);
         },
         (error) => {
-          dispatch(credentialsFailure(error));
+          reject(error);
         }
       );
-    };
-}
+    });
+  },
+  LOGOUT: () => undefined,
+});
 
-export function fetchJournals(etesync: CredentialsData) {
+export const { fetchJournals, fetchEntries } = createActions({
+  FETCH_JOURNALS: (etesync: CredentialsData) => {
     const creds = etesync.credentials;
     const apiBase = etesync.serviceApiUrl;
     let journalManager = new EteSync.JournalManager(creds, apiBase);
 
-  return {
-    type: Actions.FETCH_JOURNALS,
-    payload: journalManager.list(),
-  };
-}
-
-export function fetchEntries(etesync: CredentialsData, journalUid: string, prevUid: string | null) {
+    return journalManager.list();
+  },
+  FETCH_ENTRIES: [
+    (etesync: CredentialsData, journalUid: string, prevUid: string | null) => {
       const creds = etesync.credentials;
       const apiBase = etesync.serviceApiUrl;
       let entryManager = new EteSync.EntryManager(creds, apiBase, journalUid);
 
-  return {
-    type: Actions.FETCH_ENTRIES,
-    payload: entryManager.list(prevUid),
-    meta: { journal: journalUid, prevUid },
-  };
-}
-
-export function logout() {
-  return {
-    type: Actions.FETCH_CREDENTIALS,
-    status: FetchStatus.Initial,
-  };
-}
-
-function credentials(state: CredentialsType = {status: FetchStatus.Initial, value: null},
-                     action: any): CredentialsType {
-  switch (action.type) {
-    case Actions.FETCH_CREDENTIALS:
-      switch (action.status) {
-        case FetchStatus.Success:
-          return {
-            status: action.status,
-            value: action.credentials,
-          };
-        case FetchStatus.Failure:
-          return {
-            status: action.status,
-            value: null,
-            error: action.error,
-          };
-        default:
-          return {
-            status: action.status,
-            value: null,
-          };
-      }
-    default:
-      return state;
-  }
+      return entryManager.list(prevUid) as any;
+    },
+    (etesync: CredentialsData, journalUid: string, prevUid: string | null) => {
+      return { journal: journalUid, prevUid };
     }
+  ]
+});
 
-function journals(state: JournalsType = {status: FetchStatus.Initial, value: null}, action: any) {
-  switch (action.type) {
-    case Actions.FETCH_JOURNALS:
-      if (action.error) {
-        return {
-          value: null,
-          error: action.payload,
-        };
-      } else {
-        return {
-          value: (action.payload === undefined) ? null : action.payload,
-        };
-      }
-    default:
-      return state;
-  }
-}
+const credentials = handleActions(
+  {
+    [fetchCredentials.toString()]: fetchTypeIdentityReducer,
+    [logout.toString()]: (state: CredentialsType, action: any) => {
+      return {out: true, value: null};
+    },
+  },
+  {value: null}
+);
 
-function entries(state: EntriesType = {}, action: any) {
-  switch (action.type) {
-    case Actions.FETCH_ENTRIES:
+const entries = handleAction(
+  fetchEntries,
+  (state: EntriesType, action: any) => {
     if (action.error) {
       return { ...state,
         [action.meta.journal]: {
@@ -189,21 +127,29 @@ function entries(state: EntriesType = {}, action: any) {
         },
       };
     } else {
+      const fetching = (action.payload === undefined) ? true : undefined;
       return { ...state,
         [action.meta.journal]: {
+          fetching,
           value: (action.payload === undefined) ? null : action.payload,
         },
       };
     }
-    default:
-      return state;
-  }
-}
+  },
+  {}
+);
+
+const journals = handleAction(
+  fetchJournals,
+  fetchTypeIdentityReducer,
+  {value: null}
+);
 
 function fetchCount(state: number = 0, action: any) {
   switch (action.type) {
-    case Actions.FETCH_JOURNALS:
-    case Actions.FETCH_ENTRIES:
+    case fetchCredentials.toString():
+    case fetchJournals.toString():
+    case fetchEntries.toString():
       if (action.payload === undefined) {
         return state + 1;
       } else {