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")
     })
   })
 );

frontend/src/hooks/api/pkiSyncs/mutations.tsx

@@ -39,7 +39,7 @@ export const useUpdatePkiSync = () => {
     },
     onSuccess: (_, { syncId, projectId }) => {
       queryClient.invalidateQueries({ queryKey: pkiSyncKeys.list(projectId) });
-      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId) });
+      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId, projectId) });
     }
   });
 };
@@ -56,7 +56,7 @@ export const useDeletePkiSync = () => {
     },
     onSuccess: (_, { syncId, projectId }) => {
       queryClient.invalidateQueries({ queryKey: pkiSyncKeys.list(projectId) });
-      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId) });
+      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId, projectId) });
     }
   });
 };
@@ -77,7 +77,7 @@ export const useTriggerPkiSyncSyncCertificates = () => {
     },
     onSuccess: (_, { syncId, projectId }) => {
       queryClient.invalidateQueries({ queryKey: pkiSyncKeys.list(projectId) });
-      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId) });
+      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId, projectId) });
     }
   });
 };
@@ -98,7 +98,7 @@ export const useTriggerPkiSyncImportCertificates = () => {
     },
     onSuccess: (_, { syncId, projectId }) => {
       queryClient.invalidateQueries({ queryKey: pkiSyncKeys.list(projectId) });
-      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId) });
+      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId, projectId) });
     }
   });
 };
@@ -119,7 +119,7 @@ export const useTriggerPkiSyncRemoveCertificates = () => {
     },
     onSuccess: (_, { syncId, projectId }) => {
       queryClient.invalidateQueries({ queryKey: pkiSyncKeys.list(projectId) });
-      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId) });
+      queryClient.invalidateQueries({ queryKey: pkiSyncKeys.byId(syncId, projectId) });
     }
   });
 };

frontend/src/hooks/api/pkiSyncs/queries.tsx

@@ -13,7 +13,8 @@ export const pkiSyncKeys = {
   all: ["pki-sync"] as const,
   options: () => [...pkiSyncKeys.all, "options"] as const,
   list: (projectId: string) => [...pkiSyncKeys.all, "list", projectId] as const,
-  byId: (syncId: string) => [...pkiSyncKeys.all, "by-id", syncId] as const
+  byId: (syncId: string, projectId: string) =>
+    [...pkiSyncKeys.all, "by-id", syncId, projectId] as const
 };
 
 export const usePkiSyncOptions = (
@@ -75,7 +76,7 @@ export const useGetPkiSync = (
   >
 ) => {
   return useQuery({
-    queryKey: pkiSyncKeys.byId(syncId),
+    queryKey: pkiSyncKeys.byId(syncId, projectId),
     queryFn: async () => {
       const { data } = await apiRequest.get<TPkiSyncResponse>(`/api/v1/pki-syncs/${syncId}`, {
         params: { projectId }

frontend/src/hooks/api/subscriptions/types.ts

@@ -53,6 +53,7 @@ export type SubscriptionPlan = {
   kmip: boolean;
   secretScanning: boolean;
   enterpriseSecretSyncs: boolean;
+  enterpriseCertificateSyncs: boolean;
   enterpriseAppConnections: boolean;
   cardDeclined?: boolean;
   cardDeclinedReason?: string;

frontend/src/pages/cert-manager/IntegrationsListPage/components/PkiSyncsTab/PkiSyncTable/PkiSyncRow.tsx

@@ -124,7 +124,7 @@ export const PkiSyncRow = ({
   return (
     <Tr
       onClick={() => {
-        console.log("PKI Sync navigation:", { syncId: id, projectId });
+        // console.log("PKI Sync navigation:", { syncId: id, projectId });
         navigate({
           to: ROUTE_PATHS.CertManager.PkiSyncDetailsByIDPage.path,
           params: {

frontend/src/pages/cert-manager/IntegrationsListPage/components/PkiSyncsTab/PkiSyncTable/PkiSyncsTable.tsx

@@ -146,7 +146,9 @@ export const PkiSyncsTable = ({ pkiSyncs }: Props) => {
           const destinationValues = getPkiSyncDestinationColValues(pkiSync);
 
           return (
-            PKI_SYNC_MAP[destination].name.toLowerCase().includes(searchValue) ||
+            (PKI_SYNC_MAP[destination]?.name || "Unknown Service")
+              .toLowerCase()
+              .includes(searchValue) ||
             name.toLowerCase().includes(searchValue) ||
             (pkiSync.appConnectionName &&
               pkiSync.appConnectionName.toLowerCase().includes(searchValue)) ||
@@ -209,7 +211,7 @@ export const PkiSyncsTable = ({ pkiSyncs }: Props) => {
   const getColSortIcon = (col: PkiSyncsOrderBy) =>
     orderDirection === OrderByDirection.DESC && orderBy === col ? faArrowUp : faArrowDown;
 
-  const isTableFiltered = Boolean(filters.destinations.length);
+  const isTableFiltered = Boolean(filters.destinations.length || filters.status.length);
 
   const handleDelete = (pkiSync: PkiSyncData) => handlePopUpOpen("deleteSync", pkiSync);
 

frontend/src/pages/cert-manager/IntegrationsListPage/components/PkiSyncsTab/PkiSyncsTab.tsx

@@ -88,7 +88,7 @@ export const PkiSyncsTab = () => {
             {(isAllowed) => (
               <Button
                 colorSchema="secondary"
-                type="submit"
+                type="button"
                 leftIcon={<FontAwesomeIcon icon={faPlus} />}
                 onClick={() => handlePopUpOpen("addSync")}
                 isDisabled={!isAllowed}

frontend/src/pages/cert-manager/PkiSyncDetailsByIDPage/components/PkiSyncAuditLogsSection.tsx

@@ -54,25 +54,18 @@ export const PkiSyncAuditLogsSection = ({ pkiSync }: Props) => {
               Please{" "}
               {subscription && subscription.slug !== null ? (
                 <Link to="/organization/billing" target="_blank" rel="noopener noreferrer">
-                  <a
-                    className="cursor-pointer underline transition-all hover:text-white"
-                    target="_blank"
-                  >
+                  <span className="cursor-pointer underline transition-all hover:text-white">
                     upgrade your subscription
-                  </a>
+                  </span>
                 </Link>
               ) : (
                 <a
                   href="https://infisical.com/scheduledemo"
                   target="_blank"
                   rel="noopener noreferrer"
+                  className="cursor-pointer underline transition-all hover:text-white"
                 >
-                  <a
-                    className="cursor-pointer underline transition-all hover:text-white"
-                    target="_blank"
-                  >
-                    upgrade your subscription
-                  </a>
+                  upgrade your subscription
                 </a>
               )}{" "}
               to view sync logs.

frontend/src/pages/cert-manager/PkiSyncDetailsByIDPage/components/PkiSyncDetailsSection.tsx

@@ -86,7 +86,7 @@ export const PkiSyncDetailsSection = ({ pkiSync, onEditDetails }: Props) => {
           )}
           {lastSyncedAt && (
             <GenericFieldLabel label="Last Synced">
-              {format(new Date(lastSyncedAt), "yyyy-MM-dd, hh:mm aaa")}
+              {format(new Date(lastSyncedAt), "yyyy-MM-dd, h:mm aaa")}
             </GenericFieldLabel>
           )}
           {syncStatus === PkiSyncStatus.Failed && failureMessage && (