awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-14 20:51:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

feature: aws secrets manager sync

Browse Source
This commit is contained in:
Scott Wilson
2025-02-04 19:58:30 -08:00
parent 4f874734ab
commit 3f02481e78
54 changed files with 1051 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/secret-syncs/forms/SecretSyncDestinationFields/AwsParameterStoreSyncFields.tsx
+3 -32
View File
@@ -1,30 +1,11 @@
import { Controller, useFormContext } from "react-hook-form";
import { components, OptionProps, SingleValue } from "react-select";
import { faCheckCircle } from "@fortawesome/free-regular-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { SecretSyncConnectionField } from "@app/components/secret-syncs/forms/SecretSyncConnectionField";
import { Badge, FilterableSelect, FormControl, Input } from "@app/components/v2";
import { AWS_REGIONS } from "@app/helpers/appConnections";
import { FormControl, Input } from "@app/components/v2";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { TSecretSyncForm } from "../schemas";
const Option = ({ isSelected, children, ...props }: OptionProps<(typeof AWS_REGIONS)[number]>) => {
return (
<components.Option isSelected={isSelected} {...props}>
<div className="flex flex-row items-center justify-between">
<p className="truncate">{children}</p>
<Badge variant="success" className="ml-1 mr-auto cursor-pointer">
{props.data.slug}
</Badge>
{isSelected && (
<FontAwesomeIcon className="ml-2 text-primary" icon={faCheckCircle} size="sm" />
)}
</div>
</components.Option>
);
};
import { AwsRegionSelect } from "./shared";
export const AwsParameterStoreSyncFields = () => {
const { control } = useFormContext<
@@ -37,17 +18,7 @@ export const AwsParameterStoreSyncFields = () => {
<Controller
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl isError={Boolean(error)} errorText={error?.message} label="Region">
<FilterableSelect
value={AWS_REGIONS.find((region) => region.slug === value)}
onChange={(option) =>
onChange((option as SingleValue<(typeof AWS_REGIONS)[number]>)?.slug)
}
options={AWS_REGIONS}
placeholder="Select region..."
getOptionLabel={(option) => option.name}
getOptionValue={(option) => option.slug}
components={{ Option }}
/>
<AwsRegionSelect value={value} onChange={onChange} />
</FormControl>
)}
control={control}
frontend/src/components/secret-syncs/forms/SecretSyncDestinationFields/AwsSecretsManagerSyncFields.tsx
+96
View File
@@ -0,0 +1,96 @@
import { Controller, useFormContext } from "react-hook-form";
import { SecretSyncConnectionField } from "@app/components/secret-syncs/forms/SecretSyncConnectionField";
import { FormControl, Input, Select, SelectItem } from "@app/components/v2";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { AwsSecretsManagerSyncMappingBehavior } from "@app/hooks/api/secretSyncs/types/aws-secrets-manager-sync";
import { TSecretSyncForm } from "../schemas";
import { AwsRegionSelect } from "./shared";
export const AwsSecretsManagerSyncFields = () => {
const { control, watch } = useFormContext<
TSecretSyncForm & { destination: SecretSync.AWSSecretsManager }
>();
const mappingBehavior = watch("destinationConfig.mappingBehavior");
return (
<>
<SecretSyncConnectionField />
<Controller
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl isError={Boolean(error)} errorText={error?.message} label="Region">
<AwsRegionSelect value={value} onChange={onChange} />
</FormControl>
)}
control={control}
name="destinationConfig.region"
/>
<Controller
name="destinationConfig.mappingBehavior"
control={control}
defaultValue={AwsSecretsManagerSyncMappingBehavior.OneToOne}
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl
tooltipClassName="max-w-lg py-3"
tooltipText={
<div className="flex flex-col gap-3">
<p>Specify how Infisical should map secrets to AWS Secrets Manager:</p>
<ul className="flex list-disc flex-col gap-3 pl-4">
<li>
<p className="text-mineshaft-300">
<span className="font-medium text-bunker-200">One-To-One</span>: Each
Infisical secret will be mapped to a separate AWS Secrets Manager secret.
</p>
</li>
<li>
<p className="text-mineshaft-300">
<span className="font-medium text-bunker-200">Many-To-One</span>: All
Infisical secrets will be mapped to a single AWS Secrets Manager secret.
</p>
</li>
</ul>
</div>
}
errorText={error?.message}
isError={Boolean(error?.message)}
label="Mapping Behavior"
>
<Select
value={value}
onValueChange={(val) => onChange(val)}
className="w-full border border-mineshaft-500 capitalize"
position="popper"
placeholder="Select an option..."
dropdownContainerClassName="max-w-none"
>
{Object.values(AwsSecretsManagerSyncMappingBehavior).map((behavior) => {
return (
<SelectItem className="capitalize" value={behavior} key={behavior}>
{behavior}
</SelectItem>
);
})}
</Select>
</FormControl>
)}
/>
{mappingBehavior === AwsSecretsManagerSyncMappingBehavior.ManyToOne && (
<Controller
render={({ field: { value, onChange }, fieldState: { error } }) => (
<FormControl
isError={Boolean(error)}
errorText={error?.message}
label="AWS Secrets Manager Secret Name"
>
<Input value={value} onChange={onChange} placeholder="Secret name..." />
</FormControl>
)}
control={control}
name="destinationConfig.secretName"
/>
)}
</>
);
};
frontend/src/components/secret-syncs/forms/SecretSyncDestinationFields/SecretSyncDestinationFields.tsx
+3
View File
@@ -4,6 +4,7 @@ import { SecretSync } from "@app/hooks/api/secretSyncs";
import { TSecretSyncForm } from "../schemas";
import { AwsParameterStoreSyncFields } from "./AwsParameterStoreSyncFields";
import { AwsSecretsManagerSyncFields } from "./AwsSecretsManagerSyncFields";
import { GcpSyncFields } from "./GcpSyncFields";
import { GitHubSyncFields } from "./GitHubSyncFields";
@@ -15,6 +16,8 @@ export const SecretSyncDestinationFields = () => {
switch (destination) {
case SecretSync.AWSParameterStore:
return <AwsParameterStoreSyncFields />;
case SecretSync.AWSSecretsManager:
return <AwsSecretsManagerSyncFields />;
case SecretSync.GitHub:
return <GitHubSyncFields />;
case SecretSync.GCPSecretManager:
frontend/src/components/secret-syncs/forms/SecretSyncDestinationFields/shared/AwsRegionSelect.tsx
+41
View File
@@ -0,0 +1,41 @@
import { components, OptionProps, SingleValue } from "react-select";
import { faCheckCircle } from "@fortawesome/free-regular-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Badge, FilterableSelect } from "@app/components/v2";
import { AWS_REGIONS } from "@app/helpers/appConnections";
const Option = ({ isSelected, children, ...props }: OptionProps<(typeof AWS_REGIONS)[number]>) => {
return (
<components.Option isSelected={isSelected} {...props}>
<div className="flex flex-row items-center justify-between">
<p className="truncate">{children}</p>
<Badge variant="success" className="ml-1 mr-auto cursor-pointer">
{props.data.slug}
</Badge>
{isSelected && (
<FontAwesomeIcon className="ml-2 text-primary" icon={faCheckCircle} size="sm" />
)}
</div>
</components.Option>
);
};
type Props = {
value: string;
onChange: (value: string | undefined) => void;
};
export const AwsRegionSelect = ({ value, onChange }: Props) => {
return (
<FilterableSelect
value={AWS_REGIONS.find((region) => region.slug === value)}
onChange={(option) => onChange((option as SingleValue<(typeof AWS_REGIONS)[number]>)?.slug)}
options={AWS_REGIONS}
placeholder="Select region..."
getOptionLabel={(option) => option.name}
getOptionValue={(option) => option.slug}
components={{ Option }}
/>
);
};
frontend/src/components/secret-syncs/forms/SecretSyncDestinationFields/shared/index.ts
+1
View File
@@ -0,0 +1 @@
export * from "./AwsRegionSelect";
frontend/src/components/secret-syncs/forms/SecretSyncReviewFields/AwsSecretsManagerSyncReviewFields.tsx
+39
View File
@@ -0,0 +1,39 @@
import { useFormContext } from "react-hook-form";
import { SecretSyncLabel } from "@app/components/secret-syncs";
import { TSecretSyncForm } from "@app/components/secret-syncs/forms/schemas";
import { Badge } from "@app/components/v2";
import { AWS_REGIONS } from "@app/helpers/appConnections";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { AwsSecretsManagerSyncMappingBehavior } from "@app/hooks/api/secretSyncs/types/aws-secrets-manager-sync";
export const AwsSecretsManagerSyncReviewFields = () => {
const { watch } = useFormContext<
TSecretSyncForm & { destination: SecretSync.AWSSecretsManager }
>();
const [region, mappingBehavior, secretName] = watch([
"destinationConfig.region",
"destinationConfig.mappingBehavior",
"destinationConfig.secretName"
]);
const awsRegion = AWS_REGIONS.find((r) => r.slug === region);
return (
<>
<SecretSyncLabel label="Region">
{awsRegion?.name}
<Badge className="ml-1" variant="success">
{awsRegion?.slug}{" "}
</Badge>
</SecretSyncLabel>
<SecretSyncLabel className="capitalize" label="Mapping Behavior">
{mappingBehavior}
</SecretSyncLabel>
{mappingBehavior === AwsSecretsManagerSyncMappingBehavior.ManyToOne && (
<SecretSyncLabel label="Secret Name">{secretName}</SecretSyncLabel>
)}
</>
);
};
frontend/src/components/secret-syncs/forms/SecretSyncReviewFields/SecretSyncReviewFields.tsx
+4
View File
@@ -3,6 +3,7 @@ import { useFormContext } from "react-hook-form";
import { SecretSyncLabel } from "@app/components/secret-syncs";
import { TSecretSyncForm } from "@app/components/secret-syncs/forms/schemas";
import { AwsSecretsManagerSyncReviewFields } from "@app/components/secret-syncs/forms/SecretSyncReviewFields/AwsSecretsManagerSyncReviewFields";
import { Badge } from "@app/components/v2";
import { SECRET_SYNC_INITIAL_SYNC_BEHAVIOR_MAP, SECRET_SYNC_MAP } from "@app/helpers/secretSyncs";
import { SecretSync } from "@app/hooks/api/secretSyncs";
@@ -36,6 +37,9 @@ export const SecretSyncReviewFields = () => {
case SecretSync.AWSParameterStore:
DestinationFieldsComponent = <AwsParameterStoreSyncReviewFields />;
break;
case SecretSync.AWSSecretsManager:
DestinationFieldsComponent = <AwsSecretsManagerSyncReviewFields />;
break;
case SecretSync.GitHub:
DestinationFieldsComponent = <GitHubSyncReviewFields />;
break;
frontend/src/components/secret-syncs/forms/schemas/aws-secrets-manager-sync-destination-schema.ts
+30
View File
@@ -0,0 +1,30 @@
import { z } from "zod";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { AwsSecretsManagerSyncMappingBehavior } from "@app/hooks/api/secretSyncs/types/aws-secrets-manager-sync";
export const AwsSecretsManagerSyncDestinationSchema = z.object({
destination: z.literal(SecretSync.AWSSecretsManager),
destinationConfig: z
.discriminatedUnion("mappingBehavior", [
z.object({
mappingBehavior: z.literal(AwsSecretsManagerSyncMappingBehavior.OneToOne)
}),
z.object({
mappingBehavior: z.literal(AwsSecretsManagerSyncMappingBehavior.ManyToOne),
secretName: z
.string()
.regex(
/^[a-zA-Z0-9/_+=.@-]+$/,
"Secret name must contain only alphanumeric characters and the characters /_+=.@-"
)
.min(1, "Secret name is required")
.max(256, "Secret name cannot exceed 256 characters")
})
])
.and(
z.object({
region: z.string().min(1, "Region required")
})
)
});
frontend/src/components/secret-syncs/forms/schemas/secret-sync-schema.ts
+2
View File
@@ -1,5 +1,6 @@
import { z } from "zod";
import { AwsSecretsManagerSyncDestinationSchema } from "@app/components/secret-syncs/forms/schemas/aws-secrets-manager-sync-destination-schema";
import { GitHubSyncDestinationSchema } from "@app/components/secret-syncs/forms/schemas/github-sync-destination-schema";
import { SecretSyncInitialSyncBehavior } from "@app/hooks/api/secretSyncs";
import { slugSchema } from "@app/lib/schemas";
@@ -32,6 +33,7 @@ const BaseSecretSyncSchema = z.object({
const SecretSyncUnionSchema = z.discriminatedUnion("destination", [
AwsParameterStoreSyncDestinationSchema,
AwsSecretsManagerSyncDestinationSchema,
GitHubSyncDestinationSchema,
GcpSyncDestinationSchema
]);
frontend/src/helpers/secretSyncs.ts
+3 -1
View File
@@ -6,13 +6,15 @@ import {
} from "@app/hooks/api/secretSyncs";
export const SECRET_SYNC_MAP: Record<SecretSync, { name: string; image: string }> = {
[SecretSync.AWSParameterStore]: { name: "Parameter Store", image: "Amazon Web Services.png" },
[SecretSync.AWSParameterStore]: { name: "AWS Parameter Store", image: "Amazon Web Services.png" },
[SecretSync.AWSSecretsManager]: { name: "AWS Secrets Manager", image: "Amazon Web Services.png" },
[SecretSync.GitHub]: { name: "GitHub", image: "GitHub.png" },
[SecretSync.GCPSecretManager]: { name: "GCP Secret Manager", image: "Google Cloud Platform.png" }
};
export const SECRET_SYNC_CONNECTION_MAP: Record<SecretSync, AppConnection> = {
[SecretSync.AWSParameterStore]: AppConnection.AWS,
[SecretSync.AWSSecretsManager]: AppConnection.AWS,
[SecretSync.GitHub]: AppConnection.GitHub,
[SecretSync.GCPSecretManager]: AppConnection.GCP
};
frontend/src/hooks/api/secretSyncs/enums.ts
+1
View File
@@ -1,5 +1,6 @@
export enum SecretSync {
AWSParameterStore = "aws-parameter-store",
AWSSecretsManager = "aws-secrets-manager",
GitHub = "github",
GCPSecretManager = "gcp-secret-manager"
}
frontend/src/hooks/api/secretSyncs/types/aws-secrets-manager-sync.ts
+26
View File
@@ -0,0 +1,26 @@
import { AppConnection } from "@app/hooks/api/appConnections/enums";
import { SecretSync } from "@app/hooks/api/secretSyncs";
import { TRootSecretSync } from "@app/hooks/api/secretSyncs/types/root-sync";
export type TAwsSecretsManagerSync = TRootSecretSync & {
destination: SecretSync.AWSSecretsManager;
destinationConfig:
| {
mappingBehavior: AwsSecretsManagerSyncMappingBehavior.OneToOne;
region: string;
}
| {
region: string;
mappingBehavior: AwsSecretsManagerSyncMappingBehavior.ManyToOne;
secretName: string;
};
connection: {
app: AppConnection.AWS;
name: string;
id: string;
};
};
export enum AwsSecretsManagerSyncMappingBehavior {
OneToOne = "one-to-one",
ManyToOne = "many-to-one"
}
frontend/src/hooks/api/secretSyncs/types/index.ts
+2 -1
View File
@@ -3,6 +3,7 @@ import { TAwsParameterStoreSync } from "@app/hooks/api/secretSyncs/types/aws-par
import { TGitHubSync } from "@app/hooks/api/secretSyncs/types/github-sync";
import { DiscriminativePick } from "@app/types";
import { TAwsSecretsManagerSync } from "./aws-secrets-manager-sync";
import { TGcpSync } from "./gcp-sync";
export type TSecretSyncOption = {
@@ -11,7 +12,7 @@ export type TSecretSyncOption = {
canImportSecrets: boolean;
};
export type TSecretSync = TAwsParameterStoreSync | TGitHubSync | TGcpSync;
export type TSecretSync = TAwsParameterStoreSync | TAwsSecretsManagerSync | TGitHubSync | TGcpSync;
export type TListSecretSyncs = { secretSyncs: TSecretSync[] };
frontend/src/pages/secret-manager/IntegrationsListPage/IntegrationsListPage.tsx
+1 -1
View File
@@ -52,7 +52,7 @@ export const IntegrationsListPage = () => {
/>
<div className="mb-4 mt-4 flex flex-col rounded-r border-l-2 border-l-primary bg-mineshaft-300/5 px-4 py-2.5">
<div className="mb-1 flex items-center text-sm">
<FontAwesomeIcon icon={faInfoCircle} size="sm" className="mr-1 text-primary" />
<FontAwesomeIcon icon={faInfoCircle} size="sm" className="mr-1.5 text-primary" />
Integrations Update
</div>
<p className="mb-2 mt-1 text-sm text-bunker-300">
frontend/src/pages/secret-manager/IntegrationsListPage/components/SecretSyncsTab/SecretSyncTable/SecretSyncDestinationCol/AwsSecretsManagerSyncDestinationCol.tsx
+43
View File
@@ -0,0 +1,43 @@
import {
AwsSecretsManagerSyncMappingBehavior,
TAwsSecretsManagerSync
} from "@app/hooks/api/secretSyncs/types/aws-secrets-manager-sync";
import { getSecretSyncDestinationColValues } from "../helpers";
import { SecretSyncTableCell, SecretSyncTableCellProps } from "../SecretSyncTableCell";
type Props = {
secretSync: TAwsSecretsManagerSync;
};
export const AwsSecretsManagerSyncDestinationCol = ({ secretSync }: Props) => {
const { primaryText, secondaryText } = getSecretSyncDestinationColValues(secretSync);
const { destinationConfig } = secretSync;
let additionalProps: Pick<
SecretSyncTableCellProps,
"additionalTooltipContent" | "infoBadge" | "secondaryClassName"
> = {};
if (destinationConfig.mappingBehavior === AwsSecretsManagerSyncMappingBehavior.ManyToOne) {
additionalProps = {
infoBadge: "secondary",
additionalTooltipContent: (
<div className="mt-4">
<span className="text-xs text-bunker-300">Secret Name:</span>
<p className="text-sm">{destinationConfig.secretName}</p>
</div>
)
};
}
return (
<SecretSyncTableCell
{...additionalProps}
secondaryClassName="capitalize"
primaryText={primaryText}
secondaryText={secondaryText}
/>
);
};
frontend/src/pages/secret-manager/IntegrationsListPage/components/SecretSyncsTab/SecretSyncTable/SecretSyncDestinationCol/SecretSyncDestinationCol.tsx
+3
View File
@@ -1,6 +1,7 @@
import { SecretSync, TSecretSync } from "@app/hooks/api/secretSyncs";
import { AwsParameterStoreSyncDestinationCol } from "./AwsParameterStoreSyncDestinationCol";
import { AwsSecretsManagerSyncDestinationCol } from "./AwsSecretsManagerSyncDestinationCol";
import { GcpSyncDestinationCol } from "./GcpSyncDestinationCol";
import { GitHubSyncDestinationCol } from "./GitHubSyncDestinationCol";
@@ -12,6 +13,8 @@ export const SecretSyncDestinationCol = ({ secretSync }: Props) => {
switch (secretSync.destination) {
case SecretSync.AWSParameterStore:
return <AwsParameterStoreSyncDestinationCol secretSync={secretSync} />;
case SecretSync.AWSSecretsManager:
return <AwsSecretsManagerSyncDestinationCol secretSync={secretSync} />;
case SecretSync.GitHub:
return <GitHubSyncDestinationCol secretSync={secretSync} />;
case SecretSync.GCPSecretManager:
frontend/src/pages/secret-manager/IntegrationsListPage/components/SecretSyncsTab/SecretSyncTable/SecretSyncTableCell.tsx
+5 -1
View File
@@ -30,7 +30,11 @@ export const SecretSyncTableCell = ({
content={
<>
<p className="text-sm">{primaryText}</p>
{secondaryText && <p className="text-xs leading-3 text-bunker-300">{secondaryText}</p>}
{secondaryText && (
<p className={twMerge("text-xs leading-3 text-bunker-300", secondaryClassName)}>
{secondaryText}
</p>
)}
{additionalTooltipContent}
</>
}
frontend/src/pages/secret-manager/IntegrationsListPage/components/SecretSyncsTab/SecretSyncTable/helpers/index.ts
+4
View File
@@ -17,6 +17,10 @@ export const getSecretSyncDestinationColValues = (secretSync: TSecretSync) => {
primaryText = destinationConfig.path;
secondaryText = destinationConfig.region;
break;
case SecretSync.AWSSecretsManager:
primaryText = destinationConfig.region;
secondaryText = destinationConfig.mappingBehavior;
break;
case SecretSync.GitHub:
switch (destinationConfig.scope) {
case GitHubSyncScope.Organization:
frontend/src/pages/secret-manager/SecretSyncDetailsByIDPage/components/SecretSyncDestinationSection/AwsSecretsManagerSyncDestinationSection.tsx
+34
View File
@@ -0,0 +1,34 @@
import { SecretSyncLabel } from "@app/components/secret-syncs";
import { Badge } from "@app/components/v2";
import { AWS_REGIONS } from "@app/helpers/appConnections";
import {
AwsSecretsManagerSyncMappingBehavior,
TAwsSecretsManagerSync
} from "@app/hooks/api/secretSyncs/types/aws-secrets-manager-sync";
type Props = {
secretSync: TAwsSecretsManagerSync;
};
export const AwsSecretsManagerSyncDestinationSection = ({ secretSync }: Props) => {
const { destinationConfig } = secretSync;
const awsRegion = AWS_REGIONS.find((r) => r.slug === destinationConfig.region);
return (
<>
<SecretSyncLabel label="Region">
{awsRegion?.name}
<Badge className="ml-1" variant="success">
{awsRegion?.slug}{" "}
</Badge>
</SecretSyncLabel>
<SecretSyncLabel label="Mapping Behavior" className="capitalize">
{destinationConfig.mappingBehavior}
</SecretSyncLabel>
{destinationConfig.mappingBehavior === AwsSecretsManagerSyncMappingBehavior.ManyToOne && (
<SecretSyncLabel label="Secret Name">{destinationConfig.secretName}</SecretSyncLabel>
)}
</>
);
};
frontend/src/pages/secret-manager/SecretSyncDetailsByIDPage/components/SecretSyncDestinationSection/SecretSyncDestinatonSection.tsx
+4
View File
@@ -10,6 +10,7 @@ import { ProjectPermissionSecretSyncActions } from "@app/context/ProjectPermissi
import { APP_CONNECTION_MAP } from "@app/helpers/appConnections";
import { SecretSync, TSecretSync } from "@app/hooks/api/secretSyncs";
import { AwsParameterStoreSyncDestinationSection } from "@app/pages/secret-manager/SecretSyncDetailsByIDPage/components/SecretSyncDestinationSection/AwsParameterStoreSyncDestinationSection";
import { AwsSecretsManagerSyncDestinationSection } from "@app/pages/secret-manager/SecretSyncDetailsByIDPage/components/SecretSyncDestinationSection/AwsSecretsManagerSyncDestinationSection";
import { GitHubSyncDestinationSection } from "@app/pages/secret-manager/SecretSyncDetailsByIDPage/components/SecretSyncDestinationSection/GitHubSyncDestinationSection";
import { GcpSyncDestinationSection } from "./GcpSyncDestinationSection";
@@ -29,6 +30,9 @@ export const SecretSyncDestinationSection = ({ secretSync, onEditDestination }:
case SecretSync.AWSParameterStore:
DestinationComponents = <AwsParameterStoreSyncDestinationSection secretSync={secretSync} />;
break;
case SecretSync.AWSSecretsManager:
DestinationComponents = <AwsSecretsManagerSyncDestinationSection secretSync={secretSync} />;
break;
case SecretSync.GitHub:
DestinationComponents = <GitHubSyncDestinationSection secretSync={secretSync} />;
break;