Add support for config from /.well-known/matrix/client (#126)

* Add support for config from /.well-known/matrix/client

* final fixes, refactoring, updated readme

src/AppContext.tsx

@@ -1,18 +1,6 @@
 import { createContext, useContext } from "react";
-
-interface AppContextType {
-  restrictBaseUrl: string | string[];
-  asManagedUsers: string[];
-  supportURL: string;
-  menu: MenuItem[];
-}
-
-interface MenuItem {
-  label: string;
-  icon: string;
-  url: string;
-}
+import { Config } from "./components/config";
 
 export const AppContext = createContext({});
 
-export const useAppContext = () => useContext(AppContext) as AppContextType;
+export const useAppContext = () => useContext(AppContext) as Config;

src/components/config.ts

@@ -0,0 +1,63 @@
+import storage from "../storage";
+
+export interface Config {
+  restrictBaseUrl: string | string[];
+  asManagedUsers: string[];
+  supportURL: string;
+  menu: MenuItem[];
+}
+
+export interface MenuItem {
+  label: string;
+  icon: string;
+  url: string;
+}
+
+export const WellKnownKey = "cc.etke.synapse-admin";
+
+export const LoadConfig = (context: Config): Config => {
+  if (context.restrictBaseUrl) {
+    storage.setItem("restrict_base_url", JSON.stringify(context.restrictBaseUrl));
+  }
+
+  if (context.asManagedUsers) {
+    storage.setItem("as_managed_users", JSON.stringify(context.asManagedUsers));
+  }
+
+  let menu: MenuItem[] = [];
+  if (context.menu) {
+    menu = context.menu;
+  }
+  if (context.supportURL) {
+    const migratedSupportURL = {
+      label: "Contact support",
+      icon: "SupportAgent",
+      url: context.supportURL,
+    };
+    console.warn("supportURL config option is deprecated. Please, use the menu option instead. Automatically migrated to the new menu option:", migratedSupportURL);
+    menu.push(migratedSupportURL as MenuItem);
+  }
+  if (menu.length > 0) {
+    storage.setItem("menu", JSON.stringify(menu));
+  }
+
+  // below we try to calculate "final" config, which will contain values from context and already set values in storage
+  // because LoadConfig could be called multiple times to get config from different sources
+  let finalAsManagedUsers: string[] = [];
+  try {
+    finalAsManagedUsers = JSON.parse(storage.getItem("as_managed_users") || "");
+  } catch (e) {}
+
+  let finalMenu: MenuItem[] = [];
+  try {
+    finalMenu = JSON.parse(storage.getItem("menu") || "");
+  } catch (e) {}
+
+  return {
+    restrictBaseUrl: storage.getItem("restrict_base_url") || "",
+    asManagedUsers: finalAsManagedUsers,
+    supportURL: storage.getItem("support_url") || "",
+    menu: finalMenu,
+  } as Config;
+
+}

src/index.tsx

@@ -3,38 +3,42 @@ import React from "react";
 import { createRoot } from "react-dom/client";
 
 import App from "./App";
-import { AppContext, MenuItem } from "./AppContext";
+import { Config, WellKnownKey, LoadConfig } from "./components/config";
+import { AppContext } from "./AppContext";
 import storage from "./storage";
 
-fetch("config.json")
-  .then(res => res.json())
-  .then(props => {
-    if (props.asManagedUsers) {
-      storage.setItem("as_managed_users", JSON.stringify(props.asManagedUsers));
-    }
+// load config.json
+let props: Config = {};
+try {
+  const resp = await fetch("config.json");
+  const configJSON = await resp.json();
+  console.log("Loaded config.json", configJSON);
+  props = LoadConfig(configJSON as Config);
+} catch (e) {
+  console.error(e);
+}
 
-    let menu: MenuItem[] = [];
-    if (props.menu) {
-      menu = props.menu;
-    }
-    if (props.supportURL) {
-      const migratedSupportURL = {
-        label: "Contact support",
-        icon: "SupportAgent",
-        url: props.supportURL,
-      };
-      console.warn("supportURL config option is deprecated. Please, use the menu option instead. Automatically migrated to the new menu option:", migratedSupportURL);
-      menu.push(migratedSupportURL as MenuItem);
-    }
-    if (menu.length > 0) {
-      storage.setItem("menu", JSON.stringify(menu));
+// if home_server is set, try to load https://home_server/.well-known/matrix/client
+const homeserver = storage.getItem("home_server");
+if (homeserver) {
+  try {
+    const resp = await fetch(`https://${homeserver}/.well-known/matrix/client`);
+    const configWK = await resp.json();
+    if (!configWK[WellKnownKey]) {
+      console.log(`Loaded https://${homeserver}.well-known/matrix/client, but it doesn't contain ${WellKnownKey} key, skipping`, configWK);
+    } else {
+      console.log(`Loaded https://${homeserver}.well-known/matrix/client`, configWK);
+      props = LoadConfig(configWK[WellKnownKey] as Config);
     }
+  } catch (e) {
+    console.log(`https://${homeserver}/.well-known/matrix/client not found, skipping`, e);
+  }
+}
 
-    return createRoot(document.getElementById("root")).render(
+createRoot(document.getElementById("root")).render(
       <React.StrictMode>
         <AppContext.Provider value={props}>
           <App />
         </AppContext.Provider>
       </React.StrictMode>
-    )
-  });
+);

src/pages/LoginPage.tsx

@@ -33,7 +33,7 @@ const LoginPage = () => {
   const login = useLogin();
   const notify = useNotify();
   const { restrictBaseUrl } = useAppContext();
-  const allowSingleBaseUrl = typeof restrictBaseUrl === "string";
+  const allowSingleBaseUrl = typeof restrictBaseUrl === "string" && restrictBaseUrl !== "";
   const allowMultipleBaseUrls =
     Array.isArray(restrictBaseUrl) &&
     restrictBaseUrl.length > 0 &&