Address greptile comments

frontend/src/components/pki-syncs/PkiSyncSelect.tsx

@@ -65,10 +65,10 @@ export const PkiSyncSelect = ({ onSelect }: Props) => {
           const { image, name } = PKI_SYNC_MAP[destination];
           return (
             <button
-              key={name}
+              key={destination}
               type="button"
               onClick={() =>
-                enterprise && !subscription.enterpriseSecretSyncs
+                enterprise && !subscription.enterpriseCertificateSyncs
                   ? handlePopUpOpen("upgradePlan")
                   : onSelect(destination)
               }

frontend/src/components/pki-syncs/PkiSyncStatusBadge.tsx

@@ -47,7 +47,7 @@ export const PkiSyncStatusBadge = ({ status }: Props) => {
     <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap" variant={variant}>
       <FontAwesomeIcon
         icon={icon}
-        className={[PkiSyncStatus.Running].includes(status) ? "animate-spin" : ""}
+        className={status === PkiSyncStatus.Running ? "animate-spin" : ""}
       />
       <span>{text}</span>
     </Badge>

frontend/src/components/pki-syncs/forms/CreatePkiSyncForm.tsx

@@ -10,7 +10,13 @@ import { createNotification } from "@app/components/notifications";
 import { Button, FormControl, Switch } from "@app/components/v2";
 import { useWorkspace } from "@app/context";
 import { PKI_SYNC_MAP } from "@app/helpers/pkiSyncs";
-import { PkiSync, TPkiSync, useCreatePkiSync, usePkiSyncOption } from "@app/hooks/api/pkiSyncs";
+import {
+  PkiSync,
+  TCreatePkiSyncDTO,
+  TPkiSync,
+  useCreatePkiSync,
+  usePkiSyncOption
+} from "@app/hooks/api/pkiSyncs";
 
 import { PkiSyncDestinationFields } from "./PkiSyncDestinationFields";
 import { PkiSyncDetailsFields } from "./PkiSyncDetailsFields";
@@ -57,12 +63,16 @@ export const CreatePkiSyncForm = ({ destination, onComplete, onCancel }: Props)
     reValidateMode: "onChange"
   });
 
-  const onSubmit = async ({ connection, ...formData }: TPkiSyncForm) => {
+  const onSubmit = async ({ connection, destinationConfig, ...formData }: TPkiSyncForm) => {
     try {
       const pkiSync = await createPkiSync.mutateAsync({
         ...formData,
         connectionId: connection.id,
-        projectId: currentWorkspace.id
+        projectId: currentWorkspace.id,
+        destinationConfig: {
+          destination,
+          config: destinationConfig
+        } as unknown as TCreatePkiSyncDTO["destinationConfig"]
       });
 
       createNotification({
@@ -70,12 +80,12 @@ export const CreatePkiSyncForm = ({ destination, onComplete, onCancel }: Props)
         type: "success"
       });
       onComplete(pkiSync);
-    } catch (err: any) {
+    } catch (err: Error | unknown) {
       console.error(err);
       setShowConfirmation(false);
       createNotification({
         title: `Failed to add ${destinationName} Certificate Sync`,
-        text: err.message,
+        text: err instanceof Error ? err.message : "An unknown error occurred",
         type: "error"
       });
     }

frontend/src/components/pki-syncs/forms/PkiSyncDestinationFields.tsx

@@ -14,6 +14,10 @@ export const PkiSyncDestinationFields = () => {
     case PkiSync.AzureKeyVault:
       return <AzureKeyVaultPkiSyncFields />;
     default:
-      throw new Error(`Unhandled Destination Config Field: ${destination}`);
+      return (
+        <div className="flex items-center justify-center rounded-md border border-red-500 bg-red-100 p-4 text-red-700">
+          <p>Unsupported destination: {destination}</p>
+        </div>
+      );
   }
 };

frontend/src/components/pki-syncs/forms/PkiSyncOptionsFields/PkiSyncOptionsFields.tsx

@@ -61,17 +61,17 @@ export const PkiSyncOptionsFields = () => {
               isChecked={value}
             >
               <p>
-                Disable Certificate Removal{" "}
+                Enable Certificate Removal{" "}
                 <Tooltip
                   className="max-w-md"
                   content={
                     <>
                       <p>
-                        When enabled, Infisical will <span className="font-semibold">not</span>{" "}
-                        remove certificates from the destination during a sync.
+                        When enabled, Infisical will remove certificates from the destination during
+                        a sync if they are no longer managed by Infisical.
                       </p>
                       <p className="mt-4">
-                        Enable this option if you intend to manage some certificates manually
+                        Disable this option if you intend to manage some certificates manually
                         outside of Infisical.
                       </p>
                     </>

frontend/src/components/pki-syncs/forms/schemas.ts

@@ -3,14 +3,18 @@ import { z } from "zod";
 import { PkiSync } from "@app/hooks/api/pkiSyncs";
 
 export const PkiSyncFormSchema = z.object({
-  name: z.string().trim().min(1, "Name is required"),
+  name: z
+    .string()
+    .trim()
+    .min(1, "Name is required")
+    .max(255, "Name must be less than 255 characters"),
   description: z.string().optional(),
   destination: z.nativeEnum(PkiSync),
   isAutoSyncEnabled: z.boolean().default(true),
   subscriberId: z.string().min(1, "PKI Subscriber is required"),
   connection: z.object({
-    id: z.string(),
-    name: z.string()
+    id: z.string().uuid("Invalid connection ID format"),
+    name: z.string().max(255, "Connection name must be less than 255 characters")
   }),
   destinationConfig: z.object({
     vaultBaseUrl: z.string().url("Valid URL is required")
@@ -25,11 +29,15 @@ export type TPkiSyncForm = z.infer<typeof PkiSyncFormSchema>;
 
 export const UpdatePkiSyncFormSchema = PkiSyncFormSchema.partial().merge(
   z.object({
-    name: z.string().trim().min(1, "Name is required"),
+    name: z
+      .string()
+      .trim()
+      .min(1, "Name is required")
+      .max(255, "Name must be less than 255 characters"),
     destination: z.nativeEnum(PkiSync),
     connection: z.object({
-      id: z.string(),
-      name: z.string()
+      id: z.string().uuid("Invalid connection ID format"),
+      name: z.string().max(255, "Connection name must be less than 255 characters")
     })
   })
 );