fix: add ability to subscribe without account (#722)

app/assets/javascripts/app.ts

@@ -7,6 +7,8 @@ declare global {
     // eslint-disable-next-line camelcase
     _purchase_url?: string;
     // eslint-disable-next-line camelcase
+    _plans_url?: string;
+    // eslint-disable-next-line camelcase
     _dashboard_url?: string;
   }
 }

app/assets/javascripts/preferences/panes/account/subscription/NoSubscription.tsx

@@ -42,7 +42,7 @@ export const NoSubscription: FunctionalComponent<{
         <LinkButton
           className="min-w-20 mt-3 mr-3"
           label="Learn More"
-          link="https://standardnotes.com/plans"
+          link={window._plans_url as string}
         />
         {application.hasAccount() &&
           <Button

app/assets/javascripts/purchaseFlow/PurchaseFlowWrapper.tsx

@@ -11,10 +11,13 @@ export type PurchaseFlowWrapperProps = {
 };
 
 export const getPurchaseFlowUrl = async (application: WebApplication): Promise<string | undefined> => {
+  const currentUrl = window.location.href;
+  const successUrl = isDesktopApplication() ? `standardnotes://${currentUrl}` : currentUrl;
+  if (application.noAccount()) {
+    return `${window._purchase_url}/offline?&success_url=${successUrl}`;
+  }
   const token = await application.getNewSubscriptionToken();
   if (token) {
-    const currentUrl = window.location.href;
-    const successUrl = isDesktopApplication() ? `standardnotes://${currentUrl}` : currentUrl;
     return `${window._purchase_url}?subscription_token=${token}&success_url=${successUrl}`;
   }
   return undefined;

app/assets/javascripts/purchaseFlow/panes/CreateAccount.tsx

@@ -60,6 +60,13 @@ export const CreateAccount: FunctionComponent<Props> = observer(
       setCurrentPane(PurchaseFlowPane.SignIn);
     };
 
+    const subscribeWithoutAccount = () => {
+      loadPurchaseFlowUrl(application).catch((err) => {
+        console.error(err);
+        application.alertService.alert(err);
+      });
+    };
+
     const handleCreateAccount = async () => {
       if (!email) {
         emailInputRef?.current!.focus();
@@ -192,6 +199,13 @@ export const CreateAccount: FunctionComponent<Props> = observer(
               disabled={isCreatingAccount}
             />
           </div>
+          <button
+              onClick={subscribeWithoutAccount}
+              disabled={isCreatingAccount}
+              className="p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
+            >
+              Subscribe without account
+            </button>
         </div>
         <Illustration />
       </div>