Implement save settings

client/coral-admin/src/actions/configure.js

@@ -3,3 +3,7 @@ import * as actions from 'constants/configure';
 export const updatePending = ({updater, errorUpdater}) => {
   return {type: actions.UPDATE_PENDING, updater, errorUpdater};
 };
+
+export const clearPending = () => {
+  return {type: actions.CLEAR_PENDING};
+};

client/coral-admin/src/constants/configure.js

@@ -1,3 +1,4 @@
 const prefix = 'CORAL_ADMIN';
 
 export const UPDATE_PENDING = `${prefix}_UPDATE_PENDING`;
+export const CLEAR_PENDING = `${prefix}_CLEAR_PENDING`;

client/coral-admin/src/graphql/index.js

@@ -29,6 +29,16 @@ export default {
         }
       }
     }),
+    UpdateSettings: ({variables: {input}})  => ({
+      updateQueries: {
+        TalkAdmin_Configure: (prev) => {
+          const updated = update(prev, {
+            settings: {$merge: input},
+          });
+          return updated;
+        }
+      }
+    }),
   },
 };
 

client/coral-admin/src/reducers/configure.js

@@ -30,6 +30,12 @@ export default function configure(state = initialState, action) {
 
     return next;
   }
+  case actions.CLEAR_PENDING:
+    return {
+      ...state,
+      pending: {},
+      canSave: false,
+    };
   }
   return state;
 }

client/coral-admin/src/routes/Configure/components/Configure.js

@@ -14,10 +14,6 @@ export default class Configure extends Component {
     activeSection: 'stream',
   };
 
-  saveSettings = () => {
-    this.props.saveSettingsToServer();
-  }
-
   changeSection = (activeSection) => {
     this.setState({activeSection});
   }
@@ -57,7 +53,7 @@ export default class Configure extends Component {
   render () {
     const {activeSection} = this.state;
     const section = this.getSection(activeSection);
-    const {auth: {user}, canSave} = this.props;
+    const {auth: {user}, canSave, savePending} = this.props;
 
     if (!can(user, 'UPDATE_CONFIG')) {
       return <p>You must be an administrator to access config settings. Please find the nearest Admin and ask them to level you up!</p>;
@@ -82,7 +78,7 @@ export default class Configure extends Component {
               canSave ?
                 <Button
                   raised
-                  onClick={this.saveSettings}
+                  onClick={savePending}
                   className={styles.changedSave}
                   icon='check'
                   full

client/coral-admin/src/routes/Configure/containers/Configure.js

@@ -6,8 +6,11 @@ import withQuery from 'coral-framework/hocs/withQuery';
 import {Spinner} from 'coral-ui';
 import {notify} from 'coral-framework/actions/notification';
 import merge from 'lodash/merge';
+import {withUpdateSettings} from 'coral-framework/graphql/mutations';
+import {getErrorMessages} from 'coral-framework/utils';
 import {
   updatePending,
+  clearPending,
 } from '../../../actions/configure';
 
 import Configure from '../components/Configure';
@@ -48,6 +51,16 @@ class ConfigureContainer extends Component {
     this.props.updatePending({updater: {$merge: settings}, errorUpdater: {$merge: setError}});
   };
 
+  savePending = async () => {
+    try {
+      await this.props.updateSettings(this.props.pending);
+      this.props.clearPending();
+    }
+    catch(err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+  };
+
   render () {
     if(this.props.data.loading) {
       return <Spinner/>;
@@ -66,12 +79,13 @@ class ConfigureContainer extends Component {
       root={this.props.root}
       settings={merged}
       canSave={this.props.canSave}
+      savePending={this.savePending}
     />;
   }
 }
 
 const withConfigureQuery = withQuery(gql`
-  query CoralEmbedStream_Embed {
+  query TalkAdmin_Configure {
     settings {
       moderation
       requireEmailConfirmation
@@ -115,9 +129,11 @@ const mapDispatchToProps = (dispatch) =>
   bindActionCreators({
     notify,
     updatePending,
+    clearPending,
   }, dispatch);
 
 export default compose(
+  withUpdateSettings,
   withConfigureQuery,
   connect(mapStateToProps, mapDispatchToProps),
 )(ConfigureContainer);

client/coral-framework/graphql/fragments.js

@@ -16,6 +16,7 @@ export default {
     'ModifyTagResponse',
     'IgnoreUserResponse',
     'StopIgnoringUserResponse',
+    'UpdateSettingsResponse',
   )
 };
 

client/coral-framework/graphql/mutations.js

@@ -340,3 +340,21 @@ export const withStopIgnoringUser = withMutation(
         });
       }}),
   });
+
+export const withUpdateSettings = withMutation(
+  gql`
+    mutation UpdateSettings($input: UpdateSettingsInput!) {
+      updateSettings(input: $input) {
+        ...UpdateSettingsResponse
+      }
+    }
+  `, {
+    props: ({mutate}) => ({
+      updateSettings: (input) => {
+        return mutate({
+          variables: {
+            input,
+          },
+        });
+      }}),
+  });