Move spellchecker to premium

1 files changed, 15 insertions, 1 deletions

diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index b5c048ebd..b87c11fc4 100644
--- a/src/components/settings/settings/EditSettingsForm.js
+++ b/src/components/settings/settings/EditSettingsForm.js
@@ -8,6 +8,7 @@ import Form from '../../../lib/Form';
 import Button from '../../ui/Button';
 import Toggle from '../../ui/Toggle';
 import Select from '../../ui/Select';
+import PremiumFeatureContainer from '../../ui/PremiumFeatureContainer';
 
 import { FRANZ_TRANSLATION } from '../../../config';
 
@@ -95,6 +96,8 @@ export default @observer class EditSettingsForm extends Component {
     isClearingAllCache: PropTypes.bool.isRequired,
     onClearAllCache: PropTypes.func.isRequired,
     cacheSize: PropTypes.string.isRequired,
+    isPremiumUser: PropTypes.bool.isRequired,
+    isSpellcheckerPremiumFeature: PropTypes.bool.isRequired,
   };
 
   static contextTypes = {
@@ -124,6 +127,8 @@ export default @observer class EditSettingsForm extends Component {
       isClearingAllCache,
       onClearAllCache,
       cacheSize,
+      isPremiumUser,
+      isSpellcheckerPremiumFeature,
     } = this.props;
     const { intl } = this.context;
 
@@ -175,7 +180,16 @@ export default @observer class EditSettingsForm extends Component {
 
             {/* Advanced */}
             <h2 id="advanced">{intl.formatMessage(messages.headlineAdvanced)}</h2>
-            <Toggle field={form.$('enableSpellchecking')} />
+            {!isPremiumUser && isSpellcheckerPremiumFeature ? (
+              <PremiumFeatureContainer>
+                <Toggle
+                  field={form.$('enableSpellchecking')}
+                  disabled
+                />
+              </PremiumFeatureContainer>
+            ) : (
+              <Toggle field={form.$('enableSpellchecking')} />
+            )}
             <Toggle field={form.$('enableGPUAcceleration')} />
             <p className="settings__help">{intl.formatMessage(messages.enableGPUAccelerationInfo)}</p>
             {/* <Select field={form.$('spellcheckingLanguage')} /> */}