🔀 Merge branch 'dev' into next-13

src/pages/[slug].tsx

@@ -8,8 +8,8 @@ import Layout from '../components/layout/Layout';
 import { useInitConfig } from '../config/init';
 import { getFallbackConfig } from '../tools/config/getFallbackConfig';
 import { getFrontendConfig } from '../tools/config/getFrontendConfig';
-import { getServerSideTranslations } from '../tools/getServerSideTranslations';
-import { dashboardNamespaces } from '../tools/translation-namespaces';
+import { getServerSideTranslations } from '../tools/server/getServerSideTranslations';
+import { dashboardNamespaces } from '../tools/server/translation-namespaces';
 import { ConfigType } from '../types/config';
 import { DashboardServerSideProps } from '../types/dashboardPageType';
 

src/pages/_app.tsx

@@ -8,7 +8,8 @@ import { GetServerSidePropsContext } from 'next';
 import { appWithTranslation } from 'next-i18next';
 import { AppProps } from 'next/app';
 import Head from 'next/head';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { ChangeAppPositionModal } from '../components/Dashboard/Modals/ChangePosition/ChangeAppPositionModal';
 import { ChangeWidgetPositionModal } from '../components/Dashboard/Modals/ChangePosition/ChangeWidgetPositionModal';
 import { EditAppModal } from '../components/Dashboard/Modals/EditAppModal/EditAppModal';
@@ -21,8 +22,16 @@ import '../styles/global.scss';
 import { ColorTheme } from '../tools/color';
 import { queryClient } from '../tools/queryClient';
 import { theme } from '../tools/theme';
+import {
+  getServiceSidePackageAttributes,
+  ServerSidePackageAttributesType,
+} from '../tools/server/getPackageVersion';
+import { usePackageAttributesStore } from '../tools/client/zustands/usePackageAttributesStore';
 
