Merge branch 'master' of https://github.com/meetfranz/franz into franz-5.3.0

9 files changed, 146 insertions, 100 deletions

diff --git a/src/containers/auth/PricingScreen.js b/src/containers/auth/PricingScreen.js
index 8d179a170..af1651931 100644
--- a/src/containers/auth/PricingScreen.js
+++ b/src/containers/auth/PricingScreen.js
@@ -5,7 +5,6 @@ import { RouterStore } from 'mobx-react-router';
 
 import Pricing from '../../components/auth/Pricing';
 import UserStore from '../../stores/UserStore';
-import PaymentStore from '../../stores/PaymentStore';
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
@@ -14,20 +13,40 @@ export default @inject('stores', 'actions') @observer class PricingScreen extend
     error: globalErrorPropType.isRequired,
   };
 
+  async submit() {
+    const {
+      actions,
+      stores,
+    } = this.props;
+
+    const { activateTrialRequest } = stores.user;
+    const { defaultTrialPlan } = stores.features.features;
+
+    actions.user.activateTrial({ planId: defaultTrialPlan });
+    await activateTrialRequest._promise;
+
+    if (!activateTrialRequest.isError) {
+      stores.router.push('/');
+      stores.user.hasCompletedSignup = true;
+    }
+  }
+
   render() {
-    const { actions, stores, error } = this.props;
+    const {
+      error,
+      stores,
+    } = this.props;
 
-    const nextStepRoute = stores.user.legacyServices.length ? stores.user.importRoute : stores.user.inviteRoute;
+    const { getUserInfoRequest, activateTrialRequest } = stores.user;
+    const { featuresRequest } = stores.features;
 
     return (
       <Pricing
-        donor={stores.user.data.donor || {}}
-        onSubmit={actions.user.signup}
-        onCloseSubscriptionWindow={() => this.props.stores.router.push(nextStepRoute)}
-        isLoading={stores.payment.plansRequest.isExecuting}
-        isLoadingUser={stores.user.getUserInfoRequest.isExecuting}
+        onSubmit={this.submit.bind(this)}
+        isLoadingRequiredData={(getUserInfoRequest.isExecuting || !getUserInfoRequest.wasExecuted) || (featuresRequest.isExecuting || !featuresRequest.wasExecuted)}
+        isActivatingTrial={activateTrialRequest.isExecuting}
+        trialActivationError={activateTrialRequest.isError}
         error={error}
-        skipAction={() => this.props.stores.router.push(nextStepRoute)}
       />
     );
   }
@@ -36,12 +55,11 @@ export default @inject('stores', 'actions') @observer class PricingScreen extend
 PricingScreen.wrappedComponent.propTypes = {
   actions: PropTypes.shape({
     user: PropTypes.shape({
-      signup: PropTypes.func.isRequired,
+      activateTrial: PropTypes.func.isRequired,
     }).isRequired,
   }).isRequired,
   stores: PropTypes.shape({
     user: PropTypes.instanceOf(UserStore).isRequired,
-    payment: PropTypes.instanceOf(PaymentStore).isRequired,
     router: PropTypes.instanceOf(RouterStore).isRequired,
   }).isRequired,
 };
diff --git a/src/containers/layout/AppLayoutContainer.js b/src/containers/layout/AppLayoutContainer.js
index 38ed85986..95fbd109f 100644
--- a/src/containers/layout/AppLayoutContainer.js
+++ b/src/containers/layout/AppLayoutContainer.js
@@ -10,6 +10,7 @@ import FeaturesStore from '../../stores/FeaturesStore';
 import UIStore from '../../stores/UIStore';
 import NewsStore from '../../stores/NewsStore';
 import SettingsStore from '../../stores/SettingsStore';
+import UserStore from '../../stores/UserStore';
 import RequestStore from '../../stores/RequestStore';
 import GlobalErrorStore from '../../stores/GlobalErrorStore';
 
@@ -39,6 +40,7 @@ export default @inject('stores', 'actions') @observer class AppLayoutContainer e
       settings,
       globalError,
       requests,
