11 files changed, 138 insertions, 47 deletions

diff --git a/src/components/settings/SettingsLayout.js b/src/components/settings/SettingsLayout.js
index d5392ddba..3cb08feb1 100644
--- a/src/components/settings/SettingsLayout.js
+++ b/src/components/settings/SettingsLayout.js
@@ -5,8 +5,7 @@ import { observer } from 'mobx-react';
 import { oneOrManyChildElements } from '../../prop-types';
 import Appear from '../ui/effects/Appear';
 
-@observer
-export default class SettingsLayout extends Component {
+export default @observer class SettingsLayout extends Component {
   static propTypes = {
     navigation: PropTypes.element.isRequired,
     children: oneOrManyChildElements.isRequired,
diff --git a/src/components/settings/account/AccountDashboard.js b/src/components/settings/account/AccountDashboard.js
index 4992f0913..06c7074dd 100644
--- a/src/components/settings/account/AccountDashboard.js
+++ b/src/components/settings/account/AccountDashboard.js
@@ -44,6 +44,10 @@ const messages = defineMessages({
     id: 'settings.account.accountType.premium',
     defaultMessage: '!!!Premium Supporter Account',
   },
+  accountTypeEnterprise: {
+    id: 'settings.account.accountType.enterprise',
+    defaultMessage: '!!!Enterprise Account',
+  },
   accountEditButton: {
     id: 'settings.account.account.editButton',
     defaultMessage: '!!!Edit Account',
@@ -74,8 +78,7 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class AccountDashboard extends Component {
+export default @observer class AccountDashboard extends Component {
   static propTypes = {
     user: MobxPropTypes.observableObject.isRequired,
     orders: MobxPropTypes.arrayOrObservableArray.isRequired,
@@ -167,17 +170,19 @@ export default class AccountDashboard extends Component {
                       </h2>
                       {user.organization && `${user.organization}, `}
                       {user.email}<br />
-                      {!user.isPremium && (
+                      {!user.isEnterprise && !user.isPremium && (
                         <span className="badge badge">{intl.formatMessage(messages.accountTypeBasic)}</span>
                       )}
                       {user.isPremium && (
                         <span className="badge badge--premium">{intl.formatMessage(messages.accountTypePremium)}</span>
                       )}
+                      {user.isEnterprise && (
+                        <span className="badge badge--success">{intl.formatMessage(messages.accountTypeEnterprise)}</span>
+                      )}
                     </div>
                     <Link to="/settings/user/edit" className="button">
                       {intl.formatMessage(messages.accountEditButton)}
                     </Link>
-
                     {user.emailValidated}
                   </div>
                 </div>
@@ -230,6 +235,33 @@ export default class AccountDashboard extends Component {
                 )
               )}
 
+              {user.isEnterprise && (
+                <div className="account">
+                  <div className="account__box">
+                    <h2>{user.company.name}</h2>
+                    <p>
+                      Technical contact:&nbsp;
+                      <Link
+                        className="link"
+                        target="_blank"
+                        to={`mailto:${user.company.contact.technical}?subject=Franz`}
+                      >
+                        {user.company.contact.technical}
+                      </Link>
+                      <br />
+                      General contact:&nbsp;
+                      <Link
+                        className="link"
+                        target="_blank"
+                        to={`mailto:${user.company.contact.default}?subject=Franz`}
+                      >
+                        {user.company.contact.default}
+                      </Link>
+                    </p>
+                  </div>
+                </div>
+              )}
+
               {user.isMiner && (
                 <div className="account franz-form">
                   <div className="account__box account__box">
@@ -244,7 +276,7 @@ export default class AccountDashboard extends Component {
                 </div>
               )}
 
-              {!user.isPremium && (
+              {!user.isEnterprise && !user.isPremium && (
                 isLoadingPlans ? (
                   <Loader />
                 ) : (
@@ -259,28 +291,29 @@ export default class AccountDashboard extends Component {
                 )
               )}
 
-              <div className="account franz-form">
-                <div className="account__box">
-                  <h2>{intl.formatMessage(messages.headlineDangerZone)}</h2>
-                  {!isDeleteAccountSuccessful && (
-                    <div className="account__subscription">
-                      <p>{intl.formatMessage(messages.deleteInfo)}</p>
-                      <Button
-                        label={intl.formatMessage(messages.deleteAccount)}
-                        buttonType="danger"
-                        onClick={() => deleteAccount()}
-                        loaded={!isLoadingDeleteAccount}
-                      />
-                    </div>
-                  )}
-                  {isDeleteAccountSuccessful && (
-                    <p>{intl.formatMessage(messages.deleteEmailSent)}</p>
-                  )}
+              {!user.isEnterprise && (
+                <div className="account franz-form">
+                  <div className="account__box">
+                    <h2>{intl.formatMessage(messages.headlineDangerZone)}</h2>
+                    {!isDeleteAccountSuccessful && (
+                      <div className="account__subscription">
+                        <p>{intl.formatMessage(messages.deleteInfo)}</p>
+                        <Button
+                          label={intl.formatMessage(messages.deleteAccount)}
+                          buttonType="danger"
+                          onClick={() => deleteAccount()}
+                          loaded={!isLoadingDeleteAccount}
+                        />
+                      </div>
+                    )}
+                    {isDeleteAccountSuccessful && (
+                      <p>{intl.formatMessage(messages.deleteEmailSent)}</p>
+                    )}
+                  </div>
                 </div>
-              </div>
+              )}
             </div>
           )}
-
         </div>
         <ReactTooltip place="right" type="dark" effect="solid" />
       </div>
diff --git a/src/components/settings/navigation/SettingsNavigation.js b/src/components/settings/navigation/SettingsNavigation.js
index 66539f324..b86d94ac7 100644
--- a/src/components/settings/navigation/SettingsNavigation.js
+++ b/src/components/settings/navigation/SettingsNavigation.js
@@ -1,6 +1,7 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, intlShape } from 'react-intl';
+import { inject, observer } from 'mobx-react';
 
 import Link from '../../ui/Link';
 
@@ -31,7 +32,7 @@ const messages = defineMessages({
   },
 });
 
-export default class SettingsNavigation extends Component {
+export default @inject('stores') @observer class SettingsNavigation extends Component {
   static propTypes = {
     serviceCount: PropTypes.number.isRequired,
   };
@@ -92,3 +93,4 @@ export default class SettingsNavigation extends Component {
     );
   }
 }
+
diff --git a/src/components/settings/recipes/RecipeItem.js b/src/components/settings/recipes/RecipeItem.js
index 7b2f64d26..dae8891b3 100644
--- a/src/components/settings/recipes/RecipeItem.js
+++ b/src/components/settings/recipes/RecipeItem.js
@@ -4,8 +4,7 @@ import { observer } from 'mobx-react';
 
 import RecipePreviewModel from '../../../models/RecipePreview';
 
-@observer
-export default class RecipeItem extends Component {
+export default @observer class RecipeItem extends Component {
   static propTypes = {
     recipe: PropTypes.instanceOf(RecipePreviewModel).isRequired,
     onClick: PropTypes.func.isRequired,
diff --git a/src/components/settings/recipes/RecipesDashboard.js b/src/components/settings/recipes/RecipesDashboard.js
index 4610c69a5..cd783200f 100644
--- a/src/components/settings/recipes/RecipesDashboard.js
+++ b/src/components/settings/recipes/RecipesDashboard.js
@@ -46,8 +46,7 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class RecipesDashboard extends Component {
+export default @observer class RecipesDashboard extends Component {
   static propTypes = {
     recipes: MobxPropTypes.arrayOrObservableArray.isRequired,
     isLoading: PropTypes.bool.isRequired,
diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js
index f6f2df2f3..d16ec35b8 100644
--- a/src/components/settings/services/EditServiceForm.js
+++ b/src/components/settings/services/EditServiceForm.js
@@ -15,6 +15,8 @@ import Toggle from '../../ui/Toggle';
 import Button from '../../ui/Button';
 import ImageUpload from '../../ui/ImageUpload';
 
+import PremiumFeatureContainer from '../../ui/PremiumFeatureContainer';
+
 const messages = defineMessages({
   saveService: {
     id: 'settings.service.form.saveButton',
@@ -92,10 +94,17 @@ const messages = defineMessages({
     id: 'settings.service.form.iconUpload',
     defaultMessage: '!!!Drop your image, or click here',
   },
+  headlineProxy: {
+    id: 'settings.service.form.proxy.headline',
+    defaultMessage: '!!!Proxy Settings',
+  },
+  proxyInfo: {
+    id: 'settings.service.form.proxy.info',
+    defaultMessage: '!!!Proxy settings will not be synchronized with the Franz servers.',
+  },
 });
 
-@observer
-export default class EditServiceForm extends Component {
+export default @observer class EditServiceForm extends Component {
   static propTypes = {
     recipe: PropTypes.instanceOf(Recipe).isRequired,
     service(props, propName) {
@@ -113,6 +122,8 @@ export default class EditServiceForm extends Component {
     onDelete: PropTypes.func.isRequired,
     isSaving: PropTypes.bool.isRequired,
     isDeleting: PropTypes.bool.isRequired,
+    isProxyFeatureEnabled: PropTypes.bool.isRequired,
+    isProxyFeaturePremiumFeature: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -173,6 +184,8 @@ export default class EditServiceForm extends Component {
       isSaving,
       isDeleting,
       onDelete,
+      isProxyFeatureEnabled,
+      isProxyFeaturePremiumFeature,
     } = this.props;
     const { intl } = this.context;
 
@@ -202,6 +215,8 @@ export default class EditServiceForm extends Component {
       activeTabIndex = 2;
     }
 
+    const requiresUserInput = !recipe.hasHostedOption && (recipe.hasTeamId || recipe.hasCustomUrl);
+
     return (
       <div className="settings__main">
         <div className="settings__header">
@@ -303,6 +318,9 @@ export default class EditServiceForm extends Component {
 
                 <div className="settings__settings-group">
                   <h3>{intl.formatMessage(messages.headlineGeneral)}</h3>
+                  {recipe.hasDarkMode && (
+                    <Toggle field={form.$('isDarkModeEnabled')} />
+                  )}
                   <Toggle field={form.$('isEnabled')} />
                 </div>
               </div>
@@ -314,6 +332,33 @@ export default class EditServiceForm extends Component {
                 />
               </div>
             </div>
+
+            {isProxyFeatureEnabled && (
+              <PremiumFeatureContainer condition={isProxyFeaturePremiumFeature}>
+                <div className="settings__settings-group">
+                  <h3>
+                    {intl.formatMessage(messages.headlineProxy)}
+                    <span className="badge badge--success">beta</span>
+                  </h3>
+                  <Toggle field={form.$('proxy.isEnabled')} />
+                  {form.$('proxy.isEnabled').value && (
+                    <div>
+                      <Input field={form.$('proxy.host')} />
+                      <Input field={form.$('proxy.user')} />
+                      <Input
+                        field={form.$('proxy.password')}
+                        showPasswordToggle
+                      />
+                      <p>
+                        <span className="mdi mdi-information" />
+                        {intl.formatMessage(messages.proxyInfo)}
+                      </p>
+                    </div>
+                  )}
+                </div>
+              </PremiumFeatureContainer>
+            )}
+
             {recipe.message && (
               <p className="settings__message">
                 <span className="mdi mdi-information" />
@@ -340,6 +385,7 @@ export default class EditServiceForm extends Component {
               type="submit"
               label={intl.formatMessage(messages.saveService)}
               htmlForm="form"
+              disabled={action !== 'edit' && form.isPristine && requiresUserInput}
             />
           )}
         </div>
diff --git a/src/components/settings/services/ServiceError.js b/src/components/settings/services/ServiceError.js
index 1f1512927..3cfc080d6 100644
--- a/src/components/settings/services/ServiceError.js
+++ b/src/components/settings/services/ServiceError.js
@@ -25,8 +25,7 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class ServiceError extends Component {
+export default @observer class ServiceError extends Component {
   static contextTypes = {
     intl: intlShape,
   };
diff --git a/src/components/settings/services/ServiceItem.js b/src/components/settings/services/ServiceItem.js
index 9743315b0..84080519b 100644
--- a/src/components/settings/services/ServiceItem.js
+++ b/src/components/settings/services/ServiceItem.js
@@ -22,8 +22,7 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class ServiceItem extends Component {
+export default @observer class ServiceItem extends Component {
   static propTypes = {
     service: PropTypes.instanceOf(ServiceModel).isRequired,
     goToServiceForm: PropTypes.func.isRequired,
diff --git a/src/components/settings/services/ServicesDashboard.js b/src/components/settings/services/ServicesDashboard.js
index 20e451f01..e7dfaf106 100644
--- a/src/components/settings/services/ServicesDashboard.js
+++ b/src/components/settings/services/ServicesDashboard.js
@@ -49,8 +49,7 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class ServicesDashboard extends Component {
+export default @observer class ServicesDashboard extends Component {
   static propTypes = {
     services: MobxPropTypes.arrayOrObservableArray.isRequired,
     isLoading: PropTypes.bool.isRequired,
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index 97f535594..1ec2ab614 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';
 
@@ -82,8 +83,7 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class EditSettingsForm extends Component {
+export default @observer class EditSettingsForm extends Component {
   static propTypes = {
     checkForUpdates: PropTypes.func.isRequired,
     installUpdate: PropTypes.func.isRequired,
@@ -96,6 +96,7 @@ export default class EditSettingsForm extends Component {
     isClearingAllCache: PropTypes.bool.isRequired,
     onClearAllCache: PropTypes.func.isRequired,
     cacheSize: PropTypes.string.isRequired,
+    isSpellcheckerPremiumFeature: PropTypes.bool.isRequired,
   };
 
   static contextTypes = {
@@ -125,6 +126,7 @@ export default class EditSettingsForm extends Component {
       isClearingAllCache,
       onClearAllCache,
       cacheSize,
+      isSpellcheckerPremiumFeature,
     } = this.props;
     const { intl } = this.context;
 
@@ -161,10 +163,23 @@ export default class EditSettingsForm extends Component {
             <h2 id="apperance">{intl.formatMessage(messages.headlineAppearance)}</h2>
             <Toggle field={form.$('showDisabledServices')} />
             <Toggle field={form.$('showMessageBadgeWhenMuted')} />
+            <Toggle field={form.$('darkMode')} />
 
             {/* Language */}
             <h2 id="language">{intl.formatMessage(messages.headlineLanguage)}</h2>
             <Select field={form.$('locale')} showLabel={false} />
+            <PremiumFeatureContainer
+              condition={isSpellcheckerPremiumFeature}
+            >
+              <div>
+                <Toggle
+                  field={form.$('enableSpellchecking')}
+                />
+                {form.$('enableSpellchecking').value && (
+                  <Select field={form.$('spellcheckerLanguage')} />
+                )}
+              </div>
+            </PremiumFeatureContainer>
             <a
               href={FRANZ_TRANSLATION}
               target="_blank"
@@ -175,10 +190,8 @@ export default class EditSettingsForm extends Component {
 
             {/* Advanced */}
             <h2 id="advanced">{intl.formatMessage(messages.headlineAdvanced)}</h2>
-            <Toggle field={form.$('enableSpellchecking')} />
             <Toggle field={form.$('enableGPUAcceleration')} />
             <p className="settings__help">{intl.formatMessage(messages.enableGPUAccelerationInfo)}</p>
-            {/* <Select field={form.$('spellcheckingLanguage')} /> */}
             <div className="settings__settings-group">
               <h3>
                 {intl.formatMessage(messages.subheadlineCache)}
diff --git a/src/components/settings/user/EditUserForm.js b/src/components/settings/user/EditUserForm.js
index f36887fc2..b825f844a 100644
--- a/src/components/settings/user/EditUserForm.js
+++ b/src/components/settings/user/EditUserForm.js
@@ -39,13 +39,13 @@ const messages = defineMessages({
   },
 });
 
-@observer
-export default class EditServiceForm extends Component {
+export default @observer class EditServiceForm extends Component {
   static propTypes = {
     status: MobxPropTypes.observableArray.isRequired,
     form: PropTypes.instanceOf(Form).isRequired,
     onSubmit: PropTypes.func.isRequired,
     isSaving: PropTypes.bool.isRequired,
+    isEnterprise: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -72,6 +72,7 @@ export default class EditServiceForm extends Component {
       // user,
       status,
       form,
+      isEnterprise,
       isSaving,
     } = this.props;
     const { intl } = this.context;
@@ -105,8 +106,10 @@ export default class EditServiceForm extends Component {
               <Input field={form.$('lastname')} />
             </div>
             <Input field={form.$('email')} />
-            <Radio field={form.$('accountType')} />
-            {form.$('accountType').value === 'company' && (
+            {!isEnterprise && (
+              <Radio field={form.$('accountType')} />
+            )}
+            {!isEnterprise && form.$('accountType').value === 'company' && (
               <Input field={form.$('organization')} />
             )}
             <h2>{intl.formatMessage(messages.headlinePassword)}</h2>