diff --git a/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/DeploymentJobAgentGithubConfig.tsx b/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/DeploymentJobAgentGithubConfig.tsx new file mode 100644 index 000000000..4c3f4ba72 --- /dev/null +++ b/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/DeploymentJobAgentGithubConfig.tsx @@ -0,0 +1,203 @@ +import type React from "react"; +import { useState } from "react"; +import Link from "next/link"; +import { + IconBrandGithub, + IconLoader2, + IconSelector, +} from "@tabler/icons-react"; + +import { Avatar, AvatarFallback, AvatarImage } from "@ctrlplane/ui/avatar"; +import { Button } from "@ctrlplane/ui/button"; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList, +} from "@ctrlplane/ui/command"; +import { Input } from "@ctrlplane/ui/input"; +import { Label } from "@ctrlplane/ui/label"; +import { Popover, PopoverContent, PopoverTrigger } from "@ctrlplane/ui/popover"; + +import { api } from "~/trpc/react"; + +export const DeploymentJobAgentGithubConfig: React.FC<{ + jobAgentId: string; + value: Record; + onChange: (v: Record) => void; +}> = ({ jobAgentId, value, onChange }) => { + const [repoOpen, setRepoOpen] = useState(false); + const [workflowOpen, setWorkflowOpen] = useState(false); + + const { data: githubAgent, isLoading: isGithubAgentLoading } = + api.job.agent.github.byId.useQuery(jobAgentId); + const { data: repos, isLoading: isReposLoading } = + api.github.entities.repos.list.useQuery( + { + installationId: githubAgent?.ghEntity.installationId ?? 0, + owner: githubAgent?.ghEntity.slug ?? "", + workspaceId: githubAgent?.workspaceId ?? "", + }, + { enabled: githubAgent != null }, + ); + + const selectedRepo = repos?.find((r) => r.name === value.repo); + const workflows = selectedRepo?.workflows ?? []; + const selectedWorkflow = workflows.find((w) => w.id === value.workflowId); + + if (isGithubAgentLoading) + return ( +
+ +
+ ); + + return ( +
+
+ + + + + + +
+ + {githubAgent?.ghEntity.slug} + + + View on GitHub + +
+
+ +
+
+ + + + + + + + + + + {!isReposLoading && + repos != null && + repos.length > 0 && + repos.map((repo) => ( + { + onChange({ ...value, repo: currentValue }); + setRepoOpen(false); + }} + > + {repo.name} + + ))} + + {!isReposLoading && + (repos == null || repos.length === 0) && ( + + No repos found + + )} + + {isReposLoading && ( + + Loading + repos... + + )} + + + + + +
+ +
+ + + + + + + + + + + {workflows.length > 0 && + workflows.map((wf) => ( + { + onChange({ + ...value, + workflowId: Number.parseInt(currentValue), + }); + setWorkflowOpen(false); + }} + > + {wf.name} + + ))} + + {workflows.length === 0 && ( + + No workflows found + + )} + + + + + +
+ +
+ + { + const ref = e.target.value === "" ? null : e.target.value; + onChange({ ...value, ref }); + }} + /> +
+
+
+ ); +}; diff --git a/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/JobAgentSection.tsx b/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/JobAgentSection.tsx index b66c32ce7..8e79db757 100644 --- a/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/JobAgentSection.tsx +++ b/apps/webservice/src/app/[workspaceSlug]/(appv2)/systems/[systemSlug]/(raw)/deployments/[deploymentSlug]/(sidebar)/workflow/JobAgentSection.tsx @@ -8,12 +8,14 @@ import { z } from "zod"; import { Alert, AlertDescription, AlertTitle } from "@ctrlplane/ui/alert"; import { Button } from "@ctrlplane/ui/button"; -import { Card } from "@ctrlplane/ui/card"; import { Form, FormField, useForm } from "@ctrlplane/ui/form"; +import { JobAgentType } from "@ctrlplane/validators/jobs"; -import { JobAgentConfig } from "~/components/form/job-agent/JobAgentConfig"; +import { JobAgentKubernetesConfig } from "~/components/form/job-agent/JobAgentKubernetesConfig"; +import { JobAgentScriptConfig } from "~/components/form/job-agent/JobAgentScriptConfig"; import { JobAgentSelector } from "~/components/form/job-agent/JobAgentSelector"; import { api } from "~/trpc/react"; +import { DeploymentJobAgentGithubConfig } from "./DeploymentJobAgentGithubConfig"; const JobAgentForm: React.FC<{ jobAgent?: schema.JobAgent; @@ -41,7 +43,7 @@ const JobAgentForm: React.FC<{ return (
- + )} /> - - - selectedJobAgent == null ? ( + + ( + <> + {selectedJobAgent == null && ( Select a job agent - ) : ( - + )} + {selectedJobAgent?.type === JobAgentType.GithubApp && ( + - ) - } - /> - + )} + {selectedJobAgent?.type.startsWith("exec-") && ( + + )} + + )} + />