16 files changed, 215 insertions, 46 deletions

diff --git a/src/api/FeaturesApi.js b/src/api/FeaturesApi.js
new file mode 100644
index 000000000..c66f28f5b
--- /dev/null
+++ b/src/api/FeaturesApi.js
@@ -0,0 +1,13 @@
+export default class FeaturesApi {
+  constructor(server) {
+    this.server = server;
+  }
+
+  default() {
+    return this.server.getDefaultFeatures();
+  }
+
+  features() {
+    return this.server.getFeatures();
+  }
+}
diff --git a/src/api/RecipesApi.js b/src/api/RecipesApi.js
index 0573dacaf..800888b00 100644
--- a/src/api/RecipesApi.js
+++ b/src/api/RecipesApi.js
@@ -1,4 +1,4 @@
-export default class ServicesApi {
+export default class RecipesApi {
   constructor(server) {
     this.server = server;
   }
diff --git a/src/api/index.js b/src/api/index.js
index 3fc18c4b5..3c87cc087 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -6,12 +6,14 @@ import UserApi from './UserApi';
 import LocalApi from './LocalApi';
 import PaymentApi from './PaymentApi';
 import NewsApi from './NewsApi';
+import FeaturesApi from './FeaturesApi';
 
 export default (server, local) => ({
   app: new AppApi(server, local),
   services: new ServicesApi(server, local),
   recipePreviews: new RecipePreviewsApi(server, local),
   recipes: new RecipesApi(server, local),
+  features: new FeaturesApi(server, local),
   user: new UserApi(server, local),
   local: new LocalApi(server, local),
   payment: new PaymentApi(server, local),
diff --git a/src/api/server/ServerApi.js b/src/api/server/ServerApi.js
index ad1ffa59a..164419951 100644
--- a/src/api/server/ServerApi.js
+++ b/src/api/server/ServerApi.js
@@ -261,6 +261,35 @@ export default class ServerApi {
     return data;
   }
 
+  // Features
+  async getDefaultFeatures() {
+    const request = await window.fetch(`${SERVER_URL}/${API_VERSION}/features/default`, this._prepareAuthRequest({
+      method: 'GET',
+    }));
+    if (!request.ok) {
+      throw request;
+    }
+    const data = await request.json();
+
+    const features = data;
+    console.debug('ServerApi::getDefaultFeatures resolves', features);
+    return features;
+  }
+
+  async getFeatures() {
+    const request = await window.fetch(`${SERVER_URL}/${API_VERSION}/features`, this._prepareAuthRequest({
+      method: 'GET',
+    }));
+    if (!request.ok) {
+      throw request;
+    }
+    const data = await request.json();
+
+    const features = data;
+    console.debug('ServerApi::getFeatures resolves', features);
+    return features;
+  }
+
   // Recipes
   async getInstalledRecipes() {
     const recipesDirectory = getRecipeDirectory();
diff --git a/src/components/settings/account/AccountDashboard.js b/src/components/settings/account/AccountDashboard.js
index 2fcfdfc9a..ede519fd6 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',
@@ -166,17 +170,21 @@ export default @observer 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.isSSO && (
+                      <Link to="/settings/user/edit" className="button">
+                        {intl.formatMessage(messages.accountEditButton)}
+                      </Link>
+                    )}
                     {user.emailValidated}
                   </div>
                 </div>
@@ -229,6 +237,33 @@ export default @observer 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">
@@ -243,7 +278,7 @@ export default @observer class AccountDashboard extends Component {
                 </div>
               )}
 
-              {!user.isPremium && (
+              {!user.isEnterprise && !user.isPremium && (
                 isLoadingPlans ? (
                   <Loader />
                 ) : (
@@ -258,28 +293,29 @@ export default @observer 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..46b2f82fc 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,6 +32,7 @@ const messages = defineMessages({
   },
 });
 
+@inject('stores') @observer
 export default class SettingsNavigation extends Component {
   static propTypes = {
     serviceCount: PropTypes.number.isRequired,
@@ -42,17 +44,20 @@ export default class SettingsNavigation extends Component {
 
   render() {
     const { serviceCount } = this.props;
+    const { features } = this.props.stores.features;
     const { intl } = this.context;
 
     return (
       <div className="settings-navigation">
-        <Link
-          to="/settings/recipes"
-          className="settings-navigation__link"
-          activeClassName="is-active"
-        >
-          {intl.formatMessage(messages.availableServices)}
-        </Link>
+        {features.userCanManageServices && (
+          <Link
+            to="/settings/recipes"
+            className="settings-navigation__link"
+            activeClassName="is-active"
+          >
+            {intl.formatMessage(messages.availableServices)}
+          </Link>
+        )}
         <Link
           to="/settings/services"
           className="settings-navigation__link"
@@ -92,3 +97,12 @@ export default class SettingsNavigation extends Component {
     );
   }
 }
+
+SettingsNavigation.wrappedComponent.propTypes = {
+  stores: PropTypes.shape({
+    features: PropTypes.shape({
+      features: PropTypes.object.isRequired,
+    }).isRequired,
+  }).isRequired,
+};
+
diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js
index f9afe4c8d..777a95fcf 100644
--- a/src/components/settings/services/EditServiceForm.js
+++ b/src/components/settings/services/EditServiceForm.js
@@ -106,6 +106,7 @@ export default @observer class EditServiceForm extends Component {
       return null;
     },
     user: PropTypes.instanceOf(User).isRequired,
+    userCanManageServices: PropTypes.bool.isRequired,
     action: PropTypes.string.isRequired,
     form: PropTypes.instanceOf(Form).isRequired,
     onSubmit: PropTypes.func.isRequired,
@@ -168,6 +169,7 @@ export default @observer class EditServiceForm extends Component {
       service,
       action,
       user,
+      userCanManageServices,
       form,
       isSaving,
       isDeleting,
@@ -326,7 +328,7 @@ export default @observer class EditServiceForm extends Component {
         </div>
         <div className="settings__controls">
           {/* Delete Button */}
-          {action === 'edit' && deleteButton}
+          {action === 'edit' && userCanManageServices && deleteButton}
 
           {/* Save Button */}
           {isSaving || isValidatingCustomUrl ? (
diff --git a/src/components/settings/user/EditUserForm.js b/src/components/settings/user/EditUserForm.js
index 6c0305089..b825f844a 100644
--- a/src/components/settings/user/EditUserForm.js
+++ b/src/components/settings/user/EditUserForm.js
@@ -45,6 +45,7 @@ export default @observer class EditServiceForm extends Component {
     form: PropTypes.instanceOf(Form).isRequired,
     onSubmit: PropTypes.func.isRequired,
     isSaving: PropTypes.bool.isRequired,
+    isEnterprise: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -71,6 +72,7 @@ export default @observer class EditServiceForm extends Component {
       // user,
       status,
       form,
+      isEnterprise,
       isSaving,
     } = this.props;
     const { intl } = this.context;
@@ -104,8 +106,10 @@ export default @observer 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>
diff --git a/src/components/ui/Input.js b/src/components/ui/Input.js
index 7fc5b69b0..7bf6e1b00 100644
--- a/src/components/ui/Input.js
+++ b/src/components/ui/Input.js
@@ -96,6 +96,7 @@ export default @observer class Input extends Component {
             onBlur={field.onBlur}
             onFocus={field.onFocus}
             ref={(element) => { this.inputElement = element; }}
+            disabled={field.disabled}
           />
           {suffix && (
             <span className="franz-form__input-suffix">{suffix}</span>
diff --git a/src/containers/auth/AuthLayoutContainer.js b/src/containers/auth/AuthLayoutContainer.js
index a25a1fd5e..b73598f3d 100644
--- a/src/containers/auth/AuthLayoutContainer.js
+++ b/src/containers/auth/AuthLayoutContainer.js
@@ -5,6 +5,7 @@ import { inject, observer } from 'mobx-react';
 import AuthLayout from '../../components/auth/AuthLayout';
 import AppStore from '../../stores/AppStore';
 import GlobalErrorStore from '../../stores/GlobalErrorStore';
+import AppLoader from '../../components/ui/AppLoader';
 
 import { oneOrManyChildElements } from '../../prop-types';
 
@@ -18,17 +19,27 @@ export default @inject('stores', 'actions') @observer class AuthLayoutContainer
 
   render() {
     const { stores, actions, children, location } = this.props;
+    const { app, features, globalError } = stores;
+
+    const isLoadingBaseFeatures = features.defaultFeaturesRequest.isExecuting
+      && !features.defaultFeaturesRequest.wasExecuted;
+
+    if (isLoadingBaseFeatures) {
+      return (
+        <AppLoader />
+      );
+    }
 
     return (
       <AuthLayout
-        error={stores.globalError.response}
+        error={globalError.response}
         pathname={location.pathname}
-        isOnline={stores.app.isOnline}
-        isAPIHealthy={!stores.app.healthCheckRequest.isError}
+        isOnline={app.isOnline}
+        isAPIHealthy={!app.healthCheckRequest.isError}
         retryHealthCheck={actions.app.healthCheck}
-        isHealthCheckLoading={stores.app.healthCheckRequest.isExecuting}
-        isFullScreen={stores.app.isFullScreen}
-        darkMode={stores.app.isSystemDarkModeEnabled}
+        isHealthCheckLoading={app.healthCheckRequest.isExecuting}
+        isFullScreen={app.isFullScreen}
+        darkMode={app.isSystemDarkModeEnabled}
       >
         {children}
       </AuthLayout>
diff --git a/src/containers/layout/AppLayoutContainer.js b/src/containers/layout/AppLayoutContainer.js
index fb3be13c0..affc1a0a2 100644
--- a/src/containers/layout/AppLayoutContainer.js
+++ b/src/containers/layout/AppLayoutContainer.js
@@ -5,6 +5,7 @@ import { inject, observer } from 'mobx-react';
 import AppStore from '../../stores/AppStore';
 import RecipesStore from '../../stores/RecipesStore';
 import ServicesStore from '../../stores/ServicesStore';
+import FeaturesStore from '../../stores/FeaturesStore';
 import UIStore from '../../stores/UIStore';
 import NewsStore from '../../stores/NewsStore';
 import SettingsStore from '../../stores/SettingsStore';
@@ -25,6 +26,7 @@ export default @inject('stores', 'actions') @observer class AppLayoutContainer e
   render() {
     const {
       app,
+      features,
       services,
       ui,
       news,
@@ -63,10 +65,13 @@ export default @inject('stores', 'actions') @observer class AppLayoutContainer e
 
     const { children } = this.props;
 
+    const isLoadingFeatures = features.featuresRequest.isExecuting
+      && !features.featuresRequest.wasExecuted;
+
     const isLoadingServices = services.allServicesRequest.isExecuting
       && services.allServicesRequest.isExecutingFirstTime;
 
-    if (isLoadingServices) {
+    if (isLoadingFeatures || isLoadingServices) {
       return (
         <AppLoader />
       );
@@ -131,6 +136,7 @@ export default @inject('stores', 'actions') @observer class AppLayoutContainer e
 AppLayoutContainer.wrappedComponent.propTypes = {
   stores: PropTypes.shape({
     services: PropTypes.instanceOf(ServicesStore).isRequired,
+    features: PropTypes.instanceOf(FeaturesStore).isRequired,
     recipes: PropTypes.instanceOf(RecipesStore).isRequired,
     app: PropTypes.instanceOf(AppStore).isRequired,
     ui: PropTypes.instanceOf(UIStore).isRequired,
diff --git a/src/containers/settings/EditServiceScreen.js b/src/containers/settings/EditServiceScreen.js
index e69c2c2a8..17d727642 100644
--- a/src/containers/settings/EditServiceScreen.js
+++ b/src/containers/settings/EditServiceScreen.js
@@ -6,6 +6,7 @@ import { defineMessages, intlShape } from 'react-intl';
 import UserStore from '../../stores/UserStore';
 import RecipesStore from '../../stores/RecipesStore';
 import ServicesStore from '../../stores/ServicesStore';
+import FeaturesStore from '../../stores/FeaturesStore';
 import SettingsStore from '../../stores/SettingsStore';
 import Form from '../../lib/Form';
 import { gaPage } from '../../lib/analytics';
@@ -81,7 +82,7 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
     }
   }
 
-  prepareForm(recipe, service) {
+  prepareForm(recipe, service, userCanManageServices) {
     const { intl } = this.context;
     const config = {
       fields: {
@@ -127,6 +128,7 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
     if (recipe.hasTeamId) {
       Object.assign(config.fields, {
         team: {
+          disabled: !userCanManageServices,
           label: intl.formatMessage(messages.team),
           placeholder: intl.formatMessage(messages.team),
           value: service.team,
@@ -138,6 +140,7 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
     if (recipe.hasCustomUrl) {
       Object.assign(config.fields, {
         customUrl: {
+          disabled: !userCanManageServices,
           label: intl.formatMessage(messages.customUrl),
           placeholder: 'https://',
           value: service.customUrl,
@@ -189,7 +192,7 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
   }
 
   render() {
-    const { recipes, services, user } = this.props.stores;
+    const { recipes, services, user, features } = this.props.stores;
     const { action } = this.props.router.params;
 
     let recipe;
@@ -224,7 +227,8 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
       );
     }
 
-    const form = this.prepareForm(recipe, service);
+    const userCanManageServices = features.features.userCanManageServices;
+    const form = this.prepareForm(recipe, service, userCanManageServices);
 
     return (
       <EditServiceForm
@@ -232,6 +236,7 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
         recipe={recipe}
         service={service}
         user={user.data}
+        userCanManageServices={userCanManageServices}
         form={form}
         status={services.actionStatus}
         isSaving={services.updateServiceRequest.isExecuting || services.createServiceRequest.isExecuting}
@@ -248,6 +253,7 @@ EditServiceScreen.wrappedComponent.propTypes = {
     user: PropTypes.instanceOf(UserStore).isRequired,
     recipes: PropTypes.instanceOf(RecipesStore).isRequired,
     services: PropTypes.instanceOf(ServicesStore).isRequired,
+    features: PropTypes.instanceOf(FeaturesStore).isRequired,
     settings: PropTypes.instanceOf(SettingsStore).isRequired,
   }).isRequired,
   router: PropTypes.shape({
diff --git a/src/containers/settings/EditUserScreen.js b/src/containers/settings/EditUserScreen.js
index 4c5a9117e..3da3e8d2c 100644
--- a/src/containers/settings/EditUserScreen.js
+++ b/src/containers/settings/EditUserScreen.js
@@ -144,6 +144,7 @@ export default @inject('stores', 'actions') @observer class EditUserScreen exten
         // user={user.data}
         status={user.actionStatus}
         form={form}
+        isEnterprise={user.data.isEnterprise}
         isSaving={user.updateUserInfoRequest.isExecuting}
         onSubmit={d => this.onSubmit(d)}
       />
diff --git a/src/stores/FeaturesStore.js b/src/stores/FeaturesStore.js
new file mode 100644
index 000000000..f788c347d
--- /dev/null
+++ b/src/stores/FeaturesStore.js
@@ -0,0 +1,36 @@
+import { computed, observable } from 'mobx';
+
+import Store from './lib/Store';
+import CachedRequest from './lib/CachedRequest';
+
+export default class FeaturesStore extends Store {
+  @observable defaultFeaturesRequest = new CachedRequest(this.api.features, 'default');
+  @observable featuresRequest = new CachedRequest(this.api.features, 'features');
+
+  setup() {
+    this.registerReactions([
+      this._monitorLoginStatus.bind(this),
+      this._debugFeatures.bind(this),
+    ]);
+  }
+
+  @computed get features() {
+    if (this.stores.user.isLoggedIn) {
+      return this.featuresRequest.execute().result || {};
+    }
+
+    return this.defaultFeaturesRequest.execute().result || {};
+  }
+
+  _debugFeatures() {
+    console.log(this.features);
+  }
+
+  _monitorLoginStatus() {
+    if (this.stores.user.isLoggedIn) {
+      this.featuresRequest.invalidate({ immediately: true });
+    } else {
+      this.defaultFeaturesRequest.invalidate({ immediately: true });
+    }
+  }
+}
diff --git a/src/stores/index.js b/src/stores/index.js
index 2d99e3952..96b844c95 100644
--- a/src/stores/index.js
+++ b/src/stores/index.js
@@ -1,5 +1,6 @@
 import AppStore from './AppStore';
 import UserStore from './UserStore';
+import FeaturesStore from './FeaturesStore';
 import SettingsStore from './SettingsStore';
 import ServicesStore from './ServicesStore';
 import RecipesStore from './RecipesStore';
@@ -16,6 +17,7 @@ export default (api, actions, router) => {
     router,
     app: new AppStore(stores, api, actions),
     user: new UserStore(stores, api, actions),
+    features: new FeaturesStore(stores, api, actions),
     settings: new SettingsStore(stores, api, actions),
     services: new ServicesStore(stores, api, actions),
     recipes: new RecipesStore(stores, api, actions),
diff --git a/src/styles/badge.scss b/src/styles/badge.scss
index 913a273df..f9fac039a 100644
--- a/src/styles/badge.scss
+++ b/src/styles/badge.scss
@@ -25,4 +25,10 @@
     background: $theme-brand-primary;
     color: #FFF;
   }
+
+  &.badge--success {
+    background: $theme-brand-success;
+    color: #FFF;
+  }
+
 }