🐛 Fix Docker integration actions timeouts

Author: ajnart

src/components/modules/docker/ContainerActionBar.tsx

@@ -9,35 +9,36 @@ import {
   IconRefresh,
   IconRotateClockwise,
   IconTrash,
-  IconX,
 } from '@tabler/icons';
 import axios from 'axios';
 import Dockerode from 'dockerode';
 import { tryMatchService } from '../../../tools/addToHomarr';
-import { useConfig } from '../../../tools/state';
 import { AddAppShelfItemForm } from '../../AppShelf/AddAppShelfItem';
 
-function sendDockerCommand(action: string, containerId: string, containerName: string) {
+function sendDockerCommand(
+  action: string,
+  containerId: string,
+  containerName: string,
+  reload: () => void
+) {
   showNotification({
     id: containerId,
     loading: true,
-    title: `${action}ing container ${containerName.substring(1)}`,
+    title: `${action}ing container ${containerName}`,
     message: undefined,
     autoClose: false,
     disallowClose: true,
   });
   axios
     .get(`/api/docker/container/${containerId}?action=${action}`)
     .then((res) => {
-      if (res.data.success === true) {
-        updateNotification({
-          id: containerId,
-          title: `Container ${containerName} ${action}ed`,
-          message: `Your container was successfully ${action}ed`,
-          icon: <IconCheck />,
-          autoClose: 2000,
-        });
-      }
+      updateNotification({
+        id: containerId,
+        title: `Container ${containerName} ${action}ed`,
+        message: `Your container was successfully ${action}ed`,
+        icon: <IconCheck />,
+        autoClose: 2000,
+      });
     })
     .catch((err) => {
       updateNotification({
@@ -47,6 +48,9 @@ function sendDockerCommand(action: string, containerId: string, containerName: s
         message: err.response.data.reason,
         autoClose: 2000,
       });
+    })
+    .finally(() => {
+      reload();
     });
 }
 
@@ -56,7 +60,6 @@ export interface ContainerActionBarProps {
 }
 
 export default function ContainerActionBar({ selected, reload }: ContainerActionBarProps) {
-  const { config, setConfig } = useConfig();
   const [opened, setOpened] = useBooleanToggle(false);
   return (
     <Group>
@@ -78,19 +81,9 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction
         onClick={() =>
           Promise.all(
             selected.map((container) =>
-              sendDockerCommand('restart', container.Id, container.Names[0].substring(1))
+              sendDockerCommand('restart', container.Id, container.Names[0].substring(1), reload)
             )
           )
-            .catch((err) => {
-              showNotification({
-                color: 'red',
-                title: 'There was an error with your container.',
-                message: err.message,
-                icon: <IconX />,
-                autoClose: 2000,
-              });
-            })
-            .then(() => reload())
         }
         variant="light"
         color="orange"
@@ -103,9 +96,9 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction
         onClick={() =>
           Promise.all(
             selected.map((container) =>
-              sendDockerCommand('stop', container.Id, container.Names[0].substring(1))
+              sendDockerCommand('stop', container.Id, container.Names[0].substring(1), reload)
             )
-          ).then(() => reload())
+          )
         }
         variant="light"
         color="red"
@@ -118,9 +111,9 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction
         onClick={() =>
           Promise.all(
             selected.map((container) =>
-              sendDockerCommand('start', container.Id, container.Names[0].substring(1))
+              sendDockerCommand('start', container.Id, container.Names[0].substring(1), reload)
             )
-          ).then(() => reload())
+          )
         }
         variant="light"
         color="green"
@@ -140,7 +133,7 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction
           if (selected.length !== 1) {
             showNotification({
               autoClose: 5000,
-              title: <Title order={4}>Please only add one service at a time!</Title>,
+              title: <Title order={5}>Please only add one service at a time!</Title>,
               color: 'red',
               message: undefined,
             });
@@ -158,18 +151,10 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction
         radius="md"
         onClick={() =>
           Promise.all(
-            selected.map((container) => {
-              if (container.State === 'running') {
-                return showNotification({
-                  id: container.Id,
-                  title: `Failed to delete ${container.Names[0].substring(1)}`,
-                  message: "You can't delete a running container",
-                  autoClose: 1000,
-                });
-              }
-              return sendDockerCommand('remove', container.Id, container.Names[0].substring(1));
-            })
-          ).then(() => reload())
+            selected.map((container) =>
+              sendDockerCommand('remove', container.Id, container.Names[0].substring(1), reload)
+            )
+          )
         }
       >
         Remove

src/components/modules/downloads/DownloadsModule.tsx

@@ -53,7 +53,7 @@ export default function DownloadComponent() {
   useEffect(() => {
     setIsLoading(true);
     if (downloadServices.length === 0) return;
-    const interval = setSafeInterval(() => {
+    const interval = setInterval(() => {
       // Send one request with each download service inside
       axios
         .post('/api/modules/downloads')
@@ -66,14 +66,16 @@ export default function DownloadComponent() {
           // eslint-disable-next-line no-console
           console.error('Error while fetching torrents', error.response.data);
           setIsLoading(false);
-          clearInterval(interval);
           showNotification({
             title: 'Error fetching torrents',
-            autoClose: false,
+            autoClose: 1000,
+            disallowClose: true,
+            id: 'fail-torrent-downloads-module',
             color: 'red',
             message:
               'Please check your config for any potential errors, check the console for more info',
           });
+          clearInterval(interval);
         });
     }, 5000);
   }, []);

src/components/modules/downloads/TotalDownloadsModule.tsx

@@ -43,8 +43,8 @@ export default function TotalDownloadsComponent() {
   const totalDownloadSpeed = torrents.reduce((acc, torrent) => acc + torrent.downloadSpeed, 0);
   const totalUploadSpeed = torrents.reduce((acc, torrent) => acc + torrent.uploadSpeed, 0);
   useEffect(() => {
-    if (downloadServices.length === 0) return;
     const interval = setSafeInterval(() => {
+      // Send one request with each download service inside
       axios
         .post('/api/modules/downloads')
         .then((response) => {
@@ -54,14 +54,16 @@ export default function TotalDownloadsComponent() {
           setTorrents([]);
           // eslint-disable-next-line no-console
           console.error('Error while fetching torrents', error.response.data);
-          clearInterval(interval);
           showNotification({
-            title: 'Error fetching torrents',
-            autoClose: false,
+            title: 'Torrent speed module failed to fetch torrents',
+            autoClose: 1000,
+            disallowClose: true,
+            id: 'fail-torrent-speed-module',
             color: 'red',
             message:
-              'Please check your config for any potential errors, check the console for more info',
+              'Error fetching torrents, please check your config for any potential errors, check the console for more info',
           });
+          clearInterval(interval);
         });
     }, 1000);
   }, [config.services]);