-function App(this: any, props: AppProps & { colorScheme: ColorScheme }) {
+function App(
+  this: any,
+  props: AppProps & { colorScheme: ColorScheme; packageAttributes: ServerSidePackageAttributesType }
+) {
   const { Component, pageProps } = props;
   const [primaryColor, setPrimaryColor] = useState<MantineTheme['primaryColor']>('red');
   const [secondaryColor, setSecondaryColor] = useState<MantineTheme['primaryColor']>('orange');
@@ -45,6 +54,12 @@ function App(this: any, props: AppProps & { colorScheme: ColorScheme }) {
     getInitialValueInEffect: true,
   });
 
+  const { setInitialPackageAttributes } = usePackageAttributesStore();
+
+  useEffect(() => {
+    setInitialPackageAttributes(props.packageAttributes);
+  }, []);
+
   const toggleColorScheme = (value?: ColorScheme) =>
     setColorScheme(value || (colorScheme === 'dark' ? 'light' : 'dark'));
 
@@ -102,6 +117,7 @@ function App(this: any, props: AppProps & { colorScheme: ColorScheme }) {
             </MantineProvider>
           </ColorTheme.Provider>
         </ColorSchemeProvider>
+        <ReactQueryDevtools initialIsOpen={false} />
       </QueryClientProvider>
     </>
   );
@@ -109,6 +125,7 @@ function App(this: any, props: AppProps & { colorScheme: ColorScheme }) {
 
 App.getInitialProps = ({ ctx }: { ctx: GetServerSidePropsContext }) => ({
   colorScheme: getCookie('color-scheme', ctx) || 'light',
+  packageAttributes: getServiceSidePackageAttributes(),
 });
 
 export default appWithTranslation(App);

src/pages/api/getLocalImages.ts

@@ -0,0 +1,27 @@
+import { NextApiRequest, NextApiResponse } from 'next';
+import fs from 'fs';
+
+function Get(req: NextApiRequest, res: NextApiResponse) {
+  // Get the name of all the files in the /public/icons folder handle if the folder doesn't exist
+  if (!fs.existsSync('./public/icons')) {
+    return res.status(200).json({
+      files: [],
+    });
+  }
+  const files = fs.readdirSync('./public/icons');
+  // Return the list of files with the /public/icons prefix
+  return res.status(200).json({
+    files: files.map((file) => `/icons/${file}`),
+  });
+}
+
+export default async (req: NextApiRequest, res: NextApiResponse) => {
+  // Filter out if the reuqest is a POST or a GET
+  if (req.method === 'GET') {
+    return Get(req, res);
+  }
+  return res.status(405).json({
+    statusCode: 405,
+    message: 'Method not allowed',
+  });
+};

src/pages/api/modules/downloads/index.ts

@@ -0,0 +1,220 @@
+import { Deluge } from '@ctrl/deluge';
+import { QBittorrent } from '@ctrl/qbittorrent';
+import { Transmission } from '@ctrl/transmission';
+import { AllClientData } from '@ctrl/shared-torrent';
+import Consola from 'consola';
+import { getCookie } from 'cookies-next';
+import dayjs from 'dayjs';
+import { NextApiRequest, NextApiResponse } from 'next';
+import { Client } from 'sabnzbd-api';
+import { getConfig } from '../../../../tools/config/getConfig';
+import {
+  NormalizedDownloadAppStat,
+  NormalizedDownloadQueueResponse,
+} from '../../../../types/api/downloads/queue/NormalizedDownloadQueueResponse';
+import { ConfigAppType, IntegrationField } from '../../../../types/app';
+import { UsenetQueueItem } from '../../../../widgets/useNet/types';
+import { NzbgetClient } from '../usenet/nzbget/nzbget-client';
+import { NzbgetQueueItem, NzbgetStatus } from '../usenet/nzbget/types';
+
+const Get = async (request: NextApiRequest, response: NextApiResponse) => {
+  const configName = getCookie('config-name', { req: request });
+  const config = getConfig(configName?.toString() ?? 'default');
+
+  const failedClients: string[] = [];
+
+  const clientData: Promise<NormalizedDownloadAppStat>[] = config.apps.map(async (app) => {
+    try {
+      const response = await GetDataFromClient(app);
+
+      if (!response) {
+        return {
+          success: false,
+        } as NormalizedDownloadAppStat;
+      }
+
+      return response;
+    } catch (err: any) {
+      Consola.error(
+        `Error communicating with your download client '${app.name}' (${app.id}): ${err}`
+      );
+      failedClients.push(app.id);
+      return {
+        success: false,
+      } as NormalizedDownloadAppStat;
+    }
+  });
+
+  const settledPromises = await Promise.allSettled(clientData);
+
+  const data: NormalizedDownloadAppStat[] = settledPromises
+    .filter((x) => x.status === 'fulfilled')
+    .map((promise) => (promise as PromiseFulfilledResult<NormalizedDownloadAppStat>).value)
+    .filter((x) => x !== undefined && x.type !== undefined);
+
+  const responseBody = { apps: data, failedApps: failedClients } as NormalizedDownloadQueueResponse;
+
+  if (failedClients.length > 0) {
+    Consola.warn(`${failedClients.length} download clients failed. Please check your configuration and the above log`);
+  }
+
+  return response.status(200).json(responseBody);
+};
+
+const GetDataFromClient = async (
+  app: ConfigAppType
+): Promise<NormalizedDownloadAppStat | undefined> => {
+  const reduceTorrent = (data: AllClientData): NormalizedDownloadAppStat => ({
+    type: 'torrent',
+    appId: app.id,
+    success: true,
+    torrents: data.torrents,
+    totalDownload: data.torrents
+      .map((torrent) => torrent.downloadSpeed)
+      .reduce((acc, torrent) => acc + torrent),
+    totalUpload: data.torrents
+      .map((torrent) => torrent.uploadSpeed)
+      .reduce((acc, torrent) => acc + torrent),
+  });
+
+  const findField = (app: ConfigAppType, field: IntegrationField) =>
+    app.integration?.properties.find((x) => x.field === field)?.value ?? undefined;
+
+  switch (app.integration?.type) {
+    case 'deluge': {
+      return reduceTorrent(
+        await new Deluge({
+          baseUrl: app.url,
+          password: findField(app, 'password'),
+        }).getAllData()
+      );
+    }
+    case 'transmission': {
+      return reduceTorrent(
+        await new Transmission({
+          baseUrl: app.url,
+          username: findField(app, 'username'),
+          password: findField(app, 'password'),
+        }).getAllData()
+      );
+    }
+    case 'qBittorrent': {
+      return reduceTorrent(
+        await new QBittorrent({
+          baseUrl: app.url,
+          username: findField(app, 'username'),
+          password: findField(app, 'password'),
+        }).getAllData()
+      );
+    }
+    case 'sabnzbd': {
+      const { origin } = new URL(app.url);
+      const client = new Client(origin, findField(app, 'apiKey') ?? '');
+      const queue = await client.queue();
+      const items: UsenetQueueItem[] = queue.slots.map((slot) => {
+        const [hours, minutes, seconds] = slot.timeleft.split(':');
+        const eta = dayjs.duration({
+          hour: parseInt(hours, 10),
+          minutes: parseInt(minutes, 10),
+          seconds: parseInt(seconds, 10),
+        } as any);
+
+        return {
+          id: slot.nzo_id,
+          eta: eta.asSeconds(),
+          name: slot.filename,
+          progress: parseFloat(slot.percentage),
+          size: parseFloat(slot.mb) * 1000 * 1000,
+          state: slot.status.toLowerCase() as any,
+        };
+      });
+      const killobitsPerSecond = Number(queue.kbpersec);
+      const bytesPerSecond = killobitsPerSecond * 1024; // convert killobytes to bytes
+      return {
+        type: 'usenet',
+        appId: app.id,
+        totalDownload: bytesPerSecond,
+        nzbs: items,
+        success: true,
+      };
+    }
+    case 'nzbGet': {
+      const url = new URL(app.url);
+      const options = {
+        host: url.hostname,
+        port: url.port,
+        login: app.integration.properties.find((x) => x.field === 'username')?.value ?? undefined,
+        hash: app.integration.properties.find((x) => x.field === 'password')?.value ?? undefined,
+      };
+
+      const nzbGet = NzbgetClient(options);
+      const nzbgetQueue: NzbgetQueueItem[] = await new Promise((resolve, reject) => {
+        nzbGet.listGroups((err: any, result: NzbgetQueueItem[]) => {
+          if (!err) {
+            resolve(result);
+          } else {
+            Consola.error(`Error while listing groups: ${err}`);
+            reject(err);
+          }
+        });
+      });
+      if (!nzbgetQueue) {
+        throw new Error('Error while getting NZBGet queue');
+      }
+
+      const nzbgetStatus: NzbgetStatus = await new Promise((resolve, reject) => {
+        nzbGet.status((err: any, result: NzbgetStatus) => {
+          if (!err) {
+            resolve(result);
+          } else {
+            Consola.error(`Error while retrieving NZBGet stats: ${err}`);
+            reject(err);
+          }
+        });
+      });
+
+      if (!nzbgetStatus) {
+        throw new Error('Error while getting NZBGet status');
+      }
+
+      const nzbgetItems: UsenetQueueItem[] = nzbgetQueue.map((item: NzbgetQueueItem) => ({
+        id: item.NZBID.toString(),
+        name: item.NZBName,
+        progress: (item.DownloadedSizeMB / item.FileSizeMB) * 100,
+        eta: (item.RemainingSizeMB * 1000000) / nzbgetStatus.DownloadRate,
+        // Multiple MB to get bytes
+        size: item.FileSizeMB * 1000 * 1000,
+        state: getNzbgetState(item.Status),
+      }));
+
+      return {
+        type: 'usenet',
+        appId: app.id,
+        nzbs: nzbgetItems,
+        success: true,
+        totalDownload: 0,
+      };
+    }
+    default:
+      return undefined;
+  }
+};
+
+export default async (request: NextApiRequest, response: NextApiResponse) => {
+  if (request.method === 'GET') {
+    return Get(request, response);
+  }
+
+  return response.status(405);
+};
+
+function getNzbgetState(status: string) {
+  switch (status) {
+    case 'QUEUED':
+      return 'queued';
+    case 'PAUSED ':
+      return 'paused';
+    default:
+      return 'downloading';
+  }
+}

src/pages/api/modules/torrents.ts

@@ -1,131 +0,0 @@
-import { Deluge } from '@ctrl/deluge';
-import { QBittorrent } from '@ctrl/qbittorrent';
-import { AllClientData } from '@ctrl/shared-torrent';
-import { Transmission } from '@ctrl/transmission';
-import Consola from 'consola';
-import { getCookie } from 'cookies-next';
-import { NextApiRequest, NextApiResponse } from 'next';
-import { getConfig } from '../../../tools/config/getConfig';
-import { NormalizedTorrentListResponse } from '../../../types/api/NormalizedTorrentListResponse';
-import { ConfigAppType, IntegrationType } from '../../../types/app';
-
-const supportedTypes: IntegrationType[] = ['deluge', 'qBittorrent', 'transmission'];
-
-async function Post(req: NextApiRequest, res: NextApiResponse<NormalizedTorrentListResponse>) {
-  // Get the type of app from the request url
-  const configName = getCookie('config-name', { req });
-  const config = getConfig(configName?.toString() ?? 'default');
-
-  const clientApps = config.apps.filter(
-    (app) =>
-      app.integration && app.integration.type && supportedTypes.includes(app.integration.type)
-  );
-
-  if (clientApps.length < 1) {
-    return res.status(500).json({
-      allSuccess: false,
-      missingDownloadClients: true,
-      labels: [],
-      torrents: [],
-    });
-  }
-
-  const promiseList: Promise<ConcatenatedClientData>[] = [];
-
-  for (let i = 0; i < clientApps.length; i += 1) {
-    const app = clientApps[i];
-    const getAllData = getAllDataForClient(app);
-    if (!getAllData) {
-      continue;
-    }
-    const concatenatedPromise = async (): Promise<ConcatenatedClientData> => ({
-      clientData: await getAllData,
-      appId: app.id,
-    });
-    promiseList.push(concatenatedPromise());
-  }
-
-  const settledPromises = await Promise.allSettled(promiseList);
-  const fulfilledPromises = settledPromises.filter(
-    (settledPromise) => settledPromise.status === 'fulfilled'
-  );
-
-  const fulfilledClientData: ConcatenatedClientData[] = fulfilledPromises.map(
-    (fulfilledPromise) => (fulfilledPromise as PromiseFulfilledResult<ConcatenatedClientData>).value
-  );
-
-  const notFulfilledClientData = settledPromises
-    .filter((x) => x.status === 'rejected')
-    .map(
-      (fulfilledPromise) =>
-        (fulfilledPromise as PromiseRejectedResult)
-  );
-
-  notFulfilledClientData.forEach((result) => {
-    Consola.error(`Error while communicating with torrent download client: ${result.reason}`);
-  });
-
-  Consola.info(
-    `Successfully fetched data from ${fulfilledPromises.length} torrent download clients`
-  );
-
-  return res.status(200).json({
-    labels: fulfilledClientData.flatMap((clientData) => clientData.clientData.labels),
-    torrents: fulfilledClientData.map((clientData) => ({
-      appId: clientData.appId,
-      torrents: clientData.clientData.torrents,
-    })),
-    allSuccess: settledPromises.length === fulfilledPromises.length,
-    missingDownloadClients: false,
-  });
-}
-
-const getAllDataForClient = (app: ConfigAppType) => {
-  switch (app.integration?.type) {
-    case 'deluge': {
-      const password =
-        app.integration?.properties.find((x) => x.field === 'password')?.value ?? undefined;
-      return new Deluge({
-        baseUrl: app.url,
-        password,
-      }).getAllData();
-    }
-    case 'transmission': {
-      return new Transmission({
-        baseUrl: app.url,
-        username:
-          app.integration!.properties.find((x) => x.field === 'username')?.value ?? undefined,
-        password:
-          app.integration!.properties.find((x) => x.field === 'password')?.value ?? undefined,
-      }).getAllData();
-    }
-    case 'qBittorrent': {
-      return new QBittorrent({
-        baseUrl: app.url,
-        username:
-          app.integration!.properties.find((x) => x.field === 'username')?.value ?? undefined,
-        password:
-          app.integration!.properties.find((x) => x.field === 'password')?.value ?? undefined,
-      }).getAllData();
-    }
-    default:
-      Consola.error(`unable to find torrent client of type '${app.integration?.type}'`);
-      return undefined;
-  }
-};
-
-type ConcatenatedClientData = {
-  appId: string;
-  clientData: AllClientData;
-};
-
-export default async (req: NextApiRequest, res: NextApiResponse) => {
-  // Filter out if the reuqest is a POST or a GET
-  if (req.method === 'POST') {
-    return Post(req, res);
-  }
-  return res.status(405).json({
-    statusCode: 405,
-    message: 'Method not allowed',
-  });
-};

src/pages/api/modules/usenet/history.ts

@@ -39,7 +39,7 @@ async function Get(req: NextApiRequest, res: NextApiResponse) {
         const url = new URL(app.url);
         const options = {
           host: url.hostname,
-          port: url.port,
+          port: url.port || (url.protocol === 'https:' ? '443' : '80'),
           login: app.integration.properties.find((x) => x.field === 'username')?.value ?? undefined,
           hash: app.integration.properties.find((x) => x.field === 'password')?.value ?? undefined,
         };

src/pages/api/modules/usenet/index.ts

@@ -38,7 +38,7 @@ async function Get(req: NextApiRequest, res: NextApiResponse) {
         const url = new URL(app.url);
         const options = {
           host: url.hostname,
-          port: url.port,
+          port: url.port || (url.protocol === 'https:' ? '443' : '80'),
           login: app.integration.properties.find((x) => x.field === 'username')?.value ?? undefined,
           hash: app.integration.properties.find((x) => x.field === 'password')?.value ?? undefined,
         };

src/pages/api/modules/usenet/pause.ts

@@ -30,7 +30,7 @@ async function Post(req: NextApiRequest, res: NextApiResponse) {
         const url = new URL(app.url);
         const options = {
           host: url.hostname,
-          port: url.port,
+          port: url.port || (url.protocol === 'https:' ? '443' : '80'),
           login: app.integration.properties.find((x) => x.field === 'username')?.value ?? undefined,
           hash: app.integration.properties.find((x) => x.field === 'password')?.value ?? undefined,
         };

src/pages/api/modules/usenet/queue.ts

@@ -39,7 +39,7 @@ async function Get(req: NextApiRequest, res: NextApiResponse) {
         const url = new URL(app.url);
         const options = {
           host: url.hostname,
-          port: url.port,
+          port: url.port || (url.protocol === 'https:' ? '443' : '80'),
           login: app.integration.properties.find((x) => x.field === 'username')?.value ?? undefined,
           hash: app.integration.properties.find((x) => x.field === 'password')?.value ?? undefined,
         };

src/pages/api/modules/usenet/resume.ts

@@ -31,7 +31,7 @@ async function Post(req: NextApiRequest, res: NextApiResponse) {
         const url = new URL(app.url);
         const options = {
           host: url.hostname,
-          port: url.port,
+          port: url.port || (url.protocol === 'https:' ? '443' : '80'),
           login: app.integration.properties.find((x) => x.field === 'username')?.value ?? undefined,
           hash: app.integration.properties.find((x) => x.field === 'password')?.value ?? undefined,
         };

src/pages/index.tsx

@@ -1,14 +1,14 @@
 import { getCookie, setCookie } from 'cookies-next';
+import fs from 'fs';
 import { GetServerSidePropsContext } from 'next';
 
-import fs from 'fs';
 import { LoadConfigComponent } from '../components/Config/LoadConfig';
 import { Dashboard } from '../components/Dashboard/Dashboard';
 import Layout from '../components/layout/Layout';
 import { useInitConfig } from '../config/init';
 import { getFrontendConfig } from '../tools/config/getFrontendConfig';
-import { getServerSideTranslations } from '../tools/getServerSideTranslations';
-import { dashboardNamespaces } from '../tools/translation-namespaces';
+import { getServerSideTranslations } from '../tools/server/getServerSideTranslations';
+import { dashboardNamespaces } from '../tools/server/translation-namespaces';
 import { DashboardServerSideProps } from '../types/dashboardPageType';
 
 export async function getServerSideProps({
@@ -47,11 +47,14 @@ export async function getServerSideProps({
   }
 
   const translations = await getServerSideTranslations(req, res, dashboardNamespaces, locale);
-
   const config = getFrontendConfig(configName as string);
 
   return {
-    props: { configName: configName as string, config, ...translations },
+    props: {
+      configName: configName as string,
+      config,
+      ...translations,
+    },
   };
 }
 

src/pages/login.tsx

@@ -8,7 +8,7 @@ import { useRouter } from 'next/router';
 import { useTranslation } from 'next-i18next';
 import { useForm } from '@mantine/form';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-import { loginNamespaces } from '../tools/translation-namespaces';
+import { loginNamespaces } from '../tools/server/translation-namespaces';
 
 // TODO: Add links to the wiki articles about the login process.
 export default function AuthenticationTitle() {