utils cleanup, initial static generation

src/components/bookmarks/item.jsx

@@ -1,6 +1,6 @@
 import { useContext } from "react";
 
-import { SettingsContext } from "utils/settings-context";
+import { SettingsContext } from "utils/contexts/settings";
 
 export default function Item({ bookmark }) {
   const { hostname } = new URL(bookmark.href);

src/components/color-toggle.jsx

@@ -3,7 +3,7 @@ import { IoColorPalette } from "react-icons/io5";
 import { Popover, Transition } from "@headlessui/react";
 import classNames from "classnames";
 
-import { ColorContext } from "utils/color-context";
+import { ColorContext } from "utils/contexts/color";
 
 const colors = [
   "slate",

src/components/services/item.jsx

@@ -6,7 +6,7 @@ import Status from "./status";
 import Widget from "./widget";
 
 import Docker from "widgets/docker/component";
-import { SettingsContext } from "utils/settings-context";
+import { SettingsContext } from "utils/contexts/settings";
 
 function resolveIcon(icon) {
   if (icon.startsWith("http")) {
@@ -85,14 +85,16 @@ export default function Item({ service }) {
           )}
         </div>
 
-        <div
-          className={classNames(
-            statsOpen ? "max-h-[55px] opacity-100" : " max-h-[0] opacity-0",
-            "w-full overflow-hidden transition-all duration-300 ease-in-out"
-          )}
-        >
-          <Docker service={{ widget: { container: service.container, server: service.server } }} />
-        </div>
+        {service.container && service.server && (
+          <div
+            className={classNames(
+              statsOpen ? "max-h-[55px] opacity-100" : " max-h-[0] opacity-0",
+              "w-full overflow-hidden transition-all duration-300 ease-in-out"
+            )}
+          >
+            <Docker service={{ widget: { container: service.container, server: service.server } }} />
+          </div>
+        )}
 
         {service.widget && <Widget service={service} />}
       </div>

src/components/theme-toggle.jsx

@@ -1,7 +1,7 @@
 import { useContext } from "react";
 import { MdDarkMode, MdLightMode, MdToggleOff, MdToggleOn } from "react-icons/md";
 
-import { ThemeContext } from "utils/theme-context";
+import { ThemeContext } from "utils/contexts/theme";
 
 export default function ThemeToggle() {
   const { theme, setTheme } = useContext(ThemeContext);

src/components/widget.jsx

@@ -1,18 +1,12 @@
-import WeatherApi from "components/widgets/weather/weather";
-import OpenWeatherMap from "components/widgets/openweathermap/weather";
-import Resources from "components/widgets/resources/resources";
-import Search from "components/widgets/search/search";
-import Greeting from "components/widgets/greeting/greeting";
-import DateTime from "components/widgets/datetime/datetime";
+import dynamic from "next/dynamic";
 
 const widgetMappings = {
-  weather: WeatherApi, // This key will be deprecated in the future
-  weatherapi: WeatherApi,
-  openweathermap: OpenWeatherMap,
-  resources: Resources,
-  search: Search,
-  greeting: Greeting,
-  datetime: DateTime,
+  weatherapi: dynamic(() => import("components/widgets/weather/weather")),
+  openweathermap: dynamic(() => import("components/widgets/openweathermap/weather")),
+  resources: dynamic(() => import("components/widgets/resources/resources")),
+  search: dynamic(() => import("components/widgets/search/search")),
+  greeting: dynamic(() => import("components/widgets/greeting/greeting")),
+  datetime: dynamic(() => import("components/widgets/datetime/datetime")),
 };
 
 export default function Widget({ widget }) {

src/components/widgets/openweathermap/icon.jsx

@@ -1,4 +1,4 @@
-import mapIcon from "utils/owm-condition-map";
+import mapIcon from "utils/weather/owm-condition-map";
 
 export default function Icon({ condition, timeOfDay }) {
   const IconComponent = mapIcon(condition, timeOfDay);

src/components/widgets/openweathermap/weather.jsx

@@ -80,20 +80,22 @@ export default function OpenWeatherMap({ options }) {
 
   const requestLocation = () => {
     setRequesting(true);
-    navigator.geolocation.getCurrentPosition(
-      (position) => {
-        setLocation({ latitude: position.coords.latitude, longitude: position.coords.longitude });
-        setRequesting(false);
-      },
-      () => {
-        setRequesting(false);
-      },
-      {
-        enableHighAccuracy: true,
-        maximumAge: 1000 * 60 * 60 * 3,
-        timeout: 1000 * 30,
-      }
-    );
+    if (typeof window !== "undefined") {
+      navigator.geolocation.getCurrentPosition(
+        (position) => {
+          setLocation({ latitude: position.coords.latitude, longitude: position.coords.longitude });
+          setRequesting(false);
+        },
+        () => {
+          setRequesting(false);
+        },
+        {
+          enableHighAccuracy: true,
+          maximumAge: 1000 * 60 * 60 * 3,
+          timeout: 1000 * 30,
+        }
+      );
+    }
   };
 
   if (!requesting && !location) requestLocation();

src/components/widgets/weather/icon.jsx

@@ -1,4 +1,4 @@
-import mapIcon from "utils/condition-map";
+import mapIcon from "utils/weather/condition-map";
 
 export default function Icon({ condition, timeOfDay }) {
   const IconComponent = mapIcon(condition, timeOfDay);

src/components/widgets/weather/weather.jsx

@@ -81,20 +81,22 @@ export default function WeatherApi({ options }) {
 
   const requestLocation = () => {
     setRequesting(true);
-    navigator.geolocation.getCurrentPosition(
-      (position) => {
-        setLocation({ latitude: position.coords.latitude, longitude: position.coords.longitude });
-        setRequesting(false);
-      },
-      () => {
-        setRequesting(false);
-      },
-      {
-        enableHighAccuracy: true,
-        maximumAge: 1000 * 60 * 60 * 3,
-        timeout: 1000 * 30,
-      }
-    );
+    if (typeof window !== "undefined") {
+      navigator.geolocation.getCurrentPosition(
+        (position) => {
+          setLocation({ latitude: position.coords.latitude, longitude: position.coords.longitude });
+          setRequesting(false);
+        },
+        () => {
+          setRequesting(false);
+        },
+        {
+          enableHighAccuracy: true,
+          maximumAge: 1000 * 60 * 60 * 3,
+          timeout: 1000 * 30,
+        }
+      );
+    }
   };
 
   if (!requesting && !location) requestLocation();

src/pages/_app.jsx

@@ -7,9 +7,9 @@ import "styles/theme.css";
 import "styles/manrope.css";
 import nextI18nextConfig from "../../next-i18next.config";
 
-import { ColorProvider } from "utils/color-context";
-import { ThemeProvider } from "utils/theme-context";
-import { SettingsProvider } from "utils/settings-context";
+import { ColorProvider } from "utils/contexts/color";
+import { ThemeProvider } from "utils/contexts/theme";
+import { SettingsProvider } from "utils/contexts/settings";
 
 function MyApp({ Component, pageProps }) {
   return (

src/pages/api/bookmarks.js

@@ -1,25 +1,5 @@
-import { promises as fs } from "fs";
-import path from "path";
-
-import yaml from "js-yaml";
-
-import checkAndCopyConfig from "utils/config";
+import { bookmarksResponse } from "utils/config/api-response";
 
 export default async function handler(req, res) {
-  checkAndCopyConfig("bookmarks.yaml");
-
-  const bookmarksYaml = path.join(process.cwd(), "config", "bookmarks.yaml");
-  const fileContents = await fs.readFile(bookmarksYaml, "utf8");
-  const bookmarks = yaml.load(fileContents);
-
-  // map easy to write YAML objects into easy to consume JS arrays
-  const bookmarksArray = bookmarks.map((group) => ({
-    name: Object.keys(group)[0],
-    bookmarks: group[Object.keys(group)[0]].map((entries) => ({
-      name: Object.keys(entries)[0],
-      ...entries[Object.keys(entries)[0]][0],
-    })),
-  }));
-
-  res.send(bookmarksArray);
+  res.send(await bookmarksResponse());
 }

src/pages/api/proxy.js

@@ -2,7 +2,7 @@ import https from "https";
 
 import getRawBody from "raw-body";
 
-import { httpRequest, httpsRequest } from "utils/http";
+import { httpRequest, httpsRequest } from "utils/proxy/http";
 
 export const config = {
   api: {

src/pages/api/services/index.js

@@ -1,43 +1,5 @@
-/* eslint-disable no-console */
-import { servicesFromConfig, servicesFromDocker, cleanServiceGroups } from "utils/service-helpers";
+import { servicesResponse } from "utils/config/api-response";
 
 export default async function handler(req, res) {
-  let discoveredServices;
-  let configuredServices;
-
-  try {
-    discoveredServices = cleanServiceGroups(await servicesFromDocker());
-  } catch (e) {
-    console.error("Failed to discover services, please check docker.yaml for errors or remove example entries.");
-    console.error(e);
-    discoveredServices = [];
-  }
-
-  try {
-    configuredServices = cleanServiceGroups(await servicesFromConfig());
-  } catch (e) {
-    console.error("Failed to load services.yaml, please check for errors");
-    console.error(e);
-    configuredServices = [];
-  }
-
-  const mergedGroupsNames = [
-    ...new Set([discoveredServices.map((group) => group.name), configuredServices.map((group) => group.name)].flat()),
-  ];
-
-  const mergedGroups = [];
-
-  mergedGroupsNames.forEach((groupName) => {
-    const discoveredGroup = discoveredServices.find((group) => group.name === groupName) || { services: [] };
-    const configuredGroup = configuredServices.find((group) => group.name === groupName) || { services: [] };
-
-    const mergedGroup = {
-      name: groupName,
-      services: [...discoveredGroup.services, ...configuredGroup.services].filter((service) => service),
-    };
-
-    mergedGroups.push(mergedGroup);
-  });
-
-  res.send(mergedGroups);
+  res.send(await servicesResponse());
 }

src/pages/api/services/proxy.js

@@ -1,6 +1,6 @@
-import { formatApiCall } from "utils/api-helpers";
+import { formatApiCall } from "utils/proxy/api-helpers";
 import createLogger from "utils/logger";
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 import widgets from "widgets/widgets";
 
 const logger = createLogger("servicesProxy");

src/pages/api/widgets/index.js

@@ -1,22 +1,5 @@
-import { promises as fs } from "fs";
-import path from "path";
-
-import yaml from "js-yaml";
-
-import checkAndCopyConfig from "utils/config";
+import { widgetsResponse } from "utils/config/api-response";
 
 export default async function handler(req, res) {
-  checkAndCopyConfig("widgets.yaml");
-
-  const widgetsYaml = path.join(process.cwd(), "config", "widgets.yaml");
-  const fileContents = await fs.readFile(widgetsYaml, "utf8");
-  const widgets = yaml.load(fileContents);
-
-  // map easy to write YAML objects into easy to consume JS arrays
-  const widgetsArray = widgets.map((group) => ({
-    type: Object.keys(group)[0],
-    options: { ...group[Object.keys(group)[0]] },
-  }));
-
-  res.send(widgetsArray);
+  res.send(await widgetsResponse());
 }

src/pages/api/widgets/openweathermap.js

@@ -1,4 +1,4 @@
-import cachedFetch from "utils/cached-fetch";
+import cachedFetch from "utils/proxy/cached-fetch";
 import { getSettings } from "utils/config";
 
 export default async function handler(req, res) {

src/pages/api/widgets/weather.js

@@ -1,4 +1,4 @@
-import cachedFetch from "utils/cached-fetch";
+import cachedFetch from "utils/proxy/cached-fetch";
 import { getSettings } from "utils/config";
 
 export default async function handler(req, res) {

src/pages/index.jsx

@@ -1,5 +1,5 @@
 /* eslint-disable react/no-array-index-key */
-import useSWR from "swr";
+import useSWR, { SWRConfig } from "swr";
 import Head from "next/head";
 import dynamic from "next/dynamic";
 import { useTranslation } from "next-i18next";
@@ -13,9 +13,10 @@ import Widget from "components/widget";
 import Revalidate from "components/revalidate";
 import createLogger from "utils/logger";
 import { getSettings } from "utils/config";
-import { ColorContext } from "utils/color-context";
-import { ThemeContext } from "utils/theme-context";
-import { SettingsContext } from "utils/settings-context";
+import { ColorContext } from "utils/contexts/color";
+import { ThemeContext } from "utils/contexts/theme";
+import { SettingsContext } from "utils/contexts/settings";
+import { bookmarksResponse, servicesResponse, widgetsResponse } from "utils/config/api-response";
 
 const ThemeToggle = dynamic(() => import("components/theme-toggle"), {
   ssr: false,
@@ -37,9 +38,18 @@ export async function getStaticProps() {
     logger = createLogger("index");
     const { providers, ...settings } = getSettings();
 
+    const services = await servicesResponse();
+    const bookmarks = await bookmarksResponse();
+    const widgets = await widgetsResponse();
+
     return {
       props: {
         initialSettings: settings,
+        fallback: {
+          "/api/services": services,
+          "/api/bookmarks": bookmarks,
+          "/api/widgets": widgets,
+        },
         ...(await serverSideTranslations(settings.language ?? "en")),
       },
     };
@@ -56,7 +66,7 @@ export async function getStaticProps() {
   }
 }
 
-export default function Index({ initialSettings }) {
+export default function Index({ initialSettings, fallback }) {
   const { data: errorsData } = useSWR("/api/validate");
 
   if (errorsData && errorsData.length > 0) {
@@ -83,7 +93,11 @@ export default function Index({ initialSettings }) {
     );
   }
 
-  return <Home initialSettings={initialSettings} />;
+  return (
+    <SWRConfig value={{ fallback, fetcher: (resource, init) => fetch(resource, init).then((res) => res.json()) }}>
+      <Home initialSettings={initialSettings} />
+    </SWRConfig>
+  );
 }
 
 function Home({ initialSettings }) {

src/utils/config/api-response.js

@@ -0,0 +1,84 @@
+/* eslint-disable no-console */
+import { promises as fs } from "fs";
+import path from "path";
+
+import yaml from "js-yaml";
+
+import checkAndCopyConfig from "utils/config";
+import { servicesFromConfig, servicesFromDocker, cleanServiceGroups } from "utils/service-helpers";
+
+export async function bookmarksResponse() {
+  checkAndCopyConfig("bookmarks.yaml");
+
+  const bookmarksYaml = path.join(process.cwd(), "config", "bookmarks.yaml");
+  const fileContents = await fs.readFile(bookmarksYaml, "utf8");
+  const bookmarks = yaml.load(fileContents);
+
+  // map easy to write YAML objects into easy to consume JS arrays
+  const bookmarksArray = bookmarks.map((group) => ({
+    name: Object.keys(group)[0],
+    bookmarks: group[Object.keys(group)[0]].map((entries) => ({
+      name: Object.keys(entries)[0],
+      ...entries[Object.keys(entries)[0]][0],
+    })),
+  }));
+
+  return bookmarksArray;
+}
+
+export async function widgetsResponse() {
+  checkAndCopyConfig("widgets.yaml");
+
+  const widgetsYaml = path.join(process.cwd(), "config", "widgets.yaml");
+  const fileContents = await fs.readFile(widgetsYaml, "utf8");
+  const widgets = yaml.load(fileContents);
+
+  // map easy to write YAML objects into easy to consume JS arrays
+  const widgetsArray = widgets.map((group) => ({
+    type: Object.keys(group)[0],
+    options: { ...group[Object.keys(group)[0]] },
+  }));
+
+  return widgetsArray;
+}
+
+export async function servicesResponse() {
+  let discoveredServices;
+  let configuredServices;
+
+  try {
+    discoveredServices = cleanServiceGroups(await servicesFromDocker());
+  } catch (e) {
+    console.error("Failed to discover services, please check docker.yaml for errors or remove example entries.");
+    console.error(e);
+    discoveredServices = [];
+  }
+
+  try {
+    configuredServices = cleanServiceGroups(await servicesFromConfig());
+  } catch (e) {
+    console.error("Failed to load services.yaml, please check for errors");
+    console.error(e);
+    configuredServices = [];
+  }
+
+  const mergedGroupsNames = [
+    ...new Set([discoveredServices.map((group) => group.name), configuredServices.map((group) => group.name)].flat()),
+  ];
+
+  const mergedGroups = [];
+
+  mergedGroupsNames.forEach((groupName) => {
+    const discoveredGroup = discoveredServices.find((group) => group.name === groupName) || { services: [] };
+    const configuredGroup = configuredServices.find((group) => group.name === groupName) || { services: [] };
+
+    const mergedGroup = {
+      name: groupName,
+      services: [...discoveredGroup.services, ...configuredGroup.services].filter((service) => service),
+    };
+
+    mergedGroups.push(mergedGroup);
+  });
+
+  return mergedGroups;
+}

src/utils/proxy/handlers/credentialed.js

@@ -1,6 +1,6 @@
 import getServiceWidget from "utils/service-helpers";
-import { formatApiCall } from "utils/api-helpers";
-import { httpProxy } from "utils/http";
+import { formatApiCall } from "utils/proxy/api-helpers";
+import { httpProxy } from "utils/proxy/http";
 import createLogger from "utils/logger";
 import widgets from "widgets/widgets";
 

src/utils/proxy/handlers/generic.js

@@ -1,6 +1,6 @@
 import getServiceWidget from "utils/service-helpers";
-import { formatApiCall } from "utils/api-helpers";
-import { httpProxy } from "utils/http";
+import { formatApiCall } from "utils/proxy/api-helpers";
+import { httpProxy } from "utils/proxy/http";
 import createLogger from "utils/logger";
 import widgets from "widgets/widgets";
 

src/utils/proxy/http.js

@@ -2,7 +2,7 @@
 /* eslint-disable no-param-reassign */
 import { http, https } from "follow-redirects";
 
-import { addCookieToJar, setCookieHeader } from "utils/cookie-jar";
+import { addCookieToJar, setCookieHeader } from "./cookie-jar";
 
 function addCookieHandler(url, params) {
   setCookieHeader(url, params);

src/utils/service-helpers.js

@@ -121,15 +121,16 @@ export function cleanServiceGroups(groups) {
 
         cleanedService.widget = {
           type,
-          currency,
-          symbols,
           service_name: service.name,
           service_group: serviceGroup.name,
         };
 
+        if (currency) cleanedService.widget.currency = currency;
+        if (symbols) cleanedService.widget.symbols = symbols;
+
         if (type === "docker") {
-          cleanedService.widget.server = server;
-          cleanedService.widget.container = container;
+          if (server) cleanedService.widget.server = server;
+          if (container) cleanedService.widget.container = container;
         }
       }
 

src/widgets/adguard/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/adguard/widget.js

@@ -1,11 +1,11 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/control/{endpoint}",
   proxyHandler: genericProxyHandler,
 
   mappings: {
-    "stats": {
+    stats: {
       endpoint: "stats",
     },
   },

src/widgets/authentik/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();
@@ -30,11 +30,13 @@ export default function Component({ service }) {
 
   const yesterday = new Date(Date.now()).setHours(-24);
   const loginsLast24H = loginsData.reduce(
-    (total, current) => current.x_cord >= yesterday ? total + current.y_cord : total
-  , 0);
+    (total, current) => (current.x_cord >= yesterday ? total + current.y_cord : total),
+    0
+  );
   const failedLoginsLast24H = failedLoginsData.reduce(
-    (total, current) => current.x_cord >= yesterday ? total + current.y_cord : total
-  , 0);
+    (total, current) => (current.x_cord >= yesterday ? total + current.y_cord : total),
+    0
+  );
 
   return (
     <Widget>

src/widgets/authentik/widget.js

@@ -1,18 +1,18 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "{url}/api/v3/{endpoint}",
   proxyHandler: credentialedProxyHandler,
 
   mappings: {
-    "users": {
-      endpoint: "core/users?page_size=1"
+    users: {
+      endpoint: "core/users?page_size=1",
     },
-    "login": {
-      endpoint: "events/events/per_month/?action=login&query={}"
+    login: {
+      endpoint: "events/events/per_month/?action=login&query={}",
     },
-    "login_failed": {
-      endpoint: "events/events/per_month/?action=login_failed&query={}"
+    login_failed: {
+      endpoint: "events/events/per_month/?action=login_failed&query={}",
     },
   },
 };

src/widgets/bazarr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/bazarr/widget.js

@@ -1,18 +1,18 @@
-import genericProxyHandler from "utils/proxies/generic";
-import { asJson } from "utils/api-helpers";
+import genericProxyHandler from "utils/proxy/handlers/generic";
+import { asJson } from "utils/proxy/api-helpers";
 
 const widget = {
   api: "{url}/api/{endpoint}/wanted?apikey={key}",
   proxyHandler: genericProxyHandler,
 
   mappings: {
-    "movies": {
+    movies: {
       endpoint: "movies",
       map: (data) => ({
         total: asJson(data).total,
       }),
     },
-    "episodes": {
+    episodes: {
       endpoint: "episodes",
       map: (data) => ({
         total: asJson(data).total,

src/widgets/coinmarketcap/component.jsx

@@ -6,7 +6,7 @@ import classNames from "classnames";
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
 import Dropdown from "components/services/dropdown";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();
@@ -27,7 +27,7 @@ export default function Component({ service }) {
   const { data: statsData, error: statsError } = useSWR(
     formatProxyUrl(config, "v1/cryptocurrency/quotes/latest", {
       symbol: `${symbols.join(",")}`,
-      convert: `${currencyCode}`
+      convert: `${currencyCode}`,
     })
   );
 

src/widgets/coinmarketcap/widget.js

@@ -1,4 +1,4 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "https://pro-api.coinmarketcap.com/{endpoint}",

src/widgets/docker/component.jsx

@@ -12,18 +12,10 @@ export default function Component({ service }) {
   const config = service.widget;
 
   const { data: statusData, error: statusError } = useSWR(
-    `/api/docker/status/${config.container}/${config.server || ""}`,
-    {
-      refreshInterval: 5000,
-    }
+    `/api/docker/status/${config.container}/${config.server || ""}`
   );
 
-  const { data: statsData, error: statsError } = useSWR(
-    `/api/docker/stats/${config.container}/${config.server || ""}`,
-    {
-      refreshInterval: 5000,
-    }
-  );
+  const { data: statsData, error: statsError } = useSWR(`/api/docker/stats/${config.container}/${config.server || ""}`);
 
   if (statsError || statusError) {
     return <Widget error={t("widget.api_error")} />;

src/widgets/emby/component.jsx

@@ -4,7 +4,7 @@ import { BsVolumeMuteFill, BsFillPlayFill, BsPauseFill, BsCpu, BsFillCpuFill } f
 import { MdOutlineSmartDisplay } from "react-icons/md";
 
 import Widget from "components/services/widgets/widget";
-import { formatProxyUrl, formatProxyUrlWithSegments } from "utils/api-helpers";
+import { formatProxyUrl, formatProxyUrlWithSegments } from "utils/proxy/api-helpers";
 
 function ticksToTime(ticks) {
   const milliseconds = ticks / 10000;
@@ -164,7 +164,7 @@ export default function Component({ service }) {
   async function handlePlayCommand(session, command) {
     const url = formatProxyUrlWithSegments(config, "PlayControl", {
       sessionId: session.Id,
-      command
+      command,
     });
     await fetch(url).then(() => {
       sessionMutate();

src/widgets/emby/widget.js

@@ -1,18 +1,18 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/emby/{endpoint}?api_key={key}",
   proxyHandler: genericProxyHandler,
 
   mappings: {
-    "Sessions": {
+    Sessions: {
       endpoint: "Sessions",
     },
-    "PlayControl": {
+    PlayControl: {
       method: "POST",
       enpoint: "Sessions/{sessionId}/Playing/{command}",
-      segments: ["sessionId", "command"]
-    }
+      segments: ["sessionId", "command"],
+    },
   },
 };
 

src/widgets/gotify/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/gotify/widget.js

@@ -1,18 +1,18 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "{url}/{endpoint}",
   proxyHandler: credentialedProxyHandler,
 
   mappings: {
-    "application": {
-      endpoint: "application"
+    application: {
+      endpoint: "application",
     },
-    "client": {
-      endpoint: "client"
+    client: {
+      endpoint: "client",
     },
-    "message": {
-      endpoint: "message"
+    message: {
+      endpoint: "message",
     },
   },
 };

src/widgets/jackett/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/jackett/widget.js

@@ -1,12 +1,12 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/v2.0/{endpoint}?apikey={key}&configured=true",
   proxyHandler: genericProxyHandler,
 
   mappings: {
-    "indexers": {
-      endpoint: "indexers"
+    indexers: {
+      endpoint: "indexers",
     },
   },
 };

src/widgets/jellyseerr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/jellyseerr/widget.js

@@ -1,4 +1,4 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}",
@@ -6,7 +6,7 @@ const widget = {
 
   mappings: {
     "request/count": {
-      endpoint: "request/count"
+      endpoint: "request/count",
     },
   },
 };

src/widgets/lidarr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/lidarr/widget.js

@@ -1,5 +1,5 @@
-import genericProxyHandler from "utils/proxies/generic";
-import { jsonArrayFilter } from "utils/api-helpers";
+import genericProxyHandler from "utils/proxy/handlers/generic";
+import { jsonArrayFilter } from "utils/proxy/api-helpers";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}?apikey={key}",

src/widgets/mastodon/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/mastodon/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}",

src/widgets/npm/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/npm/proxy.js

@@ -1,5 +1,5 @@
 import getServiceWidget from "utils/service-helpers";
-import { formatApiCall } from "utils/api-helpers";
+import { formatApiCall } from "utils/proxy/api-helpers";
 import widgets from "widgets/widgets";
 
 export default async function npmProxyHandler(req, res) {

src/widgets/nzbget/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation("common");

src/widgets/ombi/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/ombi/widget.js

@@ -1,4 +1,4 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}",

src/widgets/overseerr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/overseerr/widget.js

@@ -1,4 +1,4 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}",

src/widgets/pihole/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/pihole/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/admin/{endpoint}",

src/widgets/portainer/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/portainer/widget.js

@@ -1,4 +1,4 @@
-import credentialedProxyHandler from "utils/proxies/credentialed";
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
 
 const widget = {
   api: "{url}/api/endpoints/{env}/{endpoint}",

src/widgets/prowlarr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/prowlarr/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}",

src/widgets/qbittorrent/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/qbittorrent/proxy.js

@@ -1,6 +1,6 @@
-import { formatApiCall } from "utils/api-helpers";
-import { addCookieToJar, setCookieHeader } from "utils/cookie-jar";
-import { httpProxy } from "utils/http";
+import { formatApiCall } from "utils/proxy/api-helpers";
+import { addCookieToJar, setCookieHeader } from "utils/proxy/cookie-jar";
+import { httpProxy } from "utils/proxy/http";
 import getServiceWidget from "utils/service-helpers";
 
 async function login(widget, params) {

src/widgets/radarr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/radarr/widget.js

@@ -1,5 +1,5 @@
-import genericProxyHandler from "utils/proxies/generic";
-import { jsonArrayFilter } from "utils/api-helpers";
+import genericProxyHandler from "utils/proxy/handlers/generic";
+import { jsonArrayFilter } from "utils/proxy/api-helpers";
 
 const widget = {
   api: "{url}/api/v3/{endpoint}?apikey={key}",

src/widgets/readarr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/readarr/widget.js

@@ -1,5 +1,5 @@
-import genericProxyHandler from "utils/proxies/generic";
-import { jsonArrayFilter } from "utils/api-helpers";
+import genericProxyHandler from "utils/proxy/handlers/generic";
+import { jsonArrayFilter } from "utils/proxy/api-helpers";
 
 const widget = {
   api: "{url}/api/v1/{endpoint}?apikey={key}",

src/widgets/rutorrent/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/sabnzbd/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/sabnzbd/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/?apikey={key}&output=json&mode={endpoint}",

src/widgets/sonarr/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/sonarr/widget.js

@@ -1,5 +1,5 @@
-import genericProxyHandler from "utils/proxies/generic";
-import { asJson } from "utils/api-helpers";
+import genericProxyHandler from "utils/proxy/handlers/generic";
+import { asJson } from "utils/proxy/api-helpers";
 
 const widget = {
   api: "{url}/api/v3/{endpoint}?apikey={key}",

src/widgets/speedtest/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/speedtest/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/{endpoint}",

src/widgets/strelaysrv/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/strelaysrv/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/{endpoint}",

src/widgets/tautulli/component.jsx

@@ -5,7 +5,7 @@ import { BsFillPlayFill, BsPauseFill, BsCpu, BsFillCpuFill } from "react-icons/b
 import { MdOutlineSmartDisplay, MdSmartDisplay } from "react-icons/md";
 
 import Widget from "components/services/widgets/widget";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 function millisecondsToTime(milliseconds) {
   const seconds = Math.floor((milliseconds / 1000) % 60);

src/widgets/tautulli/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/v2?apikey={key}&cmd={endpoint}",

src/widgets/traefik/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/traefik/widget.js

@@ -1,4 +1,4 @@
-import genericProxyHandler from "utils/proxies/generic";
+import genericProxyHandler from "utils/proxy/handlers/generic";
 
 const widget = {
   api: "{url}/api/{endpoint}",

src/widgets/transmission/component.jsx

@@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 
 import Widget from "components/services/widgets/widget";
 import Block from "components/services/widgets/block";
-import { formatProxyUrl } from "utils/api-helpers";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
 
 export default function Component({ service }) {
   const { t } = useTranslation();

src/widgets/transmission/proxy.js

@@ -1,5 +1,5 @@
-import { httpProxy } from "utils/http";
-import { formatApiCall } from "utils/api-helpers";
+import { httpProxy } from "utils/proxy/http";
+import { formatApiCall } from "utils/proxy/api-helpers";
 import getServiceWidget from "utils/service-helpers";
 
 export default async function transmissionProxyHandler(req, res) {
@@ -23,8 +23,8 @@ export default async function transmissionProxyHandler(req, res) {
   const body = JSON.stringify({
     method: "torrent-get",
     arguments: {
-      fields: ["percentDone", "status", "rateDownload", "rateUpload"]
-    }
+      fields: ["percentDone", "status", "rateDownload", "rateUpload"],
+    },
   });
 
   const headers = {