Merge pull request #972 from movie-web/config-improvements

Config improvements

public/config.js

@@ -4,7 +4,7 @@ window.__CONFIG__ = {
   VITE_CORS_PROXY_URL: "",
 
   // The READ API key to access TMDB
-  VITE_TMDB_READ_API_KEY: "CHANGEME",
+  VITE_TMDB_READ_API_KEY: "",
 
   // The DMCA email displayed in the footer, null to hide the DMCA link
   VITE_DMCA_EMAIL: null,
@@ -16,5 +16,5 @@ window.__CONFIG__ = {
   VITE_BACKEND_URL: null,
 
   // A comma separated list of disallowed IDs in the case of a DMCA claim - in the format "series-<id>" and "movie-<id>"
-  VITE_DISALLOWED_IDS: ""
+  VITE_DISALLOWED_IDS: "",
 };

src/backend/metadata/tmdb.ts

@@ -144,12 +144,16 @@ export function decodeTMDBId(
 
 const baseURL = "https://api.themoviedb.org/3";
 
+const apiKey = conf().TMDB_READ_API_KEY;
+
 const headers = {
   accept: "application/json",
-  Authorization: `Bearer ${conf().TMDB_READ_API_KEY}`,
+  Authorization: `Bearer ${apiKey}`,
 };
 
 async function get<T>(url: string, params?: object): Promise<T> {
+  if (!apiKey) throw new Error("TMDB API key not set");
+
   const res = await mwFetch<any>(encodeURI(url), {
     headers,
     baseURL,

src/hooks/auth/useBackendUrl.ts

@@ -1,7 +1,7 @@
 import { conf } from "@/setup/config";
 import { useAuthStore } from "@/stores/auth";
 
-export function useBackendUrl(): string | undefined {
+export function useBackendUrl(): string | null {
   const backendUrl = useAuthStore((s) => s.backendUrl);
   return backendUrl ?? conf().BACKEND_URL;
 }

src/pages/parts/admin/TMDBTestPart.tsx

@@ -25,7 +25,7 @@ export function TMDBTestPart() {
       errorText: "",
     });
 
-    if (tmdbApiKey.length === 0) {
+    if (!tmdbApiKey || tmdbApiKey.length === 0) {
       return setStatus({
         hasTested: true,
         success: false,

src/pages/parts/settings/SidebarPart.tsx

@@ -14,7 +14,7 @@ import { useAuthStore } from "@/stores/auth";
 
 const rem = 16;
 
-function SecureBadge(props: { url: string | undefined }) {
+function SecureBadge(props: { url: string | null }) {
   const { t } = useTranslation();
   const secure = props.url ? props.url.startsWith("https://") : false;
   return (

src/setup/config.ts

@@ -31,10 +31,10 @@ export interface RuntimeConfig {
   DONATION_LINK: string;
   DISCORD_LINK: string;
   DMCA_EMAIL: string | null;
-  TMDB_READ_API_KEY: string;
+  TMDB_READ_API_KEY: string | null;
   NORMAL_ROUTER: boolean;
   PROXY_URLS: string[];
-  BACKEND_URL: string;
+  BACKEND_URL: string | null;
   DISALLOWED_IDS: string[];
   TURNSTILE_KEY: string | null;
   CDN_REPLACEMENTS: Array<string[]>;
@@ -66,48 +66,48 @@ const env: Record<keyof Config, undefined | string> = {
   HAS_ONBOARDING: import.meta.env.VITE_HAS_ONBOARDING,
 };
 
-// loads from different locations, in order: environment (VITE_{KEY}), window (public/config.js)
+function coerceUndefined(value: string | null | undefined): string | undefined {
-function getKeyValue(key: keyof Config): string | undefined {
+  if (value == null) return undefined;
-  let windowValue = (window as any)?.__CONFIG__?.[`VITE_${key}`];
+  if (value.length === 0) return undefined;
-  if (
+  return value;
-    windowValue !== null &&
-    windowValue !== undefined &&
-    windowValue.length === 0
-  )
-    windowValue = undefined;
-  return env[key] ?? windowValue ?? undefined;
 }
 
-function getKey(key: keyof Config, defaultString?: string): string {
+// loads from different locations, in order: environment (VITE_{KEY}), window (public/config.js)
-  return getKeyValue(key)?.toString() ?? defaultString ?? "";
+function getKeyValue(key: keyof Config): string | undefined {
+  const windowValue = (window as any)?.__CONFIG__?.[`VITE_${key}`];
+
+  return coerceUndefined(env[key]) ?? coerceUndefined(windowValue) ?? undefined;
+}
+
+function getKey(key: keyof Config): string | null;
+function getKey(key: keyof Config, defaultString: string): string;
+function getKey(key: keyof Config, defaultString?: string): string | null {
+  return getKeyValue(key)?.toString() ?? defaultString ?? null;
 }
 
 export function conf(): RuntimeConfig {
-  const dmcaEmail = getKey("DMCA_EMAIL");
-  const chromeExtension = getKey("ONBOARDING_CHROME_EXTENSION_INSTALL_LINK");
-  const firefoxExtension = getKey("ONBOARDING_FIREFOX_EXTENSION_INSTALL_LINK");
-  const proxyInstallLink = getKey("ONBOARDING_PROXY_INSTALL_LINK");
-  const turnstileKey = getKey("TURNSTILE_KEY");
   return {
     APP_VERSION,
     GITHUB_LINK,
     DONATION_LINK,
     DISCORD_LINK,
-    DMCA_EMAIL: dmcaEmail.length > 0 ? dmcaEmail : null,
+    DMCA_EMAIL: getKey("DMCA_EMAIL"),
-    ONBOARDING_CHROME_EXTENSION_INSTALL_LINK:
+    ONBOARDING_CHROME_EXTENSION_INSTALL_LINK: getKey(
-      chromeExtension.length > 0 ? chromeExtension : null,
+      "ONBOARDING_CHROME_EXTENSION_INSTALL_LINK",
-    ONBOARDING_FIREFOX_EXTENSION_INSTALL_LINK:
+    ),
-      firefoxExtension.length > 0 ? firefoxExtension : null,
+    ONBOARDING_FIREFOX_EXTENSION_INSTALL_LINK: getKey(
-    ONBOARDING_PROXY_INSTALL_LINK:
+      "ONBOARDING_FIREFOX_EXTENSION_INSTALL_LINK",
-      proxyInstallLink.length > 0 ? proxyInstallLink : null,
+    ),
+    ONBOARDING_PROXY_INSTALL_LINK: getKey("ONBOARDING_PROXY_INSTALL_LINK"),
     BACKEND_URL: getKey("BACKEND_URL", BACKEND_URL),
     TMDB_READ_API_KEY: getKey("TMDB_READ_API_KEY"),
-    PROXY_URLS: getKey("CORS_PROXY_URL")
+    PROXY_URLS: getKey("CORS_PROXY_URL", "")
       .split(",")
-      .map((v) => v.trim()),
+      .map((v) => v.trim())
+      .filter((v) => v.length > 0),
     NORMAL_ROUTER: getKey("NORMAL_ROUTER", "false") === "true",
     HAS_ONBOARDING: getKey("HAS_ONBOARDING", "false") === "true",
-    TURNSTILE_KEY: turnstileKey.length > 0 ? turnstileKey : null,
+    TURNSTILE_KEY: getKey("TURNSTILE_KEY"),
     DISALLOWED_IDS: getKey("DISALLOWED_IDS", "")
       .split(",")
       .map((v) => v.trim())