Merge remote-tracking branch 'origin/main' into misc/privilege-management-v2-transition

This commit is contained in:
Sheen Capadngan
2025-03-19 19:51:41 +08:00
264 changed files with 6747 additions and 890 deletions
@@ -0,0 +1,197 @@
import { Controller, useFormContext, useWatch } from "react-hook-form";
import { SingleValue } from "react-select";
import { faCircleInfo } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { SecretSyncConnectionField } from "@app/components/secret-syncs/forms/SecretSyncConnectionField";
import { FilterableSelect, FormControl, Select, SelectItem, Tooltip } from "@app/components/v2";
import { HUMANITEC_SYNC_SCOPES } from "@app/helpers/secretSyncs";
import {
THumanitecConnectionApp,
THumanitecConnectionEnvironment,
THumanitecConnectionOrganization,
useHumanitecConnectionListOrganizations
} from "@app/hooks/api/appConnections/humanitec";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { HumanitecSyncScope } from "@app/hooks/api/secretSyncs/types/humanitec-sync";
import { TSecretSyncForm } from "../schemas";
export const HumanitecSyncFields = () => {
const { control, watch, setValue } = useFormContext<
TSecretSyncForm & { destination: SecretSync.Humanitec }
>();
const connectionId = useWatch({ name: "connection.id", control });
const currentOrg = watch("destinationConfig.org");
const currentApp = watch("destinationConfig.app");
const currentScope = watch("destinationConfig.scope");
const { data: organizations = [], isPending: isOrganizationsPending } =
useHumanitecConnectionListOrganizations(connectionId, {
enabled: Boolean(connectionId)
});
const selectedOrg = organizations?.find((org) => org.id === currentOrg);
const selectedApp = selectedOrg?.apps?.find((app) => app.id === currentApp);
const environments = selectedApp?.envs || [];
return (
<>
<SecretSyncConnectionField
onChange={() => {
setValue("destinationConfig.org", "");
setValue("destinationConfig.app", "");
setValue("destinationConfig.env", "");
}}
/>
<Controller
name="destinationConfig.org"
control={control}
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl
errorText={error?.message}
isError={Boolean(error?.message)}
label="Organization"
>
<FilterableSelect
isLoading={isOrganizationsPending && Boolean(connectionId)}
isDisabled={!connectionId}
value={organizations ? (organizations.find((org) => org.id === value) ?? []) : []}
onChange={(option) => {
onChange((option as SingleValue<THumanitecConnectionOrganization>)?.id ?? null);
setValue("destinationConfig.app", "");
setValue("destinationConfig.env", "");
}}
options={organizations}
placeholder="Select an organization..."
getOptionLabel={(option) => option.name}
getOptionValue={(option) => option.id.toString()}
/>
</FormControl>
)}
/>
<Controller
name="destinationConfig.app"
control={control}
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl
isError={Boolean(error)}
errorText={error?.message}
label="App"
helperText={
<Tooltip
className="max-w-md"
content="Ensure that the app exists in the selected organization and the service account used on this connection has write permissions for the specified app."
>
<div>
<span>Don&#39;t see the app you&#39;re looking for?</span>{" "}
<FontAwesomeIcon icon={faCircleInfo} className="text-mineshaft-400" />
</div>
</Tooltip>
}
>
<FilterableSelect
menuPlacement="top"
isLoading={isOrganizationsPending && Boolean(connectionId) && Boolean(currentOrg)}
isDisabled={!connectionId || !currentOrg}
value={
organizations
.find((org) => org.id === currentOrg)
?.apps?.find((app) => app.id === value) ?? null
}
onChange={(option) => {
onChange((option as SingleValue<THumanitecConnectionApp>)?.id ?? null);
setValue("destinationConfig.env", "");
}}
options={
currentOrg ? (organizations.find((org) => org.id === currentOrg)?.apps ?? []) : []
}
placeholder="Select an app..."
getOptionLabel={(option) => option.name}
getOptionValue={(option) => option.id.toString()}
/>
</FormControl>
)}
/>
<Controller
name="destinationConfig.scope"
control={control}
defaultValue={HumanitecSyncScope.Application}
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl
errorText={error?.message}
isError={Boolean(error?.message)}
label="Scope"
tooltipClassName="max-w-lg py-3"
tooltipText={
<div className="flex flex-col gap-3">
<p>
Specify how Infisical should manage secrets from Humanitec. The following options
are available:
</p>
<ul className="flex list-disc flex-col gap-3 pl-4">
{Object.values(HUMANITEC_SYNC_SCOPES).map(({ name, description }) => {
return (
<li key={name}>
<p className="text-mineshaft-300">
<span className="font-medium text-bunker-200">{name}</span>: {description}
</p>
</li>
);
})}
</ul>
</div>
}
>
<Select
value={value}
onValueChange={(val) => {
onChange(val);
setValue("destinationConfig.env", "");
}}
className="w-full border border-mineshaft-500 capitalize"
position="popper"
placeholder="Select a scope..."
dropdownContainerClassName="max-w-none"
>
{Object.values(HumanitecSyncScope).map((scope) => (
<SelectItem className="capitalize" value={scope} key={scope}>
{scope.replace("-", " ")}
</SelectItem>
))}
</Select>
</FormControl>
)}
/>
{currentScope === HumanitecSyncScope.Environment && (
<Controller
name="destinationConfig.env"
control={control}
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl isError={Boolean(error)} errorText={error?.message} label="Environment">
<FilterableSelect
menuPlacement="top"
isLoading={
isOrganizationsPending &&
Boolean(connectionId) &&
Boolean(currentOrg) &&
Boolean(currentApp)
}
isDisabled={!connectionId || !currentApp}
value={environments.find((env) => env.id === value) ?? null}
onChange={(option) =>
onChange((option as SingleValue<THumanitecConnectionEnvironment>)?.id ?? null)
}
options={environments}
placeholder="Select an env..."
getOptionLabel={(option) => option.name}
getOptionValue={(option) => option.id.toString()}
/>
</FormControl>
)}
/>
)}
</>
);
};
@@ -10,6 +10,7 @@ import { AzureKeyVaultSyncFields } from "./AzureKeyVaultSyncFields";
import { DatabricksSyncFields } from "./DatabricksSyncFields";
import { GcpSyncFields } from "./GcpSyncFields";
import { GitHubSyncFields } from "./GitHubSyncFields";
import { HumanitecSyncFields } from "./HumanitecSyncFields";
export const SecretSyncDestinationFields = () => {
const { watch } = useFormContext<TSecretSyncForm>();
@@ -31,6 +32,8 @@ export const SecretSyncDestinationFields = () => {
return <AzureAppConfigurationSyncFields />;
case SecretSync.Databricks:
return <DatabricksSyncFields />;
case SecretSync.Humanitec:
return <HumanitecSyncFields />;
default:
throw new Error(`Unhandled Destination Config Field: ${destination}`);
}
@@ -1,9 +1,9 @@
import { ReactNode } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { faTriangleExclamation } from "@fortawesome/free-solid-svg-icons";
import { faQuestionCircle, faTriangleExclamation } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { FormControl, Select, SelectItem } from "@app/components/v2";
import { FormControl, Select, SelectItem, Switch, Tooltip } from "@app/components/v2";
import { SECRET_SYNC_INITIAL_SYNC_BEHAVIOR_MAP, SECRET_SYNC_MAP } from "@app/helpers/secretSyncs";
import { SecretSync, useSecretSyncOption } from "@app/hooks/api/secretSyncs";
@@ -38,6 +38,7 @@ export const SecretSyncOptionsFields = ({ hideInitialSync }: Props) => {
case SecretSync.AzureKeyVault:
case SecretSync.AzureAppConfiguration:
case SecretSync.Databricks:
case SecretSync.Humanitec:
AdditionalSyncOptionsFieldsComponent = null;
break;
default:
@@ -115,6 +116,44 @@ export const SecretSyncOptionsFields = ({ hideInitialSync }: Props) => {
</>
)}
{AdditionalSyncOptionsFieldsComponent}
<Controller
control={control}
name="syncOptions.disableSecretDeletion"
render={({ field: { value, onChange }, fieldState: { error } }) => {
return (
<FormControl isError={Boolean(error)} errorText={error?.message}>
<Switch
className="bg-mineshaft-400/80 shadow-inner data-[state=checked]:bg-green/80"
id="auto-sync-enabled"
thumbClassName="bg-mineshaft-800"
onCheckedChange={onChange}
isChecked={value}
>
<p className="w-[11rem]">
Disable Secret Deletion{" "}
<Tooltip
className="max-w-md"
content={
<>
<p>
When enabled, Infisical will <span className="font-semibold">not</span>{" "}
remove secrets from the destination during a sync.
</p>
<p className="mt-4">
Enable this option if you intend to manage some secrets manually outside
of Infisical.
</p>
</>
}
>
<FontAwesomeIcon icon={faQuestionCircle} size="sm" className="ml-1" />
</Tooltip>
</p>
</Switch>
</FormControl>
);
}}
/>
{/* <Controller
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl
@@ -0,0 +1,24 @@
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";
import { HumanitecSyncScope } from "@app/hooks/api/secretSyncs/types/humanitec-sync";
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");
const scope = watch("destinationConfig.scope");
return (
<>
<SecretSyncLabel label="Organization">{orgId}</SecretSyncLabel>
<SecretSyncLabel label="Application">{appId}</SecretSyncLabel>
{scope === HumanitecSyncScope.Environment && (
<SecretSyncLabel label="Environment">{envId}</SecretSyncLabel>
)}
</>
);
};
@@ -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>();
@@ -35,6 +36,7 @@ export const SecretSyncReviewFields = () => {
secretPath,
syncOptions: {
// appendSuffix, prependPrefix,
disableSecretDeletion,
initialSyncBehavior
},
destination,
@@ -67,6 +69,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}`);
}
@@ -107,6 +112,11 @@ export const SecretSyncReviewFields = () => {
{/* <SecretSyncLabel label="Prepend Prefix">{prependPrefix}</SecretSyncLabel>
<SecretSyncLabel label="Append Suffix">{appendSuffix}</SecretSyncLabel> */}
{AdditionalSyncOptionsFieldsComponent}
{disableSecretDeletion && (
<SecretSyncLabel label="Secret Deletion">
<Badge variant="primary">Disabled</Badge>
</SecretSyncLabel>
)}
</div>
</div>
<div className="flex flex-col gap-3">
@@ -7,7 +7,8 @@ export const BaseSecretSyncSchema = <T extends AnyZodObject | undefined = undefi
additionalSyncOptions?: T
) => {
const baseSyncOptionsSchema = z.object({
initialSyncBehavior: z.nativeEnum(SecretSyncInitialSyncBehavior)
initialSyncBehavior: z.nativeEnum(SecretSyncInitialSyncBehavior),
disableSecretDeletion: z.boolean().optional().default(false)
// scott: removed temporarily for evaluation of template formatting
// prependPrefix: z
// .string()
@@ -0,0 +1,24 @@
import { z } from "zod";
import { BaseSecretSyncSchema } from "@app/components/secret-syncs/forms/schemas/base-secret-sync-schema";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { HumanitecSyncScope } from "@app/hooks/api/secretSyncs/types/humanitec-sync";
export const HumanitecSyncDestinationSchema = BaseSecretSyncSchema().merge(
z.object({
destination: z.literal(SecretSync.Humanitec),
destinationConfig: z.discriminatedUnion("scope", [
z.object({
scope: z.literal(HumanitecSyncScope.Application),
org: z.string().trim().min(1, "Organization required"),
app: z.string().trim().min(1, "Application required")
}),
z.object({
scope: z.literal(HumanitecSyncScope.Environment),
org: z.string().trim().min(1, "Organization required"),
app: z.string().trim().min(1, "Application required"),
env: z.string().trim().min(1, "Environment required")
})
])
})
);
@@ -8,6 +8,7 @@ import { AwsParameterStoreSyncDestinationSchema } from "./aws-parameter-store-sy
import { AzureAppConfigurationSyncDestinationSchema } from "./azure-app-configuration-sync-destination-schema";
import { AzureKeyVaultSyncDestinationSchema } from "./azure-key-vault-sync-destination-schema";
import { GcpSyncDestinationSchema } from "./gcp-sync-destination-schema";
import { HumanitecSyncDestinationSchema } from "./humanitec-sync-destination-schema";
const SecretSyncUnionSchema = z.discriminatedUnion("destination", [
AwsParameterStoreSyncDestinationSchema,
@@ -16,7 +17,8 @@ const SecretSyncUnionSchema = z.discriminatedUnion("destination", [
GcpSyncDestinationSchema,
AzureKeyVaultSyncDestinationSchema,
AzureAppConfigurationSyncDestinationSchema,
DatabricksSyncDestinationSchema
DatabricksSyncDestinationSchema,
HumanitecSyncDestinationSchema
]);
export const SecretSyncFormSchema = SecretSyncUnionSchema;