Add Humanitec secret sync integration

frontend/src/components/secret-syncs/forms/SecretSyncReviewFields/HumanitecSyncReviewFields.tsx

@@ -0,0 +1,20 @@
+import { useFormContext } from "react-hook-form";
+
+import { SecretSyncLabel } from "@app/components/secret-syncs";
+import { TSecretSyncForm } from "@app/components/secret-syncs/forms/schemas";
+import { SecretSync } from "@app/hooks/api/secretSyncs";
+
+export const HumanitecSyncReviewFields = () => {
+  const { watch } = useFormContext<TSecretSyncForm & { destination: SecretSync.Humanitec }>();
+  const orgId = watch("destinationConfig.org");
+  const appId = watch("destinationConfig.app");
+  const envId = watch("destinationConfig.env");
+
+  return (
+    <>
+      <SecretSyncLabel label="Organization">{orgId}</SecretSyncLabel>
+      <SecretSyncLabel label="App">{appId}</SecretSyncLabel>
+      <SecretSyncLabel label="Environment">{envId}</SecretSyncLabel>
+    </>
+  );
+};

frontend/src/components/secret-syncs/forms/SecretSyncReviewFields/SecretSyncReviewFields.tsx

@@ -20,6 +20,7 @@ import { AzureKeyVaultSyncReviewFields } from "./AzureKeyVaultSyncReviewFields";
 import { DatabricksSyncReviewFields } from "./DatabricksSyncReviewFields";
 import { GcpSyncReviewFields } from "./GcpSyncReviewFields";
 import { GitHubSyncReviewFields } from "./GitHubSyncReviewFields";
+import { HumanitecSyncReviewFields } from "./HumanitecSyncReviewFields";
 
 export const SecretSyncReviewFields = () => {
   const { watch } = useFormContext<TSecretSyncForm>();
@@ -67,6 +68,9 @@ export const SecretSyncReviewFields = () => {
     case SecretSync.Databricks:
       DestinationFieldsComponent = <DatabricksSyncReviewFields />;
       break;
+    case SecretSync.Humanitec:
+      DestinationFieldsComponent = <HumanitecSyncReviewFields />;
+      break;
     default:
       throw new Error(`Unhandled Destination Review Fields: ${destination}`);
   }