From 561ebcadcf93cdd22c151713772a72d2b8ca7b7d Mon Sep 17 00:00:00 2001
From: Mo <mo@standardnotes.com>
Date: Fri, 7 Jan 2022 11:21:03 -0600
Subject: [PATCH] feat(dev): preload dev account from .env (#803)

---
 .env.sample                                      |  4 ++++
 app/assets/javascripts/app.ts                    | 16 +++++++++++-----
 .../components/AccountMenu/AdvancedOptions.tsx   |  7 +++++++
 .../components/AccountMenu/SignIn.tsx            |  6 ++++++
 index.html                                       |  8 +++++++-
 5 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/.env.sample b/.env.sample
index 9909770d6..195dd62c9 100644
--- a/.env.sample
+++ b/.env.sample
@@ -24,3 +24,7 @@ NEW_RELIC_THREAD_PROFILER_ENABLED=false
 NEW_RELIC_LICENSE_KEY=
 NEW_RELIC_APP_NAME=Web
 NEW_RELIC_BROWSER_MONITORING_AUTO_INSTRUMENT=false
+
+DEV_ACCOUNT_EMAIL=
+DEV_ACCOUNT_PASSWORD=
+DEV_ACCOUNT_SERVER=
diff --git a/app/assets/javascripts/app.ts b/app/assets/javascripts/app.ts
index bd5d4e066..d939bba17 100644
--- a/app/assets/javascripts/app.ts
+++ b/app/assets/javascripts/app.ts
@@ -17,6 +17,10 @@ declare global {
     // eslint-disable-next-line camelcase
     _websocket_url: string;
     startApplication?: StartApplication;
+
+    _devAccountEmail?: string;
+    _devAccountPassword?: string;
+    _devAccountServer?: string;
   }
 }
 
@@ -26,9 +30,11 @@ import { PinNoteButtonDirective } from '@/components/PinNoteButton';
 import { IsWebPlatform, WebAppVersion } from '@/version';
 import {
   ApplicationGroupView,
-  ApplicationView, ChallengeModal,
-  FooterView, NoteGroupViewDirective,
-  NoteViewDirective
+  ApplicationView,
+  ChallengeModal,
+  FooterView,
+  NoteGroupViewDirective,
+  NoteViewDirective,
 } from '@/views';
 import { SNLog } from '@standardnotes/snjs';
 import angular from 'angular';
@@ -55,7 +61,7 @@ import {
   infiniteScroll,
   lowercase,
   selectOnFocus,
-  snEnter
+  snEnter,
 } from './directives/functional';
 import {
   ActionsMenu,
@@ -67,7 +73,7 @@ import {
   PasswordWizard,
   PermissionsModal,
   RevisionPreviewModal,
-  SyncResolutionMenu
+  SyncResolutionMenu,
 } from './directives/views';
 import { trusted } from './filters';
 import { PreferencesDirective } from './preferences';
diff --git a/app/assets/javascripts/components/AccountMenu/AdvancedOptions.tsx b/app/assets/javascripts/components/AccountMenu/AdvancedOptions.tsx
index 1a75878df..cdae6ca3c 100644
--- a/app/assets/javascripts/components/AccountMenu/AdvancedOptions.tsx
+++ b/app/assets/javascripts/components/AccountMenu/AdvancedOptions.tsx
@@ -1,5 +1,6 @@
 import { WebApplication } from '@/ui_models/application';
 import { AppState } from '@/ui_models/app_state';
+import { isDev } from '@/utils';
 import { observer } from 'mobx-react-lite';
 import { FunctionComponent } from 'preact';
 import { useState } from 'preact/hooks';
@@ -19,6 +20,12 @@ export const AdvancedOptions: FunctionComponent<Props> = observer(
       appState.accountMenu;
     const [showAdvanced, setShowAdvanced] = useState(false);
 
+    if (isDev && window._devAccountServer) {
+      setEnableServerOption(true);
+      setServer(window._devAccountServer);
+      application.setCustomHost(window._devAccountServer);
+    }
+
     const handleServerOptionChange = (e: Event) => {
       if (e.target instanceof HTMLInputElement) {
         setEnableServerOption(e.target.checked);
diff --git a/app/assets/javascripts/components/AccountMenu/SignIn.tsx b/app/assets/javascripts/components/AccountMenu/SignIn.tsx
index f4bb3cf14..82da576f3 100644
--- a/app/assets/javascripts/components/AccountMenu/SignIn.tsx
+++ b/app/assets/javascripts/components/AccountMenu/SignIn.tsx
@@ -1,5 +1,6 @@
 import { WebApplication } from '@/ui_models/application';
 import { AppState } from '@/ui_models/app_state';
+import { isDev } from '@/utils';
 import { observer } from 'mobx-react-lite';
 import { FunctionComponent } from 'preact';
 import { useEffect, useRef, useState } from 'preact/hooks';
@@ -32,6 +33,11 @@ export const SignInPane: FunctionComponent<Props> = observer(
     const emailInputRef = useRef<HTMLInputElement>(null);
     const passwordInputRef = useRef<HTMLInputElement>(null);
 
+    if (isDev && window._devAccountEmail) {
+      setEmail(window._devAccountEmail);
+      setPassword(window._devAccountPassword as string);
+    }
+
     useEffect(() => {
       if (emailInputRef?.current) {
         emailInputRef.current?.focus();
diff --git a/index.html b/index.html
index 27a830b10..c86451a72 100644
--- a/index.html
+++ b/index.html
@@ -36,7 +36,10 @@
   data-purchase-url="<%= env.PURCHASE_URL %>"
   data-plans-url="<%= env.PLANS_URL %>"
   data-dashboard-url="<%= env.DASHBOARD_URL %>"
->
+  data-dev-account-email="<%= env.DEV_ACCOUNT_EMAIL %>"
+  data-dev-account-password="<%= env.DEV_ACCOUNT_PASSWORD %>"
+  data-dev-account-server="<%= env.DEV_ACCOUNT_SERVER %>"
+  >
   <script>
     window._default_sync_server = document.body.dataset.defaultSyncServer || "https://api.standardnotes.com";
     window._bugsnag_api_key = document.body.dataset.bugsnagApiKey;
@@ -45,6 +48,9 @@
     window._purchase_url = document.body.dataset.purchaseUrl;
     window._plans_url = document.body.dataset.plansUrl;
     window._dashboard_url = document.body.dataset.dashboardUrl;
+    window._devAccountEmail = document.body.dataset.devAccountEmail;
+    window._devAccountPassword = document.body.dataset.devAccountPassword;
+    window._devAccountServer = document.body.dataset.devAccountServer;
   </script>
   <application-group-view />
 </body>