+      user,
     } = this.props.stores;
 
     const {
@@ -125,6 +127,8 @@ export default @inject('stores', 'actions') @observer class AppLayoutContainer e
         reload={reload}
         openSettings={openSettings}
         update={updateService}
+        userHasCompletedSignup={user.hasCompletedSignup}
+        hasActivatedTrial={user.hasActivatedTrial}
       />
     );
 
@@ -150,6 +154,7 @@ export default @inject('stores', 'actions') @observer class AppLayoutContainer e
           retryRequiredRequests={retryRequiredRequests}
           areRequiredRequestsLoading={requests.areRequiredRequestsLoading}
           isDelayAppScreenVisible={delayAppState.isDelayAppScreenVisible}
+          hasActivatedTrial={user.hasActivatedTrial}
         >
           {React.Children.count(children) > 0 ? children : null}
         </AppLayout>
@@ -167,6 +172,7 @@ AppLayoutContainer.wrappedComponent.propTypes = {
     ui: PropTypes.instanceOf(UIStore).isRequired,
     news: PropTypes.instanceOf(NewsStore).isRequired,
     settings: PropTypes.instanceOf(SettingsStore).isRequired,
+    user: PropTypes.instanceOf(UserStore).isRequired,
     requests: PropTypes.instanceOf(RequestStore).isRequired,
     globalError: PropTypes.instanceOf(GlobalErrorStore).isRequired,
   }).isRequired,
diff --git a/src/containers/settings/AccountScreen.js b/src/containers/settings/AccountScreen.js
index fd3317301..41cdeb79a 100644
--- a/src/containers/settings/AccountScreen.js
+++ b/src/containers/settings/AccountScreen.js
@@ -30,7 +30,7 @@ export default @inject('stores', 'actions') @observer class AccountScreen extend
 
     let url;
     if (api === 'https://api.franzinfra.com') {
-      url = `${WEBSITE}${route}?authToken=${stores.user.authToken}&utm_source=app&utm_medium=account_dashboard`;
+      url = stores.user.getAuthURL(`${WEBSITE}${route}?utm_source=app&utm_medium=account_dashboard`);
     } else {
       url = `${api}${route}`;
     }
@@ -49,6 +49,8 @@ export default @inject('stores', 'actions') @observer class AccountScreen extend
       <ErrorBoundary>
         <AccountDashboard
           user={user.data}
+          isPremiumOverrideUser={user.isPremiumOverride}
+          isProUser={user.isPro}
           isLoading={isLoadingUserInfo}
           isLoadingPlans={isLoadingPlans}
           userInfoRequestFailed={user.getUserInfoRequest.wasExecuted && user.getUserInfoRequest.isError}
@@ -58,6 +60,7 @@ export default @inject('stores', 'actions') @observer class AccountScreen extend
           isLoadingDeleteAccount={user.deleteAccountRequest.isExecuting}
           isDeleteAccountSuccessful={user.deleteAccountRequest.wasExecuted && !user.deleteAccountRequest.isError}
           openEditAccount={() => this.handleWebsiteLink('/user/profile')}
+          upgradeToPro={() => this.handleWebsiteLink('/inapp/user/licenses')}
           openBilling={() => this.handleWebsiteLink('/user/billing')}
           openInvoices={() => this.handleWebsiteLink('/user/invoices')}
         />
diff --git a/src/containers/settings/EditServiceScreen.js b/src/containers/settings/EditServiceScreen.js
index 870ca4ecd..e4ff03bb3 100644
--- a/src/containers/settings/EditServiceScreen.js
+++ b/src/containers/settings/EditServiceScreen.js
@@ -330,8 +330,8 @@ export default @inject('stores', 'actions') @observer class EditServiceScreen ex
           onSubmit={d => this.onSubmit(d)}
           onDelete={() => this.deleteService()}
           isProxyFeatureEnabled={proxyFeature.isEnabled}
-          isProxyPremiumFeature={proxyFeature.isPremium}
-          isSpellcheckerPremiumFeature={spellcheckerFeature.isPremium}
+          isServiceProxyIncludedInCurrentPlan={proxyFeature.isIncludedInCurrentPlan}
+          isSpellcheckerIncludedInCurrentPlan={spellcheckerFeature.isIncludedInCurrentPlan}
         />
       </ErrorBoundary>
     );
