diff --git a/frontend/src/components/config/util.tsx b/frontend/src/components/config/util.tsx index 1b73f6a14..37f19bc70 100644 --- a/frontend/src/components/config/util.tsx +++ b/frontend/src/components/config/util.tsx @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import { useRead } from "@lib/hooks"; +import { useRead, useWrite } from "@lib/hooks"; import { Types } from "@monitor/client"; import { Select, @@ -18,6 +18,7 @@ import { PlusCircle, Save, SearchX, + Trash, } from "lucide-react"; import { ReactNode, useState } from "react"; import { cn } from "@lib/utils"; @@ -39,7 +40,9 @@ import { CommandList, } from "@ui/command"; import { snake_case_to_upper_space_case } from "@lib/formatting"; -import { ConfirmButton } from "@components/util"; +import { ActionWithDialog, ConfirmButton } from "@components/util"; +import { UsableResource } from "@types"; +import { useNavigate } from "react-router-dom"; export const ConfigItem = ({ label, @@ -400,3 +403,34 @@ export const SystemCommand = ({ ); }; + +export const DeleteResource = ({ + type, + id, +}: { + type: UsableResource; + id: string; +}) => { + const nav = useNavigate(); + const resource = useRead(`Get${type}`, { [type.toLowerCase()]: id } as any).data; + const { mutateAsync, isPending } = useWrite(`Delete${type}`); + + if (!resource) return null; + + return ( +
+
Delete {type}
+ } + onClick={async () => { + await mutateAsync({ id }); + nav(`/${type.toLowerCase()}s`); + }} + disabled={isPending} + loading={isPending} + /> +
+ ); +}; diff --git a/frontend/src/components/resources/alerter/config.tsx b/frontend/src/components/resources/alerter/config.tsx index dc0c1801f..f2e35fb3f 100644 --- a/frontend/src/components/resources/alerter/config.tsx +++ b/frontend/src/components/resources/alerter/config.tsx @@ -1,10 +1,7 @@ import { Config } from "@components/config"; -import { ActionWithDialog } from "@components/util"; import { useRead, useWrite } from "@lib/hooks"; import { Types } from "@monitor/client"; -import { Trash } from "lucide-react"; import { useState } from "react"; -import { useNavigate } from "react-router-dom"; export const AlerterConfig = ({ id }: { id: string }) => { const config = useRead("GetAlerter", { alerter: id }).data?.config; @@ -57,27 +54,3 @@ const CustomAlerterConfig = ({ id }: { id: string }) => { /> ); }; - -export const DeleteAlerter = ({ id }: { id: string }) => { - const nav = useNavigate(); - const { data: alerter } = useRead("GetAlerter", { alerter: id }); - const { mutateAsync, isPending } = useWrite("DeleteAlerter"); - - if (!alerter) return null; - return ( -
-
Delete Alerter
- } - onClick={async () => { - await mutateAsync({ id }); - nav("/"); - }} - disabled={isPending} - loading={isPending} - /> -
- ); -}; diff --git a/frontend/src/components/resources/alerter/index.tsx b/frontend/src/components/resources/alerter/index.tsx index 1749c1a48..3f63f3e9e 100644 --- a/frontend/src/components/resources/alerter/index.tsx +++ b/frontend/src/components/resources/alerter/index.tsx @@ -16,9 +16,10 @@ import { useState } from "react"; import { DataTable } from "@ui/data-table"; import { Link } from "react-router-dom"; import { Card, CardDescription, CardHeader, CardTitle } from "@ui/card"; -import { AlerterConfig, DeleteAlerter } from "./config"; +import { AlerterConfig } from "./config"; import { CopyResource, ResourceLink } from "@components/util"; import { TagsWithBadge, useTagsFilter } from "@components/tags"; +import { DeleteResource } from "@components/config/util"; const useAlerter = (id?: string) => useRead("ListAlerters", {}).data?.find((d) => d.id === id); @@ -38,7 +39,7 @@ export const AlerterComponents: RequiredResourceComponents = { icon={} actions={} > - + ), }, diff --git a/frontend/src/components/resources/build/config.tsx b/frontend/src/components/resources/build/config.tsx index 33625cf5e..52c03356d 100644 --- a/frontend/src/components/resources/build/config.tsx +++ b/frontend/src/components/resources/build/config.tsx @@ -5,7 +5,6 @@ import { ResourceSelector, SystemCommand, } from "@components/config/util"; -import { ActionWithDialog } from "@components/util"; import { useRead, useWrite } from "@lib/hooks"; import { env_to_text, text_to_env } from "@lib/utils"; import { Types } from "@monitor/client"; @@ -19,9 +18,8 @@ import { SelectValue, } from "@ui/select"; import { Textarea } from "@ui/textarea"; -import { MinusCircle, PlusCircle, Trash } from "lucide-react"; +import { MinusCircle, PlusCircle } from "lucide-react"; import { useEffect, useState } from "react"; -import { useNavigate } from "react-router-dom"; export const BuildConfig = ({ id }: { id: string }) => { const config = useRead("GetBuild", { build: id }).data?.config; @@ -243,28 +241,3 @@ const DockerOrganizations = ({ ); }; - -export const DeleteBuild = ({ id }: { id: string }) => { - const nav = useNavigate(); - const build = useRead("GetBuild", { build: id }).data; - const { mutateAsync, isPending } = useWrite("DeleteBuild"); - - if (!build) return null; - - return ( -
-
Delete Build
- } - onClick={async () => { - await mutateAsync({ id }); - nav("/"); - }} - disabled={isPending} - loading={isPending} - /> -
- ); -}; diff --git a/frontend/src/components/resources/build/index.tsx b/frontend/src/components/resources/build/index.tsx index b5456e887..a3a46af2c 100644 --- a/frontend/src/components/resources/build/index.tsx +++ b/frontend/src/components/resources/build/index.tsx @@ -6,11 +6,12 @@ import { Input } from "@ui/input"; import { AlertTriangle, Ban, Hammer, History, Loader2 } from "lucide-react"; import { useState } from "react"; import { useToast } from "@ui/use-toast"; -import { BuildConfig, DeleteBuild } from "./config"; +import { BuildConfig } from "./config"; import { fill_color_class_by_intention } from "@lib/color"; import { BuildChart } from "./dashboard"; import { BuildTable } from "./table"; import { fmt_version } from "@lib/formatting"; +import { DeleteResource } from "@components/config/util"; const useBuild = (id?: string) => useRead("ListBuilds", {}).data?.find((d) => d.id === id); @@ -49,7 +50,7 @@ export const BuildComponents: RequiredResourceComponents = { icon={} actions={} > - + ), }, diff --git a/frontend/src/components/resources/builder/config.tsx b/frontend/src/components/resources/builder/config.tsx index 5655d2fc7..898719a22 100644 --- a/frontend/src/components/resources/builder/config.tsx +++ b/frontend/src/components/resources/builder/config.tsx @@ -1,11 +1,8 @@ import { Config } from "@components/config"; import { InputList, ResourceSelector } from "@components/config/util"; -import { ActionWithDialog } from "@components/util"; import { useRead, useWrite } from "@lib/hooks"; import { Types } from "@monitor/client"; -import { Trash } from "lucide-react"; import { useState } from "react"; -import { useNavigate } from "react-router-dom"; export const BuilderConfig = ({ id }: { id: string }) => { const config = useRead("GetBuilder", { builder: id }).data?.config; @@ -92,28 +89,3 @@ const ServerBuilderConfig = ({ id }: { id: string }) => { /> ); }; - -export const DeleteBuilder = ({ id }: { id: string }) => { - const nav = useNavigate(); - const builder = useRead("GetBuilder", { builder: id }).data; - const { mutateAsync, isPending } = useWrite("DeleteBuilder"); - - if (!builder) return null; - - return ( -
-
Delete Builder
- } - onClick={async () => { - await mutateAsync({ id }); - nav("/"); - }} - disabled={isPending} - loading={isPending} - /> -
- ); -}; diff --git a/frontend/src/components/resources/builder/index.tsx b/frontend/src/components/resources/builder/index.tsx index 68f57e399..ba70fb4f4 100644 --- a/frontend/src/components/resources/builder/index.tsx +++ b/frontend/src/components/resources/builder/index.tsx @@ -17,8 +17,9 @@ import { import { Cloud, Bot, Factory, AlertTriangle } from "lucide-react"; import { useState } from "react"; import { Link } from "react-router-dom"; -import { BuilderConfig, DeleteBuilder } from "./config"; +import { BuilderConfig } from "./config"; import { CopyResource, ResourceLink } from "@components/util"; +import { DeleteResource } from "@components/config/util"; const useBuilder = (id?: string) => useRead("ListBuilders", {}).data?.find((d) => d.id === id); @@ -52,7 +53,7 @@ export const BuilderComponents: RequiredResourceComponents = { icon={} actions={} > - + ), }, diff --git a/frontend/src/components/resources/deployment/actions.tsx b/frontend/src/components/resources/deployment/actions.tsx index cdb8b1043..35cf3ca42 100644 --- a/frontend/src/components/resources/deployment/actions.tsx +++ b/frontend/src/components/resources/deployment/actions.tsx @@ -255,7 +255,7 @@ export const DeleteDeployment = ({ id }: { id: string }) => { icon={} onClick={async () => { await mutateAsync({ id }); - nav("/"); + nav("/deployments"); }} disabled={pending} loading={pending} diff --git a/frontend/src/components/resources/procedure/index.tsx b/frontend/src/components/resources/procedure/index.tsx index 2177df7ff..27934fc6b 100644 --- a/frontend/src/components/resources/procedure/index.tsx +++ b/frontend/src/components/resources/procedure/index.tsx @@ -1,10 +1,5 @@ import { NewResource, Section } from "@components/layouts"; -import { - ActionWithDialog, - ConfirmButton, - CopyResource, - ResourceLink, -} from "@components/util"; +import { ConfirmButton, CopyResource, ResourceLink } from "@components/util"; import { useExecute, useRead, useWrite } from "@lib/hooks"; import { Types } from "@monitor/client"; import { RequiredResourceComponents } from "@types"; @@ -17,11 +12,12 @@ import { SelectTrigger, SelectValue, } from "@ui/select"; -import { AlertTriangle, Loader2, Route, Trash } from "lucide-react"; +import { AlertTriangle, Loader2, Route } from "lucide-react"; import { useState } from "react"; -import { Link, useNavigate } from "react-router-dom"; +import { Link } from "react-router-dom"; import { ProcedureConfig } from "./config"; import { ProcedureTable } from "./table"; +import { DeleteResource } from "@components/config/util"; const useProcedure = (id?: string) => useRead("ListProcedures", {}).data?.find((d) => d.id === id); @@ -41,7 +37,7 @@ export const ProcedureComponents: RequiredResourceComponents = { icon={} actions={} > - + ), }, @@ -125,28 +121,3 @@ export const ProcedureComponents: RequiredResourceComponents = { ); }, }; - -const DeleteProcedure = ({ id }: { id: string }) => { - const nav = useNavigate(); - const procedure = useRead("GetProcedure", { procedure: id }).data; - const { mutateAsync, isPending } = useWrite("DeleteProcedure"); - - if (!procedure) return null; - - return ( -
-
Delete Procedure
- } - onClick={async () => { - await mutateAsync({ id }); - nav("/"); - }} - disabled={isPending} - loading={isPending} - /> -
- ); -}; diff --git a/frontend/src/components/resources/repo/config.tsx b/frontend/src/components/resources/repo/config.tsx index 97a668ca0..ac3ac446a 100644 --- a/frontend/src/components/resources/repo/config.tsx +++ b/frontend/src/components/resources/repo/config.tsx @@ -4,7 +4,6 @@ import { ResourceSelector, SystemCommand, } from "@components/config/util"; -import { ActionWithDialog } from "@components/util"; import { useRead, useWrite } from "@lib/hooks"; import { Types } from "@monitor/client"; import { @@ -14,9 +13,7 @@ import { SelectTrigger, SelectValue, } from "@ui/select"; -import { Trash } from "lucide-react"; import { useState } from "react"; -import { useNavigate } from "react-router-dom"; export const RepoConfig = ({ id }: { id: string }) => { const config = useRead("GetRepo", { repo: id }).data?.config; @@ -104,28 +101,3 @@ const GithubAccount = ({ ); }; - -export const DeleteRepo = ({ id }: { id: string }) => { - const nav = useNavigate(); - const repo = useRead("GetRepo", { repo: id }).data; - const { mutateAsync, isPending } = useWrite("DeleteRepo"); - - if (!repo) return null; - - return ( -
-
Delete Repo
- } - onClick={async () => { - await mutateAsync({ id }); - nav("/"); - }} - disabled={isPending} - loading={isPending} - /> -
- ); -}; diff --git a/frontend/src/components/resources/repo/index.tsx b/frontend/src/components/resources/repo/index.tsx index 0ae501d5f..8e111d6da 100644 --- a/frontend/src/components/resources/repo/index.tsx +++ b/frontend/src/components/resources/repo/index.tsx @@ -5,12 +5,13 @@ import { Card, CardDescription, CardHeader, CardTitle } from "@ui/card"; import { DataTable } from "@ui/data-table"; import { AlertTriangle, GitBranch } from "lucide-react"; import { Link } from "react-router-dom"; -import { DeleteRepo, RepoConfig } from "./config"; +import { RepoConfig } from "./config"; import { CopyResource, ResourceLink } from "@components/util"; import { useState } from "react"; import { NewResource, Section } from "@components/layouts"; import { Input } from "@ui/input"; import { CloneRepo, PullRepo } from "./actions"; +import { DeleteResource } from "@components/config/util"; const useRepo = (id?: string) => useRead("ListRepos", {}).data?.find((d) => d.id === id); @@ -31,7 +32,7 @@ export const RepoComponents: RequiredResourceComponents = { icon={} actions={} > - + ), }, diff --git a/frontend/src/components/resources/server/actions.tsx b/frontend/src/components/resources/server/actions.tsx index d93f48376..c11392ab9 100644 --- a/frontend/src/components/resources/server/actions.tsx +++ b/frontend/src/components/resources/server/actions.tsx @@ -7,9 +7,8 @@ import { useExecute, useInvalidate, useRead, useWrite } from "@lib/hooks"; import { IdComponent } from "@types"; import { Input } from "@ui/input"; import { useToast } from "@ui/use-toast"; -import { Pen, Scissors, Trash, XOctagon } from "lucide-react"; +import { Pen, Scissors, XOctagon } from "lucide-react"; import { useState } from "react"; -import { useNavigate } from "react-router-dom"; import { useServer } from "."; export const SERVER_ACTIONS: IdComponent[] = [ @@ -49,30 +48,6 @@ export const SERVER_ACTIONS: IdComponent[] = [ }, ]; -export const DeleteServer = ({ id }: { id: string }) => { - const nav = useNavigate(); - const server = useRead("GetServer", { server: id }).data; - const { mutateAsync, isPending } = useWrite("DeleteServer"); - - if (!server) return null; - return ( -
-
Delete Server
- } - onClick={async () => { - await mutateAsync({ id }); - nav("/"); - }} - disabled={isPending} - loading={isPending} - /> -
- ); -}; - export const RenameServer = ({ id }: { id: string }) => { const invalidate = useInvalidate(); diff --git a/frontend/src/components/resources/server/index.tsx b/frontend/src/components/resources/server/index.tsx index 27cd34dbd..dd2f7f5ef 100644 --- a/frontend/src/components/resources/server/index.tsx +++ b/frontend/src/components/resources/server/index.tsx @@ -6,7 +6,7 @@ import { ServerIcon, AlertTriangle, Rocket, LineChart } from "lucide-react"; import { useState } from "react"; import { NewResource, Section } from "@components/layouts"; import { Input } from "@ui/input"; -import { DeleteServer, RenameServer, SERVER_ACTIONS } from "./actions"; +import { RenameServer, SERVER_ACTIONS } from "./actions"; import { fill_color_class_by_intention, server_status_intention, @@ -19,6 +19,7 @@ import { ServersChart } from "./dashboard"; import { ResourceLink } from "@components/util"; import { Link } from "react-router-dom"; import { Button } from "@ui/button"; +import { DeleteResource } from "@components/config/util"; export const useServer = (id?: string) => useRead("ListServers", {}).data?.find((d) => d.id === id); @@ -79,7 +80,7 @@ export const ServerComponents: RequiredResourceComponents = { Danger: ({ id }) => (
}> - +
), },