From 5385dfd918ca2a8d6616b827bcbb860960e08d37 Mon Sep 17 00:00:00 2001
From: glax <johanna@bernloehr.eu>
Date: Wed, 2 Apr 2025 01:04:37 +0200
Subject: [PATCH] Request Limits Reset

---
 .../src/Components/Settings/RequestLimits.tsx | 63 ++++++++++++++++---
 1 file changed, 54 insertions(+), 9 deletions(-)

diff --git a/tranga-website/src/Components/Settings/RequestLimits.tsx b/tranga-website/src/Components/Settings/RequestLimits.tsx
index 708226b..92b9f84 100644
--- a/tranga-website/src/Components/Settings/RequestLimits.tsx
+++ b/tranga-website/src/Components/Settings/RequestLimits.tsx
@@ -1,16 +1,26 @@
 import IBackendSettings from "../../api/types/IBackendSettings.ts";
 import {useCallback, useContext, useState} from "react";
 import {ApiUriContext} from "../../api/fetchApi.tsx";
-import {Accordion, AccordionDetails, AccordionSummary, ColorPaletteProp, Input, Stack, Typography} from "@mui/joy";
+import {
+    Accordion,
+    AccordionDetails,
+    AccordionSummary,
+    Button,
+    ColorPaletteProp,
+    Input,
+    Stack,
+    Typography
+} from "@mui/joy";
 import {RequestLimitType} from "../../api/types/EnumRequestLimitType.ts";
-import {UpdateRequestLimit} from "../../api/BackendSettings.tsx";
+import {ResetRequestLimit, ResetRequestLimits, UpdateRequestLimit} from "../../api/BackendSettings.tsx";
+import {Restore} from "@mui/icons-material";
 
 export default function RequestLimits({backendSettings}: {backendSettings?: IBackendSettings}) {
     const apiUri = useContext(ApiUriContext);
 
     const [color, setColor] = useState<ColorPaletteProp>("neutral");
     const [loading, setLoading] = useState(false);
-    const Update = useCallback((target: HTMLInputElement, limit : RequestLimitType) => {
+    const Update = useCallback((target: HTMLInputElement, limit: RequestLimitType) => {
         setLoading(true);
         UpdateRequestLimit(apiUri, limit, Number.parseInt(target.value))
             .then(() => setColor("success"))
@@ -18,18 +28,53 @@ export default function RequestLimits({backendSettings}: {backendSettings?: IBac
             .finally(() => setLoading(false));
     },[apiUri])
 
+    const Reset = useCallback((limit: RequestLimitType) => {
+        setLoading(true);
+        ResetRequestLimit(apiUri, limit)
+            .then(() => setColor("success"))
+            .catch(() => setColor("danger"))
+            .finally(() => setLoading(false));
+    }, [apiUri]);
+
+    const ResetAll = useCallback(() => {
+        setLoading(true);
+        ResetRequestLimits(apiUri)
+            .then(() => setColor("success"))
+            .catch(() => setColor("danger"))
+            .finally(() => setLoading(false));
+    }, [apiUri]);
+
     return (
         <Accordion>
-            <AccordionSummary>Request Limits</AccordionSummary>
+            <AccordionSummary>Request Limits<Button loading={backendSettings === undefined} onClick={ResetAll} size={"sm"} variant={"outlined"} endDecorator={<Restore />}>Reset all</Button></AccordionSummary>
             <AccordionDetails>
                 <Stack spacing={1} direction="column">
-                    <Input slotProps={{input: {min: 0, max: 360}}} color={color} startDecorator={<Typography>Default</Typography>} disabled={loading} type={"number"} defaultValue={backendSettings?.requestLimits.Default} placeholder={"Default"} required onKeyDown={(e) => { if(e.key == "Enter") Update(e.target as HTMLInputElement, RequestLimitType.Default);}} />
-                    <Input slotProps={{input: {min: 0, max: 360}}} color={color} startDecorator={<Typography>Image</Typography>} disabled={loading} type={"number"} defaultValue={backendSettings?.requestLimits.MangaImage} placeholder={"MangaImage"} required onKeyDown={(e) => { if(e.key == "Enter") Update(e.target as HTMLInputElement, RequestLimitType.MangaImage);}} />
-                    <Input slotProps={{input: {min: 0, max: 360}}} color={color} startDecorator={<Typography>Info</Typography>} disabled={loading} type={"number"} defaultValue={backendSettings?.requestLimits.MangaInfo} placeholder={"MangaInfo"} required onKeyDown={(e) => { if(e.key == "Enter") Update(e.target as HTMLInputElement, RequestLimitType.MangaInfo);}} />
-                    <Input slotProps={{input: {min: 0, max: 360}}} color={color} startDecorator={<Typography>Image</Typography>} endDecorator={<img src={"https://mangadex.org/favicon.ico"} />} disabled={loading} type={"number"} defaultValue={backendSettings?.requestLimits.MangaDexImage} placeholder={"MangaDexImage"} required onKeyDown={(e) => { if(e.key == "Enter") Update(e.target as HTMLInputElement, RequestLimitType.MangaDexImage);}} />
-                    <Input slotProps={{input: {min: 0, max: 360}}} color={color} startDecorator={<Typography>Feed</Typography>} endDecorator={<img src={"https://mangadex.org/favicon.ico"} />} disabled={loading} type={"number"} defaultValue={backendSettings?.requestLimits.MangaDexFeed} placeholder={"MangaDexFeed"} required onKeyDown={(e) => { if(e.key == "Enter") Update(e.target as HTMLInputElement, RequestLimitType.MangaDexFeed);}} />
+                    <Item type={RequestLimitType.Default} color={color} backendSettings={backendSettings} loading={loading} Reset={Reset} Update={Update} />
+                    <Item type={RequestLimitType.MangaInfo} color={color} backendSettings={backendSettings} loading={loading} Reset={Reset} Update={Update} />
+                    <Item type={RequestLimitType.MangaImage} color={color} backendSettings={backendSettings} loading={loading} Reset={Reset} Update={Update} />
+                    <Item type={RequestLimitType.MangaDexFeed} color={color} backendSettings={backendSettings} loading={loading} Reset={Reset} Update={Update} />
+                    <Item type={RequestLimitType.MangaDexImage} color={color} backendSettings={backendSettings} loading={loading} Reset={Reset} Update={Update} />
                 </Stack>
             </AccordionDetails>
         </Accordion>
     );
+}
+
+function Item({type, color, loading, backendSettings, Reset, Update}:
+              {type: RequestLimitType, color: ColorPaletteProp, loading: boolean, backendSettings: IBackendSettings | undefined, Reset: (x: RequestLimitType) => void, Update: (a: HTMLInputElement, x: RequestLimitType) => void}) {
+    return (
+        <Input slotProps={{input: {min: 0, max: 360}}}
+               color={color}
+               startDecorator={<Typography sx={{width:"140px"}}>{type}</Typography>}
+               endDecorator={<Button onClick={() => Reset(type)}>Reset</Button>}
+               disabled={loading} type={"number"}
+               defaultValue={backendSettings?.requestLimits[type]}
+               placeholder={"Default"}
+               required
+               onKeyDown={(e) => {
+                   if(e.key == "Enter")
+                       Update(e.target as HTMLInputElement, type);
+               }}
+        />
+    );
 }
\ No newline at end of file