diff --git a/bin/monrun/resources/builds.toml b/bin/monrun/resources/builds.toml index 6e1801482..588a32204 100644 --- a/bin/monrun/resources/builds.toml +++ b/bin/monrun/resources/builds.toml @@ -20,28 +20,6 @@ config.build_path = "." config.dockerfile_path = "frontend/Dockerfile" config.docker_account = "mbecker2020" -[[build]] -name = "monitor-core-v1-dev" -description = "the dev build for monitor" -tags = ["monitor", "dev", "api"] -config.builder = "mogh-builder" -config.repo = "mbecker20/monitor" -config.branch = "next" -config.build_path = "." -config.dockerfile_path = "bin/core/Dockerfile" -config.docker_account = "mbecker2020" - -[[build]] -name = "monitor-frontend-v1-dev" -description = "the prod frontend build for monitor" -tags = ["monitor", "prod", "frontend"] -config.builder = "mogh-builder" -config.repo = "mbecker20/monitor" -config.branch = "next" -config.build_path = "." -config.dockerfile_path = "frontend/Dockerfile" -config.docker_account = "mbecker2020" - [[builder]] name = "mogh-builder" description = "the builder for the mogh images" diff --git a/bin/monrun/resources/deployments.toml b/bin/monrun/resources/deployments.toml index 08ea2af93..9f0606cc0 100644 --- a/bin/monrun/resources/deployments.toml +++ b/bin/monrun/resources/deployments.toml @@ -1,23 +1,23 @@ [[deployment]] -name = "monitor-core-v1" +name = "monitor-core-v1-dev" description = "v1 core api" tags = ["monitor", "v1", "api"] config.server = "mogh-server" +config.redeploy_on_build = true +config.image.type = "Build" +config.image.params.build = "monitor-core-v1" +[[deployment.config.volumes]] +local = "/home/ubuntu/.monitor-next/core.config.toml" +container = "/config/config.toml" [[deployment.config.environment]] -variable = "TEST_1" -value = "VALUE" -[[deployment.config.environment]] -variable = "TEST_2" -value = "VALUE" +variable = "PORT" +value = "9001" [[deployment]] -name = "monitor-frontend-v1" +name = "monitor-frontend-v1-dev" description = "v1 frontend" tags = ["monitor", "v1", "frontend"] config.server = "mogh-server" -[[deployment.config.environment]] -variable = "TEST_1" -value = "VALUE" -[[deployment.config.environment]] -variable = "TEST_2" -value = "VALUE" \ No newline at end of file +config.redeploy_on_build = true +config.image.type = "Build" +config.image.params.build = "monitor-frontend-v1" \ No newline at end of file diff --git a/bin/monrun/resources/procedures.toml b/bin/monrun/resources/procedures.toml index 73e653902..871e5187c 100644 --- a/bin/monrun/resources/procedures.toml +++ b/bin/monrun/resources/procedures.toml @@ -1,6 +1,7 @@ [[procedure]] name = "build-deploy-monitor-v1" description = "builds v1 core / frontend, then redeploys them" +tags = ["monitor", "v1"] config.type = "Sequence" [[procedure.config.data]] enabled = true @@ -14,19 +15,21 @@ execution.params.procedure = "deploy-monitor-v1" [[procedure]] name = "deploy-monitor-v1" description = "deploys v1 core / frontend" +tags = ["monitor", "v1"] config.type = "Parallel" [[procedure.config.data]] enabled = true execution.type = "Deploy" -execution.params.deployment = "monitor-core-v1" +execution.params.deployment = "monitor-core-v1-dev" [[procedure.config.data]] enabled = true execution.type = "Deploy" -execution.params.deployment = "monitor-frontend-v1" +execution.params.deployment = "monitor-frontend-v1-dev" [[procedure]] name = "build-monitor-v1" description = "builds v1 core / frontend" +tags = ["monitor", "v1"] config.type = "Parallel" [[procedure.config.data]] enabled = true diff --git a/frontend/src/components/config/util.tsx b/frontend/src/components/config/util.tsx index cb3071de3..64835d9e2 100644 --- a/frontend/src/components/config/util.tsx +++ b/frontend/src/components/config/util.tsx @@ -7,12 +7,17 @@ import { SelectValue, SelectContent, SelectItem, - SelectGroup, } from "@ui/select"; import { Button } from "@ui/button"; import { Input } from "@ui/input"; import { Switch } from "@ui/switch"; -import { MinusCircle, PlusCircle, Save } from "lucide-react"; +import { + ChevronsUpDown, + MinusCircle, + PlusCircle, + Save, + SearchX, +} from "lucide-react"; import { ReactNode, useState } from "react"; import { cn } from "@lib/utils"; import { @@ -23,6 +28,14 @@ import { DialogTitle, DialogTrigger, } from "@ui/dialog"; +import { Popover, PopoverContent, PopoverTrigger } from "@ui/popover"; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, +} from "@ui/command"; export const ConfigItem = ({ label, @@ -154,26 +167,48 @@ export const ResourceSelector = ({ selected: string | undefined; onSelect: (id: string) => void; }) => { + const [open, setOpen] = useState(false); + const [input, setInput] = useState(""); + const resources = useRead(`List${type}s`, {}).data; const name = resources?.find((r) => r.id === selected)?.name; if (!resources) return null; return ( - + + + + + + + + + {`No ${type}s Found`} + + + + {resources.map((resource) => ( + onSelect(resource.id)} + className="flex items-center justify-between" + > +
{resource.name}
+
+ ))} +
+
+
+
); }; diff --git a/frontend/src/components/resources/procedure/config.tsx b/frontend/src/components/resources/procedure/config.tsx index 70d61dde1..322a957e9 100644 --- a/frontend/src/components/resources/procedure/config.tsx +++ b/frontend/src/components/resources/procedure/config.tsx @@ -2,8 +2,16 @@ import { ConfigLayout } from "@components/config"; import { ResourceSelector } from "@components/config/util"; import { useRead, useWrite } from "@lib/hooks"; import { Types } from "@monitor/client"; -import { UsableResource } from "@types"; +import { Button } from "@ui/button"; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, +} from "@ui/command"; import { DataTable } from "@ui/data-table"; +import { Popover, PopoverContent, PopoverTrigger } from "@ui/popover"; import { Select, SelectContent, @@ -12,6 +20,7 @@ import { SelectValue, } from "@ui/select"; import { Switch } from "@ui/switch"; +import { ChevronsUpDown, SearchX } from "lucide-react"; import { useState } from "react"; export const ProcedureConfig = ({ id }: { id: string }) => { @@ -66,7 +75,30 @@ const ProcedureConfigInner = ({ columns={[ { header: "Execution", - accessorKey: "execution.type", + cell: ({ row: { original, index } }) => ( + + setConfig({ + ...config, + data: config.data.map((item, i) => + i === index + ? ({ + ...item, + execution: { + type, + params: + TARGET_COMPONENTS[ + type as Types.Execution["type"] + ].params, + }, + } as Types.EnabledExecution) + : item + ), + }) + } + /> + ), }, { header: "Target", @@ -78,7 +110,7 @@ const ProcedureConfigInner = ({ index, }, }) => { - const Component = EXEC_TYPES[type].Component; + const Component = TARGET_COMPONENTS[type].Component; return ( - i === index ? { ...item, params } : item + i === index + ? { + ...item, + execution: { type, params: params as any }, + } + : item ), }) } @@ -127,6 +164,52 @@ const ProcedureConfigInner = ({ ); }; +export const ExecutionTypeSelector = ({ + type, + onSelect, +}: { + type: Types.Execution["type"]; + onSelect: (type: Types.Execution["type"]) => void; +}) => { + const [open, setOpen] = useState(false); + const [search, setSearch] = useState(""); + return ( + + + + + + + + + Empty. + + + + {Object.keys(TARGET_COMPONENTS).map((type) => ( + onSelect(type as Types.Execution["type"])} + className="flex items-center justify-between" + > +
{type}
+
+ ))} +
+
+
+
+ ); +}; + type ExecutionType = Types.Execution["type"]; type ExecutionConfigComponent< @@ -149,22 +232,7 @@ type ExecutionConfigs = { }; }; -const TypeSelector = ({ - type, - selected, - onSelect, -}: { - type: UsableResource; - selected: string; - onSelect: (value: string) => void; -}) => ( -
- {type} - -
-); - -const EXEC_TYPES: ExecutionConfigs = { +const TARGET_COMPONENTS: ExecutionConfigs = { None: { params: {}, Component: () => <>, @@ -172,7 +240,7 @@ const EXEC_TYPES: ExecutionConfigs = { CloneRepo: { params: { repo: "" }, Component: ({ params, setParams }) => ( - setParams({ repo })} @@ -182,7 +250,7 @@ const EXEC_TYPES: ExecutionConfigs = { Deploy: { params: { deployment: "" }, Component: ({ params, setParams }) => ( - setParams({ deployment })} @@ -192,7 +260,7 @@ const EXEC_TYPES: ExecutionConfigs = { PruneDockerContainers: { params: { server: "" }, Component: ({ params, setParams }) => ( - setParams({ server })} @@ -202,7 +270,7 @@ const EXEC_TYPES: ExecutionConfigs = { PruneDockerImages: { params: { server: "" }, Component: ({ params, setParams }) => ( - setParams({ server })} @@ -212,7 +280,7 @@ const EXEC_TYPES: ExecutionConfigs = { PruneDockerNetworks: { params: { server: "" }, Component: ({ params, setParams }) => ( - setParams({ server })} @@ -222,7 +290,7 @@ const EXEC_TYPES: ExecutionConfigs = { PullRepo: { params: { repo: "" }, Component: ({ params, setParams }) => ( - setParams({ repo })} @@ -232,7 +300,7 @@ const EXEC_TYPES: ExecutionConfigs = { RemoveContainer: { params: { deployment: "" }, Component: ({ params, setParams }) => ( - setParams({ deployment })} @@ -242,7 +310,7 @@ const EXEC_TYPES: ExecutionConfigs = { RunBuild: { params: { build: "" }, Component: ({ params, setParams }) => ( - setParams({ build })} @@ -252,7 +320,7 @@ const EXEC_TYPES: ExecutionConfigs = { RunProcedure: { params: { procedure: "" }, Component: ({ params, setParams }) => ( - setParams({ procedure })} @@ -262,7 +330,7 @@ const EXEC_TYPES: ExecutionConfigs = { StartContainer: { params: { deployment: "" }, Component: ({ params, setParams }) => ( - setParams({ deployment })} @@ -272,7 +340,7 @@ const EXEC_TYPES: ExecutionConfigs = { StopAllContainers: { params: { server: "" }, Component: ({ params, setParams }) => ( - setParams({ server: id })} @@ -282,7 +350,7 @@ const EXEC_TYPES: ExecutionConfigs = { StopContainer: { params: { deployment: "" }, Component: ({ params, setParams }) => ( - setParams({ deployment: id })} diff --git a/frontend/src/components/resources/procedure/index.tsx b/frontend/src/components/resources/procedure/index.tsx index 1ba1c2470..7e1cc9762 100644 --- a/frontend/src/components/resources/procedure/index.tsx +++ b/frontend/src/components/resources/procedure/index.tsx @@ -1,4 +1,3 @@ -import { ConfigLayout } from "@components/config"; import { NewResource } from "@components/layouts"; import { TagsWithBadge } from "@components/tags"; import { ConfirmButton } from "@components/util"; diff --git a/frontend/src/components/tags/index.tsx b/frontend/src/components/tags/index.tsx index aa57d0821..bc62c0066 100644 --- a/frontend/src/components/tags/index.tsx +++ b/frontend/src/components/tags/index.tsx @@ -9,17 +9,11 @@ import { CommandInput, CommandItem, } from "@ui/command"; -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuGroup, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@ui/dropdown-menu"; +import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuTrigger } from "@ui/dropdown-menu"; import { Popover, PopoverContent, PopoverTrigger } from "@ui/popover"; import { useToast } from "@ui/use-toast"; import { atom, useAtom } from "jotai"; -import { PlusCircle } from "lucide-react"; +import { PlusCircle, Tag } from "lucide-react"; import { useEffect, useState } from "react"; type TargetExcludingSystem = Exclude; @@ -43,8 +37,8 @@ export const TagsFilter = () => { /> - diff --git a/frontend/src/lib/socket.tsx b/frontend/src/lib/socket.tsx index 3b326b33e..abf92bc4d 100644 --- a/frontend/src/lib/socket.tsx +++ b/frontend/src/lib/socket.tsx @@ -59,6 +59,24 @@ const on_message = ( ); } + if (update.target.type === "Repo") { + invalidate( + ["ListRepos"], + ["GetRepo"], + ["GetRepoActionState"], + ["GetReposSummary"] + ); + } + + if (update.target.type === "Procedure") { + invalidate( + ["ListProcedures"], + ["GetProcedure"], + ["GetProcedureActionState"], + ["GetProceduresSummary"] + ); + } + if (update.target.type === "Builder") { invalidate( ["ListBuilders"],