Store the ApiUrl in the message, so that user can't change it midway.

src/Main.elm

@@ -3,15 +3,18 @@ import Browser.Navigation as Nav
 import Browser.Dom exposing (Viewport, setViewportOf)
 import Scylla.Sync exposing (..)
 import Scylla.Login exposing (..)
+import Scylla.Api exposing (..)
 import Scylla.Model exposing (..)
 import Scylla.Http exposing (..)
 import Scylla.Views exposing (viewFull)
 import Scylla.Route exposing (Route(..))
 import Scylla.UserData exposing (..)
 import Scylla.Notification exposing (..)
+import Scylla.Storage exposing (..)
 import Url exposing (Url)
 import Url.Parser exposing (parse)
 import Url.Builder
+import Json.Encode
 import Html exposing (div, text)
 import Http
 import Dict
@@ -65,7 +68,7 @@ update msg model = case msg of
     ChangeRoute r -> updateChangeRoute model r
     ViewportAfterMessage v -> updateViewportAfterMessage model v
     ViewportChangeComplete _ -> (model, Cmd.none)
-    ReceiveLoginResponse r -> updateLoginResponse model r
+    ReceiveLoginResponse a r -> updateLoginResponse model a r
     ReceiveFirstSyncResponse r -> updateSyncResponse model r False
     ReceiveSyncResponse r -> updateSyncResponse model r True
     ReceiveUserData s r -> updateUserData model s r
@@ -117,11 +120,12 @@ updateTryUrl m ur = case ur of
     Internal u -> (m, Nav.pushUrl m.key (Url.toString u))
     _ -> (m, Cmd.none)
 
-updateLoginResponse : Model -> Result Http.Error LoginResponse -> (Model, Cmd Msg)
+updateLoginResponse : Model -> ApiUrl -> Result Http.Error LoginResponse -> (Model, Cmd Msg)
-updateLoginResponse model r = case r of
+updateLoginResponse model a r = case r of
-    Ok lr -> ( { model | token = Just lr.accessToken, loginUsername = lr.userId } , Cmd.batch
+    Ok lr -> ( { model | token = Just lr.accessToken, loginUsername = lr.userId, apiUrl = a }, Cmd.batch
         [ firstSync model.apiUrl lr.accessToken
         , Nav.pushUrl model.key <| Url.Builder.absolute [] []
+        , setStoreValuePort ("scylla.loginInfo", Json.Encode.string (lr.accessToken ++ "\n" ++ model.apiUrl))
         ] )
     Err e  -> (model, Cmd.none)
 

src/Scylla/Http.elm

@@ -67,7 +67,7 @@ login apiUrl username password = request
             ] )
         , ("password", string password)
         ]
-    , expect = expectJson ReceiveLoginResponse loginResponseDecoder
+    , expect = expectJson (ReceiveLoginResponse apiUrl) loginResponseDecoder
     , timeout = Nothing
     , tracker = Nothing
     }

src/Scylla/Model.elm

@@ -41,7 +41,7 @@ type Msg =
     | ViewportChangeComplete (Result Browser.Dom.Error ()) -- We're done changing the viewport.
     | ReceiveFirstSyncResponse (Result Http.Error SyncResponse) -- HTTP, Sync has finished
     | ReceiveSyncResponse (Result Http.Error SyncResponse) -- HTTP, Sync has finished
-    | ReceiveLoginResponse (Result Http.Error LoginResponse) -- HTTP, Login has finished
+    | ReceiveLoginResponse ApiUrl (Result Http.Error LoginResponse) -- HTTP, Login has finished
     | ReceiveUserData Username (Result Http.Error UserData)
     | ReceiveCompletedReadMarker (Result Http.Error ())
 

src/Scylla/Storage.elm

@@ -0,0 +1,6 @@
+port module Scylla.Storage exposing (..)
+import Json.Encode
+
+port setStoreValuePort : (String, Json.Encode.Value) -> Cmd msg
+port getStoreValuePort : (String) -> Cmd msg
+port receiveStoreValuePort : (Json.Encode.Value -> msg) -> Sub msg

static/js/storage.js

@@ -0,0 +1,10 @@
+function setupStorage(app) {
+    app.ports.setStoreValuePort.subscribe(function(data) {
+        key = data[0];
+        value = data[1];
+        localStorage.setItem(key, value);
+    });
+    app.ports.getStoreValuePort.subscribe(function(data) {
+        app.ports.receiveStoreValuePort.send(localStorage.getItem(data));
+    });
+}