From 7927702983dc94044467c4ca459e61a996da7d1d Mon Sep 17 00:00:00 2001
From: Aditya Choudhari <48932219+adityachoudhari26@users.noreply.github.com>
Date: Wed, 4 Sep 2024 22:55:31 -0700
Subject: [PATCH] fix: Integration edit google (#14)

---
 .../ProviderActionsDropdown.tsx               |  26 ++-
 .../{ => google}/GoogleDialog.tsx             |   4 +-
 .../google/UpdateGoogleProviderDialog.tsx     | 158 ++++++++++++++++++
 .../target-providers/integrations/page.tsx    |   2 +-
 .../(targets)/target-providers/page.tsx       |   2 +-
 .../(integration)/google/page.tsx             |  30 ++++
 .../integrations/(integration)/layout.tsx     |  24 +--
 .../workspace/integrations/page.tsx           |  54 +++---
 .../(settings)/workspace/overview/page.tsx    |  13 +-
 packages/api/src/router/target.ts             | 110 ++++++++----
 packages/db/src/schema/target-provider.ts     |   2 +-
 11 files changed, 337 insertions(+), 88 deletions(-)
 rename apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/{ => google}/GoogleDialog.tsx (96%)
 create mode 100644 apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/UpdateGoogleProviderDialog.tsx
 create mode 100644 apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/google/page.tsx

diff --git a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/ProviderActionsDropdown.tsx b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/ProviderActionsDropdown.tsx
index 64aa0e11..71abb394 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/ProviderActionsDropdown.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/ProviderActionsDropdown.tsx
@@ -2,6 +2,7 @@
 
 import { TbDots } from "react-icons/tb";
 
+import type { TargetProvider, TargetProviderGoogle } from "@ctrlplane/db/schema";
 import {
   AlertDialog,
   AlertDialogAction,
@@ -22,17 +23,22 @@ import {
 } from "@ctrlplane/ui/dropdown-menu";
 
 import { api } from "~/trpc/react";
+import { UpdateGoogleProviderDialog } from "./integrations/google/UpdateGoogleProviderDialog";
 
-export const ProviderActionsDropdown: React.FC<{ providerId: string }> = ({
-  providerId,
-}) => {
+type Provider = TargetProvider & {
+  googleConfig: TargetProviderGoogle | null;
+};
+
+export const ProviderActionsDropdown: React.FC<{
+  provider: Provider;
+}> = ({ provider }) => {
   const utils = api.useUtils();
   const deleteProvider = api.target.provider.delete.useMutation({
     onSuccess: () => utils.target.provider.byWorkspaceId.invalidate(),
   });
 
   const handleDelete = (deleteTargets: boolean) =>
-    deleteProvider.mutate({ providerId, deleteTargets });
+    deleteProvider.mutate({ providerId: provider.id, deleteTargets });
 
   return (
     <DropdownMenu>
@@ -43,7 +49,17 @@ export const ProviderActionsDropdown: React.FC<{ providerId: string }> = ({
         </Button>
       </DropdownMenuTrigger>
       <DropdownMenuContent align="end">
-        <DropdownMenuItem>Edit</DropdownMenuItem>
+        {provider.googleConfig != null && (
+          <UpdateGoogleProviderDialog
+            providerId={provider.id}
+            name={provider.name}
+            projectIds={provider.googleConfig.projectIds}
+          >
+            <DropdownMenuItem onSelect={(e) => e.preventDefault()}>
+              Edit
+            </DropdownMenuItem>
+          </UpdateGoogleProviderDialog>
+        )}
         <AlertDialog>
           <AlertDialogTrigger asChild>
             <DropdownMenuItem onSelect={(e) => e.preventDefault()}>
diff --git a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/GoogleDialog.tsx b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/GoogleDialog.tsx
similarity index 96%
rename from apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/GoogleDialog.tsx
rename to apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/GoogleDialog.tsx
index 689ec6dc..9ad7ba7b 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/GoogleDialog.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/GoogleDialog.tsx
@@ -28,7 +28,7 @@ import { Input } from "@ctrlplane/ui/input";
 
 import { api } from "~/trpc/react";
 
-const createGoogleSchema = z.object({
+export const createGoogleSchema = z.object({
   name: z.string(),
   projectIds: z.array(z.object({ value: z.string() })),
 });
@@ -52,7 +52,7 @@ export const GoogleDialog: React.FC<{ children: React.ReactNode }> = ({
 
   const router = useRouter();
   const utils = api.useUtils();
-  const create = api.target.provider.managed.google.useMutation();
+  const create = api.target.provider.managed.google.create.useMutation();
   const onSubmit = form.handleSubmit(async (data) => {
     if (workspace.data == null) return;
     await create.mutateAsync({
diff --git a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/UpdateGoogleProviderDialog.tsx b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/UpdateGoogleProviderDialog.tsx
new file mode 100644
index 00000000..1cdb1077
--- /dev/null
+++ b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/google/UpdateGoogleProviderDialog.tsx
@@ -0,0 +1,158 @@
+import { useState } from "react";
+import { useParams } from "next/navigation";
+import { TbX } from "react-icons/tb";
+
+import { cn } from "@ctrlplane/ui";
+import { Button } from "@ctrlplane/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@ctrlplane/ui/dialog";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+  useFieldArray,
+  useForm,
+} from "@ctrlplane/ui/form";
+import { Input } from "@ctrlplane/ui/input";
+
+import { api } from "~/trpc/react";
+import { createGoogleSchema } from "./GoogleDialog";
+
+export const UpdateGoogleProviderDialog: React.FC<{
+  providerId: string;
+  name: string;
+  projectIds: string[];
+  children: React.ReactNode;
+}> = ({ providerId, name, projectIds, children }) => {
+  const { workspaceSlug } = useParams<{ workspaceSlug: string }>();
+  const workspace = api.workspace.bySlug.useQuery(workspaceSlug);
+  const form = useForm({
+    schema: createGoogleSchema,
+    defaultValues: { name, projectIds: projectIds.map((p) => ({ value: p })) },
+    mode: "onChange",
+  });
+
+  const utils = api.useUtils();
+  const update = api.target.provider.managed.google.update.useMutation();
+  const onSubmit = form.handleSubmit(async (data) => {
+    if (workspace.data == null) return;
+    await update.mutateAsync({
+      ...data,
+      targetProviderId: providerId,
+      config: { projectIds: data.projectIds.map((p) => p.value) },
+    });
+    await utils.target.provider.byWorkspaceId.invalidate();
+    setOpen(false);
+  });
+
+  const { fields, append, remove } = useFieldArray({
+    control: form.control,
+    name: "projectIds",
+  });
+
+  const [open, setOpen] = useState(false);
+
+  return (
+    <Dialog
+      open={open}
+      onOpenChange={(o) => {
+        setOpen(o);
+        if (!o) form.reset();
+      }}
+    >
+      <DialogTrigger asChild>{children}</DialogTrigger>
+      <DialogContent>
+        <Form {...form}>
+          <form onSubmit={onSubmit} className="space-y-3">
+            <DialogHeader>
+              <DialogTitle>Configure Google Provider</DialogTitle>
+              <DialogDescription>
+                Google provider allows you to configure and import GKE clusters
+                from google.
+              </DialogDescription>
+            </DialogHeader>
+
+            <FormField
+              control={form.control}
+              name="name"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Provider Name</FormLabel>
+                  <FormControl>
+                    <Input {...field} />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <div>
+              {fields.map((field, index) => (
+                <FormField
+                  control={form.control}
+                  key={field.id}
+                  name={`projectIds.${index}.value`}
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel className={cn(index !== 0 && "sr-only")}>
+                        Google Projects
+                      </FormLabel>
+                      <FormControl>
+                        <div className="flex items-center gap-2">
+                          <Input placeholder="my-gcp-project-id" {...field} />
+
+                          {fields.length > 1 && (
+                            <Button
+                              type="button"
+                              variant="ghost"
+                              size="icon"
+                              className="h-6 w-6"
+                              onClick={() => remove(index)}
+                            >
+                              <TbX className="h-4 w-4" />
+                            </Button>
+                          )}
+                        </div>
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              ))}
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                className="mt-4"
+                onClick={() => append({ value: "" })}
+              >
+                Add Project
+              </Button>
+            </div>
+
+            <DialogFooter>
+              <Button
+                type="submit"
+                disabled={
+                  form.formState.isSubmitting || !form.formState.isDirty
+                }
+              >
+                Update
+              </Button>
+            </DialogFooter>
+          </form>
+        </Form>
+      </DialogContent>
+    </Dialog>
+  );
+};
diff --git a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/page.tsx b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/page.tsx
index 00fb7034..93be14eb 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/page.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/integrations/page.tsx
@@ -12,7 +12,7 @@ import { cn } from "@ctrlplane/ui";
 import { Button } from "@ctrlplane/ui/button";
 import { Card } from "@ctrlplane/ui/card";
 
-import { GoogleDialog } from "./GoogleDialog";
+import { GoogleDialog } from "./google/GoogleDialog";
 
 const Badge: React.FC<{ className?: string; children?: React.ReactNode }> = ({
   className,
diff --git a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/page.tsx b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/page.tsx
index 03b8237f..425b3369 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/page.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(targets)/target-providers/page.tsx
@@ -91,7 +91,7 @@ export default function TargetProvidersPage({
                 </TooltipProvider>
               </TableCell>
               <TableCell className="text-right">
-                <ProviderActionsDropdown providerId={provider.id} />
+                <ProviderActionsDropdown provider={provider} />
               </TableCell>
             </TableRow>
           ))}
diff --git a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/google/page.tsx b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/google/page.tsx
new file mode 100644
index 00000000..095e3bb9
--- /dev/null
+++ b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/google/page.tsx
@@ -0,0 +1,30 @@
+"use client";
+
+import { SiGooglecloud } from "react-icons/si";
+
+import { Card } from "@ctrlplane/ui/card";
+
+export default function GoogleIntegrationPage() {
+  return (
+    <div className="flex flex-col gap-12">
+      <div className="flex items-center gap-4">
+        <SiGooglecloud className="h-14 w-14 text-red-400" />
+        <div className="flex flex-col gap-1">
+          <h1 className="text-3xl font-bold">Google</h1>
+          <p className="text-sm text-muted-foreground">
+            Sync deployment targets, trigger google workflows and more.
+          </p>
+        </div>
+      </div>
+
+      <Card className="flex items-center justify-between rounded-md p-4">
+        <div className="space-y-1">
+          <h2 className="text-lg font-semibold">Google Cloud</h2>
+          <p className="text-sm text-muted-foreground">
+            Sync deployment targets, trigger google workflows and more.
+          </p>
+        </div>
+      </Card>
+    </div>
+  );
+}
diff --git a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/layout.tsx b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/layout.tsx
index 98b9f9c8..075237de 100644
--- a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/layout.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/(integration)/layout.tsx
@@ -15,17 +15,19 @@ export default function IntegrationLayout({
   const router = useRouter();
   const { workspaceSlug } = params;
   return (
-    <div className="flex flex-col gap-4">
-      <Button
-        variant="ghost"
-        onClick={() =>
-          router.push(`/${workspaceSlug}/settings/workspace/integrations`)
-        }
-        className="flex w-fit items-center gap-2"
-      >
-        <TbArrowLeft className="h-4 w-4" /> Integrations
-      </Button>
-      {children}
+    <div className="flex justify-center">
+      <div className="flex max-w-3xl flex-col gap-4">
+        <Button
+          variant="ghost"
+          onClick={() =>
+            router.push(`/${workspaceSlug}/settings/workspace/integrations`)
+          }
+          className="flex w-fit items-center gap-2"
+        >
+          <TbArrowLeft className="h-4 w-4" /> Integrations
+        </Button>
+        {children}
+      </div>
     </div>
   );
 }
diff --git a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/page.tsx b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/page.tsx
index 264e94f3..eea2030a 100644
--- a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/page.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/integrations/page.tsx
@@ -1,34 +1,32 @@
 import Link from "next/link";
-import { SiGithub } from "react-icons/si";
+import { SiGithub, SiGooglecloud } from "react-icons/si";
 
-import { Button } from "@ctrlplane/ui/button";
 import { Card } from "@ctrlplane/ui/card";
 
 export const metadata = { title: "Integrations" };
 
 const IntegrationCard: React.FC<{
+  integration: string;
+  workspaceSlug: string;
   children: React.ReactNode;
-}> = ({ children }) => (
-  <Card className="flex h-full flex-col justify-between space-y-4 p-4 text-center">
-    {children}
+}> = ({ children, integration, workspaceSlug }) => (
+  <Card className="flex h-full cursor-pointer flex-col justify-between space-y-4 rounded-md text-center hover:bg-muted/20">
+    <Link
+      href={`/${workspaceSlug}/settings/workspace/integrations/${integration}`}
+      className="p-5"
+    >
+      {children}
+    </Link>
   </Card>
 );
 
 const IntegrationContent: React.FC<{ children: React.ReactNode }> = ({
   children,
-}) => <div className="space-y-2">{children}</div>;
-
-const IntegrationActionButton: React.FC<{
-  children: React.ReactNode;
-}> = ({ children }) => (
-  <Button variant="outline" size="sm" className="block w-full">
-    {children}
-  </Button>
-);
+}) => <div className="space-y-3">{children}</div>;
 
 const IntegrationHeading: React.FC<{ children: React.ReactNode }> = ({
   children,
-}) => <div className="space-y-1">{children}</div>;
+}) => <div className="flex items-center gap-2">{children}</div>;
 
 export default function IntegrationsPage({
   params,
@@ -38,7 +36,7 @@ export default function IntegrationsPage({
   const { workspaceSlug } = params;
 
   return (
-    <div className="container mx-auto max-w-6xl space-y-8">
+    <div className="container mx-auto max-w-3xl space-y-8">
       <div className="space-y-1">
         <h1 className="text-2xl font-semibold">Integrations</h1>
         <p className="text-sm text-muted-foreground">
@@ -47,23 +45,29 @@ export default function IntegrationsPage({
       </div>
 
       <div className="grid grid-cols-3 gap-4">
-        <IntegrationCard>
+        <IntegrationCard integration="github" workspaceSlug={workspaceSlug}>
           <IntegrationContent>
             <IntegrationHeading>
-              <SiGithub className="mx-auto text-4xl" />
-              <div className="font-semibold">GitHub Bot</div>
+              <SiGithub className="text-4xl" />
+              <span className="font-semibold">GitHub</span>
             </IntegrationHeading>
-            <p className="text-xs text-muted-foreground">
+            <p className="text-left text-sm text-muted-foreground">
               Grant our account the correct permissions and we will manage
               running the target provider for you.
             </p>
           </IntegrationContent>
+        </IntegrationCard>
 
-          <Link
-            href={`/${workspaceSlug}/settings/workspace/integrations/github`}
-          >
-            <IntegrationActionButton>Configure</IntegrationActionButton>
-          </Link>
+        <IntegrationCard integration="google" workspaceSlug={workspaceSlug}>
+          <IntegrationContent>
+            <IntegrationHeading>
+              <SiGooglecloud className="text-4xl text-red-400" />
+              <span className="font-semibold">Google</span>
+            </IntegrationHeading>
+            <p className="text-left text-sm text-muted-foreground">
+              Sync deployment targets, trigger google workflows and more.
+            </p>
+          </IntegrationContent>
         </IntegrationCard>
       </div>
     </div>
diff --git a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/overview/page.tsx b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/overview/page.tsx
index 255486fa..0e1aa9fa 100644
--- a/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/overview/page.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/settings/(settings)/workspace/overview/page.tsx
@@ -17,6 +17,7 @@ export default function OverviewPage({
 }: {
   params: { workspaceSlug: string };
 }) {
+  const { workspaceSlug } = params;
   return (
     <div className="container mx-auto max-w-7xl space-y-8">
       <div className="space-y-1">
@@ -45,7 +46,7 @@ export default function OverviewPage({
             </div>
 
             <div className="flex items-center gap-2">
-              <Link href={`/${params.workspaceSlug}/target-providers`}>
+              <Link href={`/${workspaceSlug}/target-providers`}>
                 <Button size="sm" variant="secondary">
                   Sync targets
                 </Button>
@@ -73,7 +74,7 @@ export default function OverviewPage({
             </div>
 
             <div className="flex items-center gap-2">
-              <Link href={`/${params.workspaceSlug}/systems`}>
+              <Link href={`/${workspaceSlug}/systems`}>
                 <Button size="sm" variant="secondary">
                   Create systems
                 </Button>
@@ -100,7 +101,7 @@ export default function OverviewPage({
             </div>
 
             <div className="flex items-center gap-2">
-              <Link href={`/${params.workspaceSlug}/environments`}>
+              <Link href={`/${workspaceSlug}/environments`}>
                 <Button size="sm" variant="secondary">
                   Configure environments
                 </Button>
@@ -133,7 +134,7 @@ export default function OverviewPage({
                 </div>
                 <div>
                   <Link
-                    href={`/${params.workspaceSlug}/settings/workspace/integrations/github`}
+                    href={`/${workspaceSlug}/settings/workspace/integrations/github`}
                   >
                     <Button variant="secondary" size="sm">
                       Open
@@ -153,9 +154,7 @@ export default function OverviewPage({
                 </div>
                 <div>
                   <Link
-                    href={
-                      "https://docs.ctrlplane.dev/google-cloud/compute-scanner"
-                    }
+                    href={`/${workspaceSlug}/settings/workspace/integrations/google`}
                   >
                     <Button variant="secondary" size="sm">
                       Open
diff --git a/packages/api/src/router/target.ts b/packages/api/src/router/target.ts
index 0ee19e63..11b46de5 100644
--- a/packages/api/src/router/target.ts
+++ b/packages/api/src/router/target.ts
@@ -17,9 +17,9 @@ import {
   takeFirstOrNull,
 } from "@ctrlplane/db";
 import {
-  cerateTargetProviderGoogle,
   createTarget,
   createTargetProvider,
+  createTargetProviderGoogle,
   target,
   targetLabelGroup,
   targetProvider,
@@ -135,6 +135,10 @@ const targetProviderRouter = createTRPCRouter({
       const providers = await ctx.db
         .select()
         .from(targetProvider)
+        .leftJoin(
+          targetProviderGoogle,
+          eq(targetProviderGoogle.targetProviderId, targetProvider.id),
+        )
         .where(eq(targetProvider.workspaceId, input));
 
       if (providers.length === 0) return [];
@@ -148,7 +152,7 @@ const targetProviderRouter = createTRPCRouter({
         .where(
           inArray(
             target.providerId,
-            providers.map((p) => p.id),
+            providers.map((p) => p.target_provider.id),
           ),
         )
         .groupBy(target.providerId);
@@ -163,55 +167,91 @@ const targetProviderRouter = createTRPCRouter({
         .where(
           inArray(
             target.providerId,
-            providers.map((p) => p.id),
+            providers.map((p) => p.target_provider.id),
           ),
         )
         .groupBy(target.providerId, target.kind)
         .orderBy(sql`count(*) DESC`);
 
       return providers.map((provider) => ({
-        ...provider,
+        ...provider.target_provider,
+        googleConfig: provider.target_provider_google,
         targetCount:
-          providerCounts.find((pc) => pc.providerId === provider.id)?.count ??
-          0,
+          providerCounts.find(
+            (pc) => pc.providerId === provider.target_provider.id,
+          )?.count ?? 0,
         kinds: providerKinds
-          .filter((pk) => pk.providerId === provider.id)
+          .filter((pk) => pk.providerId === provider.target_provider.id)
           .map(({ kind, count }) => ({ kind, count })),
       }));
     }),
 
   managed: createTRPCRouter({
-    google: protectedProcedure
-      .input(
-        createTargetProvider.and(
-          z.object({
-            config: cerateTargetProviderGoogle.omit({ targetProviderId: true }),
+    google: createTRPCRouter({
+      create: protectedProcedure
+        .input(
+          createTargetProvider.and(
+            z.object({
+              config: createTargetProviderGoogle.omit({
+                targetProviderId: true,
+              }),
+            }),
+          ),
+        )
+        .mutation(({ ctx, input }) =>
+          ctx.db.transaction(async (db) => {
+            const tg = await db
+              .insert(targetProvider)
+              .values(input)
+              .returning()
+              .then(takeFirst);
+            const tgConfig = await db
+              .insert(targetProviderGoogle)
+              .values({ ...input.config, targetProviderId: tg.id })
+              .returning()
+              .then(takeFirst);
+
+            console.log("queueing target scan");
+            await targetScanQueue.add(
+              tg.id,
+              { targetProviderId: tg.id },
+              { repeat: { every: ms("5m"), immediately: true } },
+            );
+
+            return { ...tg, config: tgConfig };
           }),
         ),
-      )
-      .mutation(({ ctx, input }) =>
-        ctx.db.transaction(async (db) => {
-          const tg = await db
-            .insert(targetProvider)
-            .values(input)
-            .returning()
-            .then(takeFirst);
-          const tgConfig = await db
-            .insert(targetProviderGoogle)
-            .values({ ...input.config, targetProviderId: tg.id })
-            .returning()
-            .then(takeFirst);
-
-          console.log("queueing target scan");
-          await targetScanQueue.add(
-            tg.id,
-            { targetProviderId: tg.id },
-            { repeat: { every: ms("5m"), immediately: true } },
-          );
 
-          return { ...tg, config: tgConfig };
-        }),
-      ),
+      update: protectedProcedure
+        .input(
+          z.object({
+            targetProviderId: z.string().uuid(),
+            name: z.string(),
+            config: createTargetProviderGoogle.omit({
+              targetProviderId: true,
+            }),
+          }),
+        )
+        .mutation(({ ctx, input }) =>
+          ctx.db.transaction(async (db) =>
+            db
+              .update(targetProvider)
+              .set(input)
+              .where(eq(targetProvider.id, input.targetProviderId))
+              .then(() =>
+                db
+                  .update(targetProviderGoogle)
+                  .set(input.config)
+                  .where(
+                    eq(
+                      targetProviderGoogle.targetProviderId,
+                      input.targetProviderId,
+                    ),
+                  ),
+              ),
+          ),
+        ),
+    }),
   }),
 
   delete: protectedProcedure
diff --git a/packages/db/src/schema/target-provider.ts b/packages/db/src/schema/target-provider.ts
index 947d0cf1..43f5801c 100644
--- a/packages/db/src/schema/target-provider.ts
+++ b/packages/db/src/schema/target-provider.ts
@@ -36,7 +36,7 @@ export const targetProviderGoogle = pgTable("target_provider_google", {
     .references(() => targetProvider.id, { onDelete: "cascade" }),
   projectIds: text("project_ids").array().notNull(),
 });
-export const cerateTargetProviderGoogle = createInsertSchema(
+export const createTargetProviderGoogle = createInsertSchema(
   targetProviderGoogle,
   { projectIds: z.array(z.string().min(1)).min(1) },
 ).omit({