From 01fac01aa15e23589d3bc151c1e473cdc2e94ed7 Mon Sep 17 00:00:00 2001
From: hillaliy <hillaliy@me.com>
Date: Fri, 9 Aug 2024 15:29:08 +0300
Subject: [PATCH 1/5] fix: DnsHole controls timer

---
 .../adguard-home/adguard-home-integration.ts  |  1 +
 .../src/dns-hole/controls/TimerModal.tsx      |  6 +--
 .../src/dns-hole/controls/component.tsx       | 38 +++++++++++++++++--
 3 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/packages/integrations/src/adguard-home/adguard-home-integration.ts b/packages/integrations/src/adguard-home/adguard-home-integration.ts
index a41070c78..37643ae1a 100644
--- a/packages/integrations/src/adguard-home/adguard-home-integration.ts
+++ b/packages/integrations/src/adguard-home/adguard-home-integration.ts
@@ -124,6 +124,7 @@ export class AdGuardHomeIntegration extends Integration implements DnsHoleSummar
   }
 
   public async disableAsync(duration?: number): Promise<void> {
+    duration = duration ? duration * 1000 : 0;
     const response = await fetch(`${this.integration.url}/control/protection`, {
       method: "POST",
       headers: {
diff --git a/packages/widgets/src/dns-hole/controls/TimerModal.tsx b/packages/widgets/src/dns-hole/controls/TimerModal.tsx
index 71cb09c10..9f6a7210f 100644
--- a/packages/widgets/src/dns-hole/controls/TimerModal.tsx
+++ b/packages/widgets/src/dns-hole/controls/TimerModal.tsx
@@ -8,11 +8,11 @@ import { useI18n } from "@homarr/translation/client";
 interface TimerModalProps {
   opened: boolean;
   close: () => void;
-  integrationIds: string[];
+  selectedIntegration: string[];
   disableDns: (data: { duration: number; integrationId: string }) => void;
 }
 
-const TimerModal = ({ opened, close, integrationIds, disableDns }: TimerModalProps) => {
+const TimerModal = ({ opened, close, selectedIntegration, disableDns }: TimerModalProps) => {
   const t = useI18n();
   const [hours, setHours] = useState(0);
   const [minutes, setMinutes] = useState(0);
@@ -21,7 +21,7 @@ const TimerModal = ({ opened, close, integrationIds, disableDns }: TimerModalPro
 
   const handleSetTimer = () => {
     const duration = hours * 3600 + minutes * 60;
-    integrationIds.forEach((integrationId) => {
+    selectedIntegration.forEach((integrationId) => {
       disableDns({ duration, integrationId });
     });
     setHours(0);
diff --git a/packages/widgets/src/dns-hole/controls/component.tsx b/packages/widgets/src/dns-hole/controls/component.tsx
index de89e89ce..1c027b849 100644
--- a/packages/widgets/src/dns-hole/controls/component.tsx
+++ b/packages/widgets/src/dns-hole/controls/component.tsx
@@ -24,6 +24,7 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
   const [status, setStatus] = useState<{ integrationId: string; enabled: boolean }[]>(
     integrationIds.map((id) => ({ integrationId: id, enabled: false })),
   );
+  const [selectedIntegration, setSelectedIntegration] = useState<string[]>([]);
   const [opened, { close, open }] = useDisclosure(false);
 
   const [data] = clientApi.widget.dnsHole.summary.useSuspenseQuery(
@@ -90,7 +91,17 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
           </Tooltip>
 
           <Tooltip label={t("widget.dnsHoleControls.controls.setTimer")}>
-            <Button onClick={open} disabled={allDisabled} variant="light" color="yellow" fullWidth h="2rem">
+            <Button
+              onClick={() => {
+                setSelectedIntegration(integrationIds);
+                open();
+              }}
+              disabled={allDisabled}
+              variant="light"
+              color="yellow"
+              fullWidth
+              h="2rem"
+            >
               <IconClockPause size={20} />
             </Button>
           </Tooltip>
@@ -114,11 +125,19 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
 
       <Stack gap="2.5cqmin" flex={1} justify={options.showToggleAllButtons ? "flex-end" : "space-evenly"}>
         {data.map((integrationData) =>
-          ControlsCard(integrationData.integrationId, integrationData.integrationKind, toggleDns, status, open, t),
+          ControlsCard(
+            integrationData.integrationId,
+            integrationData.integrationKind,
+            toggleDns,
+            status,
+            setSelectedIntegration,
+            open,
+            t,
+          ),
         )}
       </Stack>
 
-      <TimerModal opened={opened} close={close} integrationIds={integrationIds} disableDns={disableDns} />
+      <TimerModal opened={opened} close={close} selectedIntegration={selectedIntegration} disableDns={disableDns} />
     </Flex>
   );
 }
@@ -128,6 +147,7 @@ const ControlsCard = (
   integrationKind: string,
   toggleDns: (integrationId: string) => void,
   status: { integrationId: string; enabled: boolean }[],
+  setSelectedIntegration: (integrationId: string[]) => void,
   open: () => void,
   t: TranslationFunction,
 ) => {
@@ -149,7 +169,17 @@ const ControlsCard = (
                 {t(`widget.dnsHoleControls.controls.${isEnabled ? "enabled" : "disabled"}`)}
               </Badge>
             </UnstyledButton>
-            <ActionIcon disabled={!isEnabled} size={20} radius="xl" top="2.67px" variant="default" onClick={open}>
+            <ActionIcon
+              disabled={!isEnabled}
+              size={20}
+              radius="xl"
+              top="2.67px"
+              variant="default"
+              onClick={() => {
+                setSelectedIntegration([integrationId]);
+                open();
+              }}
+            >
               <IconClockPause size={20} color="red" />
             </ActionIcon>
           </Flex>

From 6df2b3368b0ceb38f8350524bb86ed8374cdedf7 Mon Sep 17 00:00:00 2001
From: hillaliy <hillaliy@me.com>
Date: Sat, 10 Aug 2024 07:50:18 +0300
Subject: [PATCH 2/5] fix: use plural naming

---
 .../widgets/src/dns-hole/controls/TimerModal.tsx    |  6 +++---
 .../widgets/src/dns-hole/controls/component.tsx     | 13 +++++++++----
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/packages/widgets/src/dns-hole/controls/TimerModal.tsx b/packages/widgets/src/dns-hole/controls/TimerModal.tsx
index 9f6a7210f..06281241e 100644
--- a/packages/widgets/src/dns-hole/controls/TimerModal.tsx
+++ b/packages/widgets/src/dns-hole/controls/TimerModal.tsx
@@ -8,11 +8,11 @@ import { useI18n } from "@homarr/translation/client";
 interface TimerModalProps {
   opened: boolean;
   close: () => void;
-  selectedIntegration: string[];
+  selectedIntegrationIds: string[];
   disableDns: (data: { duration: number; integrationId: string }) => void;
 }
 
-const TimerModal = ({ opened, close, selectedIntegration, disableDns }: TimerModalProps) => {
+const TimerModal = ({ opened, close, selectedIntegrationIds, disableDns }: TimerModalProps) => {
   const t = useI18n();
   const [hours, setHours] = useState(0);
   const [minutes, setMinutes] = useState(0);
@@ -21,7 +21,7 @@ const TimerModal = ({ opened, close, selectedIntegration, disableDns }: TimerMod
 
   const handleSetTimer = () => {
     const duration = hours * 3600 + minutes * 60;
-    selectedIntegration.forEach((integrationId) => {
+    selectedIntegrationIds.forEach((integrationId) => {
       disableDns({ duration, integrationId });
     });
     setHours(0);
diff --git a/packages/widgets/src/dns-hole/controls/component.tsx b/packages/widgets/src/dns-hole/controls/component.tsx
index 1c027b849..40f3fc20e 100644
--- a/packages/widgets/src/dns-hole/controls/component.tsx
+++ b/packages/widgets/src/dns-hole/controls/component.tsx
@@ -24,7 +24,7 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
   const [status, setStatus] = useState<{ integrationId: string; enabled: boolean }[]>(
     integrationIds.map((id) => ({ integrationId: id, enabled: false })),
   );
-  const [selectedIntegration, setSelectedIntegration] = useState<string[]>([]);
+  const [selectedIntegrationIds, setSelectedIntegrationIds] = useState<string[]>([]);
   const [opened, { close, open }] = useDisclosure(false);
 
   const [data] = clientApi.widget.dnsHole.summary.useSuspenseQuery(
@@ -93,7 +93,7 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
           <Tooltip label={t("widget.dnsHoleControls.controls.setTimer")}>
             <Button
               onClick={() => {
-                setSelectedIntegration(integrationIds);
+                setSelectedIntegrationIds(integrationIds);
                 open();
               }}
               disabled={allDisabled}
@@ -130,14 +130,19 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
             integrationData.integrationKind,
             toggleDns,
             status,
-            setSelectedIntegration,
+            setSelectedIntegrationIds,
             open,
             t,
           ),
         )}
       </Stack>
 
-      <TimerModal opened={opened} close={close} selectedIntegration={selectedIntegration} disableDns={disableDns} />
+      <TimerModal
+        opened={opened}
+        close={close}
+        selectedIntegrationIds={selectedIntegrationIds}
+        disableDns={disableDns}
+      />
     </Flex>
   );
 }

From 00e4f2f159918b2fe380e288081f60d36458fd71 Mon Sep 17 00:00:00 2001
From: hillaliy <hillaliy@me.com>
Date: Sat, 17 Aug 2024 09:45:12 +0300
Subject: [PATCH 3/5] fix: reviewed changes

---
 .../adguard-home/adguard-home-integration.ts  |  5 ++--
 .../src/dns-hole/controls/component.tsx       | 26 +++++++++----------
 2 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/packages/integrations/src/adguard-home/adguard-home-integration.ts b/packages/integrations/src/adguard-home/adguard-home-integration.ts
index 37643ae1a..2e41bd916 100644
--- a/packages/integrations/src/adguard-home/adguard-home-integration.ts
+++ b/packages/integrations/src/adguard-home/adguard-home-integration.ts
@@ -123,8 +123,7 @@ export class AdGuardHomeIntegration extends Integration implements DnsHoleSummar
     }
   }
 
-  public async disableAsync(duration?: number): Promise<void> {
-    duration = duration ? duration * 1000 : 0;
+  public async disableAsync(duration = 0): Promise<void> {
     const response = await fetch(`${this.integration.url}/control/protection`, {
       method: "POST",
       headers: {
@@ -133,7 +132,7 @@ export class AdGuardHomeIntegration extends Integration implements DnsHoleSummar
       },
       body: JSON.stringify({
         enabled: false,
-        duration: duration,
+        duration: duration * 1000,
       }),
     });
     if (!response.ok) {
diff --git a/packages/widgets/src/dns-hole/controls/component.tsx b/packages/widgets/src/dns-hole/controls/component.tsx
index 40f3fc20e..4f2db7bc8 100644
--- a/packages/widgets/src/dns-hole/controls/component.tsx
+++ b/packages/widgets/src/dns-hole/controls/component.tsx
@@ -68,8 +68,10 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
     }
   };
 
-  const allEnabled = status.every((item) => item.enabled);
-  const allDisabled = status.every((item) => !item.enabled);
+  const enabledIntegrations = integrationIds.filter((id) => status.find((item) => item.integrationId === id)?.enabled);
+  const disabledIntegrations = integrationIds.filter(
+    (id) => !status.find((item) => item.integrationId === id)?.enabled,
+  );
 
   return (
     <Flex h="100%" direction="column" gap={0} p="2.5cqmin">
@@ -77,10 +79,8 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
         <Flex gap="2.5cqmin">
           <Tooltip label={t("widget.dnsHoleControls.controls.enableAll")}>
             <Button
-              onClick={() => {
-                integrationIds.forEach((integrationId) => enableDns({ integrationId }));
-              }}
-              disabled={allEnabled}
+              onClick={() => disabledIntegrations.forEach((integrationId) => enableDns({ integrationId }))}
+              disabled={disabledIntegrations.length === 0}
               variant="light"
               color="green"
               fullWidth
@@ -93,10 +93,10 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
           <Tooltip label={t("widget.dnsHoleControls.controls.setTimer")}>
             <Button
               onClick={() => {
-                setSelectedIntegrationIds(integrationIds);
+                setSelectedIntegrationIds(enabledIntegrations);
                 open();
               }}
-              disabled={allDisabled}
+              disabled={enabledIntegrations.length === 0}
               variant="light"
               color="yellow"
               fullWidth
@@ -108,10 +108,8 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
 
           <Tooltip label={t("widget.dnsHoleControls.controls.disableAll")}>
             <Button
-              onClick={() => {
-                integrationIds.forEach((integrationId) => disableDns({ integrationId, duration: 0 }));
-              }}
-              disabled={allDisabled}
+              onClick={() => enabledIntegrations.forEach((integrationId) => disableDns({ integrationId, duration: 0 }))}
+              disabled={enabledIntegrations.length === 0}
               variant="light"
               color="red"
               fullWidth
@@ -152,7 +150,7 @@ const ControlsCard = (
   integrationKind: string,
   toggleDns: (integrationId: string) => void,
   status: { integrationId: string; enabled: boolean }[],
-  setSelectedIntegration: (integrationId: string[]) => void,
+  setSelectedIntegrationIds: (integrationId: string[]) => void,
   open: () => void,
   t: TranslationFunction,
 ) => {
@@ -181,7 +179,7 @@ const ControlsCard = (
               top="2.67px"
               variant="default"
               onClick={() => {
-                setSelectedIntegration([integrationId]);
+                setSelectedIntegrationIds([integrationId]);
                 open();
               }}
             >

From 56b6c34931f849b615e92cd7700b484ad92d7056 Mon Sep 17 00:00:00 2001
From: hillaliy <hillaliy@me.com>
Date: Sat, 17 Aug 2024 20:23:08 +0300
Subject: [PATCH 4/5] fix: change ControlsCard to jsx component

---
 .../src/dns-hole/controls/component.tsx       | 50 +++++++++++--------
 1 file changed, 30 insertions(+), 20 deletions(-)

diff --git a/packages/widgets/src/dns-hole/controls/component.tsx b/packages/widgets/src/dns-hole/controls/component.tsx
index 4f2db7bc8..63244ba47 100644
--- a/packages/widgets/src/dns-hole/controls/component.tsx
+++ b/packages/widgets/src/dns-hole/controls/component.tsx
@@ -122,17 +122,17 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
       )}
 
       <Stack gap="2.5cqmin" flex={1} justify={options.showToggleAllButtons ? "flex-end" : "space-evenly"}>
-        {data.map((integrationData) =>
-          ControlsCard(
-            integrationData.integrationId,
-            integrationData.integrationKind,
-            toggleDns,
-            status,
-            setSelectedIntegrationIds,
-            open,
-            t,
-          ),
-        )}
+        {data.map((integrationData) => (
+          <ControlsCard
+            integrationId={integrationData.integrationId}
+            integrationKind={integrationData.integrationKind}
+            toggleDns={toggleDns}
+            status={status}
+            setSelectedIntegrationIds={setSelectedIntegrationIds}
+            open={open}
+            t={t}
+          />
+        ))}
       </Stack>
 
       <TimerModal
@@ -145,15 +145,25 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
   );
 }
 
-const ControlsCard = (
-  integrationId: string,
-  integrationKind: string,
-  toggleDns: (integrationId: string) => void,
-  status: { integrationId: string; enabled: boolean }[],
-  setSelectedIntegrationIds: (integrationId: string[]) => void,
-  open: () => void,
-  t: TranslationFunction,
-) => {
+interface ControlsCardProps {
+  integrationId: string;
+  integrationKind: string;
+  toggleDns: (integrationId: string) => void;
+  status: { integrationId: string; enabled: boolean }[];
+  setSelectedIntegrationIds: (integrationId: string[]) => void;
+  open: () => void;
+  t: TranslationFunction;
+}
+
+const ControlsCard: React.FC<ControlsCardProps> = ({
+  integrationId,
+  integrationKind,
+  toggleDns,
+  status,
+  setSelectedIntegrationIds,
+  open,
+  t,
+}) => {
   const integrationStatus = status.find((item) => item.integrationId === integrationId);
   const isEnabled = integrationStatus?.enabled ?? false;
   const integrationDef = integrationKind === "piHole" ? integrationDefs.piHole : integrationDefs.adGuardHome;

From 6d04ee19bc4fec189614230cac165ea4011a95be Mon Sep 17 00:00:00 2001
From: hillaliy <hillaliy@me.com>
Date: Sat, 17 Aug 2024 20:30:22 +0300
Subject: [PATCH 5/5] fix: DeepSource

---
 packages/widgets/src/dns-hole/controls/component.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/widgets/src/dns-hole/controls/component.tsx b/packages/widgets/src/dns-hole/controls/component.tsx
index 63244ba47..0859dc728 100644
--- a/packages/widgets/src/dns-hole/controls/component.tsx
+++ b/packages/widgets/src/dns-hole/controls/component.tsx
@@ -124,6 +124,7 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
       <Stack gap="2.5cqmin" flex={1} justify={options.showToggleAllButtons ? "flex-end" : "space-evenly"}>
         {data.map((integrationData) => (
           <ControlsCard
+            key={integrationData.integrationId}
             integrationId={integrationData.integrationId}
             integrationKind={integrationData.integrationKind}
             toggleDns={toggleDns}