feat: add log rotation manager

apps/dokploy/components/dashboard/requests/show-requests.tsx

@@ -64,6 +64,8 @@ import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { columns } from "./columns";
 import { Input } from "@/components/ui/input";
+import { toast } from "sonner";
+import { useEffect } from "react";
 
 export type LogEntry = NonNullable<
 	RouterOutputs["settings"]["readMonitoringConfig"]["data"]
@@ -79,7 +81,15 @@ const chartConfig = {
 	},
 } satisfies ChartConfig;
 export const ShowRequests = () => {
-	const { data } = api.settings.readMonitoringConfig.useQuery();
+	const { data } = api.settings.readMonitoringConfig.useQuery(undefined, {
+		refetchInterval: 1000,
+	});
+	const { data: isLogRotateActive, refetch: refetchLogRotate } =
+		api.settings.getLogRotateStatus.useQuery();
+
+	const { mutateAsync } = api.settings.activateLogRotate.useMutation();
+	const { mutateAsync: deactivateLogRotate } =
+		api.settings.deactivateLogRotate.useMutation();
 
 	const [sorting, setSorting] = React.useState<SortingState>([]);
 	const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(
@@ -112,9 +122,44 @@ export const ShowRequests = () => {
 			<Card className="bg-transparent mt-10">
 				<CardHeader>
 					<CardTitle>Request Distribution</CardTitle>
-					<CardDescription>
-						Showing web and API requests over time
-					</CardDescription>
+					<div className="flex justify-between gap-2">
+						<CardDescription>
+							<span>Showing web and API requests over time</span>
+						</CardDescription>
+						{!isLogRotateActive && (
+							<Button
+								onClick={() => {
+									mutateAsync()
+										.then(() => {
+											toast.success("Log rotate activated");
+											refetchLogRotate();
+										})
+										.catch((err) => {
+											toast.error(err.message);
+										});
+								}}
+							>
+								Activate Log Rotate
+							</Button>
+						)}
+
+						{isLogRotateActive && (
+							<Button
+								onClick={() => {
+									deactivateLogRotate()
+										.then(() => {
+											toast.success("Log rotate deactivated");
+											refetchLogRotate();
+										})
+										.catch((err) => {
+											toast.error(err.message);
+										});
+								}}
+							>
+								Deactivate Log Rotate
+							</Button>
+						)}
+					</div>
 				</CardHeader>
 				<CardContent>
 					<ResponsiveContainer width="100%" height={200}>