feat(dev): preload dev account from .env (#803)

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';

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);

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();