WIP

plugins/talk-plugin-global-switchoff/client/components/GlobalSwitchoff.js

@@ -0,0 +1,59 @@
+import React from 'react';
+import { gql } from 'react-apollo';
+import ConfigureCard from 'coral-framework/components/ConfigureCard';
+import MarkdownEditor from 'coral-framework/components/MarkdownEditor';
+import t from 'coral-framework/services/i18n';
+import { withFragments } from 'plugin-api/beta/client/hocs';
+import cn from 'classnames';
+import styles from './styles.css';
+
+const plugin = 'talk-plugin-global-switchoff';
+
+class GlobalSwitchoff extends React.Component {
+  updateGlobalSwitchoffEnable = () => {
+    const updater = {
+      globalSwitchoffEnable: {
+        $set: !this.props.settings.globalSwitchoffEnable,
+      },
+    };
+    this.props.updatePending({ updater });
+  };
+
+  updateGlobalSwitchoffMessage = () => {};
+
+  render() {
+    const { settings } = this.props;
+    return (
+      <ConfigureCard
+        checked={settings.globalSwitchoffEnable}
+        onCheckbox={this.updateGlobalSwitchoffEnable}
+        title={t(plugin + '.setting_title')}
+      >
+        <p>{t(plugin + '.setting_desc')}</p>
+        <div
+          className={cn(
+            styles.configSettingGlobalSwitchoff,
+            settings.globalSwitchoffEnable ? null : styles.hidden
+          )}
+        >
+          <MarkdownEditor
+            className={styles.descriptionBox}
+            onChange={this.updateGlobalSwitchoffMessage}
+            value={settings.globalSwitchoffMessage}
+          />
+        </div>
+      </ConfigureCard>
+    );
+  }
+}
+
+// export default GlobalSwitchoff;
+
+export default withFragments({
+  settings: gql`
+    fragment TalkPlugin_GlobalSwitchoff_settings on Settings {
+      globalSwitchoffEnable
+      globalSwitchoffMessage
+    }
+  `,
+})(GlobalSwitchoff);