diff --git a/src/containers/settings/EditSettingsScreen.js b/src/containers/settings/EditSettingsScreen.js
index 38f73c20f..954f64dc6 100644
--- a/src/containers/settings/EditSettingsScreen.js
+++ b/src/containers/settings/EditSettingsScreen.js
@@ -6,6 +6,7 @@ import { defineMessages, intlShape } from 'react-intl';
 import AppStore from '../../stores/AppStore';
 import SettingsStore from '../../stores/SettingsStore';
 import UserStore from '../../stores/UserStore';
+import TodosStore from '../../features/todos/store';
 import Form from '../../lib/Form';
 import { APP_LOCALES, SPELLCHECKER_LOCALES } from '../../i18n/languages';
 import { DEFAULT_APP_SETTINGS } from '../../config';
@@ -19,6 +20,7 @@ import ErrorBoundary from '../../components/util/ErrorBoundary';
 import { API } from '../../environment';
 
 import globalMessages from '../../i18n/globalMessages';
+import { DEFAULT_IS_FEATURE_ENABLED_BY_USER } from '../../features/todos';
 
 const messages = defineMessages({
   autoLaunchOnStart: {
@@ -73,6 +75,10 @@ const messages = defineMessages({
     id: 'settings.app.form.beta',
     defaultMessage: '!!!Include beta versions',
   },
+  enableTodos: {
+    id: 'settings.app.form.enableTodos',
+    defaultMessage: '!!!Enable Franz Todos',
+  },
 });
 
 export default @inject('stores', 'actions') @observer class EditSettingsScreen extends Component {
@@ -81,7 +87,13 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
   };
 
   onSubmit(settingsData) {
-    const { app, settings, user } = this.props.actions;
+    const { todos } = this.props.stores;
+    const {
+      app,
+      settings,
+      user,
+      todos: todosActions,
+    } = this.props.actions;
 
     app.launchOnStartup({
       enable: settingsData.autoLaunchOnStart,
@@ -112,10 +124,16 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
         locale: settingsData.locale,
       },
     });
+
+    if (todos.isFeatureActive) {
+      todosActions.toggleTodosFeatureVisibility();
+    }
   }
 
   prepareForm() {
-    const { app, settings, user } = this.props.stores;
+    const {
+      app, settings, user, todos,
+    } = this.props.stores;
     const { intl } = this.context;
 
     const locales = getSelectOptions({
@@ -171,8 +189,8 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
         },
         enableSpellchecking: {
           label: intl.formatMessage(messages.enableSpellchecking),
-          value: !this.props.stores.user.data.isPremium && spellcheckerConfig.isPremium ? false : settings.all.app.enableSpellchecking,
-          default: !this.props.stores.user.data.isPremium && spellcheckerConfig.isPremium ? false : DEFAULT_APP_SETTINGS.enableSpellchecking,
+          value: !this.props.stores.user.data.isPremium && !spellcheckerConfig.isIncludedInCurrentPlan ? false : settings.all.app.enableSpellchecking,
+          default: !this.props.stores.user.data.isPremium && !spellcheckerConfig.isIncludedInCurrentPlan ? false : DEFAULT_APP_SETTINGS.enableSpellchecking,
         },
         spellcheckerLanguage: {
           label: intl.formatMessage(globalMessages.spellcheckerLanguage),
@@ -204,16 +222,28 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
       },
     };
 
+    if (todos.isFeatureActive) {
+      config.fields.enableTodos = {
+        label: intl.formatMessage(messages.enableTodos),
+        value: todos.settings.isFeatureEnabledByUser,
+        default: DEFAULT_IS_FEATURE_ENABLED_BY_USER,
+      };
+    }
+
     return new Form(config);
   }
 
   render() {
     const {
+      app,
+      todos,
+    } = this.props.stores;
+    const {
       updateStatus,
       cacheSize,
       updateStatusTypes,
       isClearingAllCache,
-    } = this.props.stores.app;
+    } = app;
     const {
       checkForUpdates,
       installUpdate,
@@ -235,7 +265,8 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
           cacheSize={cacheSize}
           isClearingAllCache={isClearingAllCache}
           onClearAllCache={clearAllCache}
-          isSpellcheckerPremiumFeature={spellcheckerConfig.isPremium}
+          isSpellcheckerIncludedInCurrentPlan={spellcheckerConfig.isIncludedInCurrentPlan}
+          isTodosEnabled={todos.isFeatureActive}
         />
       </ErrorBoundary>
     );
@@ -247,6 +278,7 @@ EditSettingsScreen.wrappedComponent.propTypes = {
     app: PropTypes.instanceOf(AppStore).isRequired,
     user: PropTypes.instanceOf(UserStore).isRequired,
     settings: PropTypes.instanceOf(SettingsStore).isRequired,
+    todos: PropTypes.instanceOf(TodosStore).isRequired,
   }).isRequired,
   actions: PropTypes.shape({
     app: PropTypes.shape({
@@ -261,5 +293,8 @@ EditSettingsScreen.wrappedComponent.propTypes = {
     user: PropTypes.shape({
       update: PropTypes.func.isRequired,
     }).isRequired,
+    todos: PropTypes.shape({
+      toggleTodosFeatureVisibility: PropTypes.func.isRequired,
+    }).isRequired,
   }).isRequired,
 };
diff --git a/src/containers/settings/RecipesScreen.js b/src/containers/settings/RecipesScreen.js
index eda5ae54c..132820b6f 100644
--- a/src/containers/settings/RecipesScreen.js
+++ b/src/containers/settings/RecipesScreen.js
@@ -1,7 +1,9 @@
+import { remote, shell } from 'electron';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { autorun } from 'mobx';
 import { inject, observer } from 'mobx-react';
+import path from 'path';
 
 import RecipePreviewsStore from '../../stores/RecipePreviewsStore';
 import RecipeStore from '../../stores/RecipesStore';
@@ -10,6 +12,11 @@ import UserStore from '../../stores/UserStore';
 
 import RecipesDashboard from '../../components/settings/recipes/RecipesDashboard';
 import ErrorBoundary from '../../components/util/ErrorBoundary';
+import { FRANZ_DEV_DOCS } from '../../config';
+import { gaEvent } from '../../lib/analytics';
+import { communityRecipesStore } from '../../features/communityRecipes';
+
+const { app } = remote;
 
 export default @inject('stores', 'actions') @observer class RecipesScreen extends Component {
   static propTypes = {
@@ -67,9 +74,16 @@ export default @inject('stores', 'actions') @observer class RecipesScreen extend
 
   render() {
     const {
-      recipePreviews, recipes, services, user,
+      recipePreviews,
+      recipes,
+      services,
+      user,
     } = this.props.stores;
-    const { showAddServiceInterface } = this.props.actions.service;
+
+    const {
+      app: appActions,
+      service: serviceActions,
+    } = this.props.actions;
 
     const { filter } = this.props.params;
     let recipeFilter;
@@ -77,7 +91,7 @@ export default @inject('stores', 'actions') @observer class RecipesScreen extend
     if (filter === 'all') {
       recipeFilter = recipePreviews.all;
     } else if (filter === 'dev') {
-      recipeFilter = recipePreviews.dev;
+      recipeFilter = communityRecipesStore.communityRecipes;
     } else {
       recipeFilter = recipePreviews.featured;
     }
@@ -89,6 +103,8 @@ export default @inject('stores', 'actions') @observer class RecipesScreen extend
       || recipes.installRecipeRequest.isExecuting
       || recipePreviews.searchRecipePreviewsRequest.isExecuting;
 
+    const recipeDirectory = path.join(app.getPath('userData'), 'recipes', 'dev');
+
     return (
       <ErrorBoundary>
         <RecipesDashboard
@@ -97,12 +113,23 @@ export default @inject('stores', 'actions') @observer class RecipesScreen extend
           addedServiceCount={services.all.length}
           isPremium={user.data.isPremium}
           hasLoadedRecipes={recipePreviews.featuredRecipePreviewsRequest.wasExecuted}
-          showAddServiceInterface={showAddServiceInterface}
+          showAddServiceInterface={serviceActions.showAddServiceInterface}
           searchRecipes={e => this.searchRecipes(e)}
           resetSearch={() => this.resetSearch()}
           searchNeedle={this.state.needle}
           serviceStatus={services.actionStatus}
-          devRecipesCount={recipePreviews.dev.length}
+          recipeFilter={filter}
+          recipeDirectory={recipeDirectory}
+          openRecipeDirectory={() => {
+            shell.openItem(recipeDirectory);
+            gaEvent('Recipe', 'open-recipe-folder', 'Open Folder');
+          }}
+          openDevDocs={() => {
+            appActions.openExternalUrl({ url: FRANZ_DEV_DOCS });
+            gaEvent('Recipe', 'open-dev-docs', 'Developer Documentation');
+          }}
+          isCommunityRecipesIncludedInCurrentPlan={communityRecipesStore.isCommunityRecipesIncludedInCurrentPlan}
+          isUserPremiumUser={user.isPremium}
         />
       </ErrorBoundary>
     );
@@ -117,6 +144,9 @@ RecipesScreen.wrappedComponent.propTypes = {
     user: PropTypes.instanceOf(UserStore).isRequired,
   }).isRequired,
   actions: PropTypes.shape({
+    app: PropTypes.shape({
+      openExternalUrl: PropTypes.func.isRequired,
+    }).isRequired,
     service: PropTypes.shape({
       showAddServiceInterface: PropTypes.func.isRequired,
     }).isRequired,
diff --git a/src/containers/settings/TeamScreen.js b/src/containers/settings/TeamScreen.js
index c69d5ad08..f600c9947 100644
--- a/src/containers/settings/TeamScreen.js
+++ b/src/containers/settings/TeamScreen.js
@@ -14,7 +14,6 @@ export default @inject('stores', 'actions') @observer class TeamScreen extends C
     const { actions, stores } = this.props;
 
     const url = `${WEBSITE}${route}?authToken=${stores.user.authToken}&utm_source=app&utm_medium=account_dashboard`;
-    console.log(url);
 
     actions.app.openExternalUrl({ url });
   }
@@ -31,6 +30,7 @@ export default @inject('stores', 'actions') @observer class TeamScreen extends C
           userInfoRequestFailed={user.getUserInfoRequest.wasExecuted && user.getUserInfoRequest.isError}
           retryUserInfoRequest={() => this.reloadData()}
           openTeamManagement={() => this.handleWebsiteLink('/user/team')}
+          isProUser={user.isPro}
         />
       </ErrorBoundary>
     );
diff --git a/src/containers/subscription/SubscriptionFormScreen.js b/src/containers/subscription/SubscriptionFormScreen.js
index 3d153b8e8..726b10628 100644
--- a/src/containers/subscription/SubscriptionFormScreen.js
+++ b/src/containers/subscription/SubscriptionFormScreen.js
@@ -1,4 +1,3 @@
-import { remote } from 'electron';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { inject, observer } from 'mobx-react';
@@ -6,96 +5,50 @@ import { inject, observer } from 'mobx-react';
 import PaymentStore from '../../stores/PaymentStore';
 
 import SubscriptionForm from '../../components/subscription/SubscriptionForm';
-
-const { BrowserWindow } = remote;
+import TrialForm from '../../components/subscription/TrialForm';
 
 export default @inject('stores', 'actions') @observer class SubscriptionFormScreen extends Component {
-  static propTypes = {
-    onCloseWindow: PropTypes.func,
-    content: PropTypes.node,
-    showSkipOption: PropTypes.bool,
-    skipAction: PropTypes.func,
-    skipButtonLabel: PropTypes.string,
-    hideInfo: PropTypes.bool,
-  }
-
-  static defaultProps = {
-    onCloseWindow: () => null,
-    content: '',
-    showSkipOption: false,
-    skipAction: () => null,
-    skipButtonLabel: '',
-    hideInfo: false,
-  }
-
-  async handlePayment(plan) {
+  async openBrowser() {
     const {
       actions,
       stores,
-      onCloseWindow,
     } = this.props;
 
-    const interval = plan;
-
-    const { id } = stores.payment.plan[interval];
-    actions.payment.createHostedPage({
-      planId: id,
-    });
-
-    const hostedPage = await stores.payment.createHostedPageRequest;
+    const {
+      user,
+      features,
+    } = stores;
 
-    if (hostedPage.url) {
-      if (hostedPage.legacyCheckoutFlow) {
-        const paymentWindow = new BrowserWindow({
-          parent: remote.getCurrentWindow(),
-          modal: true,
-          title: '🔒 Ferdi Supporter License',
-          width: 600,
-          height: window.innerHeight - 100,
-          maxWidth: 600,
-          minWidth: 600,
-          webPreferences: {
-            nodeIntegration: true,
-            webviewTag: true,
-          },
-        });
-        paymentWindow.loadURL(`file://${__dirname}/../../index.html#/payment/${encodeURIComponent(hostedPage.url)}`);
+    let hostedPageURL = features.features.planSelectionURL;
+    hostedPageURL = user.getAuthURL(hostedPageURL);
 
-        paymentWindow.on('closed', () => {
-          onCloseWindow();
-        });
-      } else {
-        actions.app.openExternalUrl({
-          url: hostedPage.url,
-        });
-      }
-    }
+    actions.app.openExternalUrl({ url: hostedPageURL });
   }
 
   render() {
     const {
-      content,
       actions,
       stores,
-      showSkipOption,
-      skipAction,
-      skipButtonLabel,
-      hideInfo,
     } = this.props;
+
+    const { data: user } = stores.user;
+
+    if (user.hadSubscription) {
+      return (
+        <SubscriptionForm
+          plan={stores.payment.plan}
+          selectPlan={() => this.openBrowser()}
+          isActivatingTrial={stores.user.activateTrialRequest.isExecuting || stores.user.getUserInfoRequest.isExecuting}
+        />
+      );
+    }
+
     return (
-      <SubscriptionForm
+      <TrialForm
         plan={stores.payment.plan}
-        isLoading={stores.payment.plansRequest.isExecuting}
-        retryPlanRequest={() => stores.payment.plansRequest.reload()}
-        isCreatingHostedPage={stores.payment.createHostedPageRequest.isExecuting}
-        handlePayment={price => this.handlePayment(price)}
-        content={content}
-        error={stores.payment.plansRequest.isError}
-        showSkipOption={showSkipOption}
-        skipAction={skipAction}
-        skipButtonLabel={skipButtonLabel}
-        hideInfo={hideInfo}
-        openExternalUrl={actions.app.openExternalUrl}
+        activateTrial={() => actions.user.activateTrial({ planId: stores.features.features.defaultTrialPlan })}
+        showAllOptions={() => this.openBrowser()}
+        isActivatingTrial={stores.user.activateTrialRequest.isExecuting || stores.user.getUserInfoRequest.isExecuting}
       />
     );
   }
diff --git a/src/containers/subscription/SubscriptionPopupScreen.js b/src/containers/subscription/SubscriptionPopupScreen.js
index f76d6c5a6..0de5a87c4 100644
--- a/src/containers/subscription/SubscriptionPopupScreen.js
+++ b/src/containers/subscription/SubscriptionPopupScreen.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { inject, observer } from 'mobx-react';
 
 import SubscriptionPopup from '../../components/subscription/SubscriptionPopup';
+import { isDevMode } from '../../environment';
 
 
 export default @inject('stores', 'actions') @observer class SubscriptionPopupScreen extends Component {
@@ -13,7 +14,7 @@ export default @inject('stores', 'actions') @observer class SubscriptionPopupScr
   completeCheck(event) {
     const { url } = event;
 
-    if ((url.includes('recurly') && url.includes('confirmation')) || (url.includes('meetfranz') && url.includes('success'))) {
+    if ((url.includes('recurly') && url.includes('confirmation')) || ((url.includes('meetfranz') || isDevMode) && url.includes('success'))) {
       this.setState({
         complete: true,
       });