chore (refactoring): remove config global variable

public/assets/components/breadcrumb.js

@@ -3,6 +3,7 @@ import { animate, slideYOut, slideYIn, opacityOut } from "../lib/animate.js";
 import { forwardURLParams } from "../lib/path.js";
 import assert from "../lib/assert.js";
 import { settingsSave } from "../lib/store.js";
+import { get as getConfig } from "../model/config.js";
 import { loadCSS } from "../helpers/loader.js";
 
 import { extractPath, isDir, isNativeFileUpload } from "../pages/filespage/helper.js";
@@ -79,7 +80,7 @@ class ComponentBreadcrumb extends HTMLElement {
 
         // STEP2: setup the actual content
         assert.type(this.querySelector(`[data-bind="path"]`), HTMLElement).innerHTML = pathChunks.map((chunk, idx) => {
-            const label = idx === 0 ? (window.CONFIG["name"] || "Filestash") : chunk;
+            const label = idx === 0 ? getConfig("name", "Filestash") : chunk;
             const link = pathChunks.slice(0, idx + 1).join("/") + "/";
             const limitSize = (word, highlight = false) => {
                 if (highlight === true && word.length > 30) {

public/assets/model/config.d.ts

@@ -0,0 +1,14 @@
+interface Config {
+    [key: string]: any;
+    thumbnailer: string[];
+}
+
+export function init(): Promise<Config>;
+
+export function get(): Config;
+
+export function get<T>(key: string, defaultValue?: T): T;
+
+export function getVersion(): string;
+
+export function query(): any;

public/assets/model/config.js

@@ -9,21 +9,23 @@ const config$ = ajax({
     rxjs.map(({ responseJSON }) => responseJSON.result),
 );
 
+let CONFIG = {};
+
 export async function init() {
     const config = await config$.toPromise();
-    window.CONFIG = config;
+    CONFIG = config;
     return config;
 }
 
+export function get(key, defaultValue) {
+    if (key) return CONFIG[key] || defaultValue;
+    return CONFIG;
+}
+
+export function getVersion() {
+    return get("version", "na");
+}
+
 export function query() {
     return config$;
 }
-
-export function get(key) {
-    if (key) return window.CONFIG[key];
-    return window.CONFIG;
-}
-
-export function getVersion() {
-    return get("version");
-}

public/assets/pages/ctrl_logout.js

@@ -3,18 +3,16 @@ import { toHref } from "../lib/skeleton/router.js";
 import rxjs, { effect } from "../lib/rx.js";
 
 import { deleteSession } from "../model/session.js";
+import { init as setup_config, get as getConfig } from "../model/config.js";
 import ctrlError from "./ctrl_error.js";
 import $loader from "../components/loader.js";
-import { init as setup_config } from "../model/config.js";
 
 export default function(render) {
     render($loader);
 
     effect(deleteSession().pipe(
         rxjs.mergeMap(setup_config),
-        rxjs.tap(() => {
-            window.CONFIG["logout"] ? location.href = window.CONFIG["logout"] : navigate(toHref("/"));
-        }),
+        rxjs.tap(() => getConfig("logout") ? location.href = getConfig("logout") : navigate(toHref("/"))),
         rxjs.catchError(ctrlError(render)),
     ));
 }

public/assets/pages/ctrl_viewerpage.js

@@ -3,6 +3,7 @@ import rxjs, { effect } from "../lib/rx.js";
 import { ApplicationError } from "../lib/error.js";
 import { basename } from "../lib/path.js";
 import assert from "../lib/assert.js";
+import { get as getConfig } from "../model/config.js";
 import { loadCSS } from "../helpers/loader.js";
 import WithShell, { init as initShell } from "../components/decorator_shell_filemanager.js";
 import { init as initMenubar } from "./viewerpage/component_menubar.js";
@@ -55,7 +56,7 @@ export default WithShell(async function(render) {
     render($page);
 
     // feature: render viewer application
-    effect(rxjs.of(window.CONFIG["mime"] || {}).pipe(
+    effect(rxjs.of(getConfig("mime", {})).pipe(
         rxjs.map((mimes) => opener(basename(getCurrentPath()), mimes)),
         rxjs.mergeMap(([opener, opts]) => rxjs.from(loadModule(opener)).pipe(rxjs.tap((module) => {
             module.default(createRender($page), { ...opts, acl$: options(), getFilename, getDownloadUrl });
@@ -78,7 +79,7 @@ export async function init() {
     return Promise.all([
         loadCSS(import.meta.url, "./ctrl_viewerpage.css"),
         initShell(), initMenubar(), initCache(),
-        rxjs.of(window.CONFIG["mime"] || {}).pipe(
+        rxjs.of(getConfig("mime", {})).pipe(
             rxjs.map((mimes) => opener(basename(getCurrentPath()), mimes)),
             rxjs.mergeMap(([opener]) => loadModule(opener)),
             rxjs.mergeMap((module) => typeof module.init === "function"? module.init() : rxjs.EMPTY),

public/assets/pages/filespage/ctrl_submenu.js

@@ -2,9 +2,10 @@ import { createElement, createRender, createFragment, onDestroy } from "../../li
 import rxjs, { effect, onClick, preventDefault } from "../../lib/rx.js";
 import { animate, slideXIn, slideYIn } from "../../lib/animate.js";
 import { basename, forwardURLParams } from "../../lib/path.js";
-import { loadCSS } from "../../helpers/loader.js";
 import assert from "../../lib/assert.js";
 import { qs, qsa } from "../../lib/dom.js";
+import { get as getConfig } from "../../model/config.js";
+import { loadCSS } from "../../helpers/loader.js";
 import t from "../../locales/index.js";
 
 import "../../components/dropdown.js";
@@ -112,7 +113,7 @@ function componentLeft(render, { $scroll }) {
             <button data-action="rename" title="${t("Rename")}"${toggleDependingOnPermission(currentPath(), "rename")}>
                 ${t("Rename")}
             </button>
-            <button data-action="share" title="${t("Share")}" class="${(window.CONFIG["enable_share"] && !new URLSearchParams(location.search).has("share")) ? "" : "hidden"}">
+            <button data-action="share" title="${t("Share")}" class="${(getConfig("enable_share") && !new URLSearchParams(location.search).has("share")) ? "" : "hidden"}">
                 ${t("Share")}
             </button>
             <button data-action="tag" title="${t("Tag")}" class="${new URLSearchParams(location.search).get("canary") === "true" ? "" : "hidden"}">

public/assets/pages/filespage/state_config.js

@@ -1,12 +1,13 @@
 import rxjs, { effect, preventDefault } from "../../lib/rx.js";
+import { get as getConfig } from "../../model/config.js";
 import { settingsGet, settingsSave } from "../../lib/store.js";
 
 let state$ = null;
 export function init() {
     state$ = new rxjs.BehaviorSubject(settingsGet({
-        view: window.CONFIG["default_view"] || "grid",
-        show_hidden: window.CONFIG["display_hidden"] || false,
-        sort: window.CONFIG["default_sort"] || "type",
+        view: getConfig("default_view", "grid"),
+        show_hidden: getConfig("display_hidden", false),
+        sort: getConfig("default_sort", "type"),
         order: null,
         search: "",
     }, "filespage"));

public/global.d.ts

@@ -5,11 +5,5 @@ interface Window {
         [key: string]: any;
         "xdg-open"?: (mime: string) => void;
     };
-    CONFIG: Config;
     BEARER_TOKEN?: string;
-}
-
-interface Config {
-    [key: string]: any;
-    thumbnailer: string[];
 }