improvements: address feedback

This commit is contained in:
Scott Wilson
2025-01-22 10:50:24 -08:00
parent c92c160709
commit 8f2a504fd0
22 changed files with 144 additions and 143 deletions

View File

@@ -10,7 +10,7 @@ export async function up(knex: Knex): Promise<void> {
t.string("name", 32).notNullable();
t.string("description");
t.string("destination").notNullable();
t.boolean("isEnabled").notNullable().defaultTo(true);
t.boolean("isAutoSyncEnabled").notNullable().defaultTo(true);
t.integer("version").defaultTo(1).notNullable();
t.jsonb("destinationConfig").notNullable();
t.jsonb("syncOptions").notNullable();

View File

@@ -12,7 +12,7 @@ export const SecretSyncsSchema = z.object({
name: z.string(),
description: z.string().nullable().optional(),
destination: z.string(),
isEnabled: z.boolean().default(true),
isAutoSyncEnabled: z.boolean().default(true),
version: z.number().default(1),
destinationConfig: z.unknown(),
syncOptions: z.unknown(),

View File

@@ -1671,7 +1671,7 @@ export const SecretSyncs = {
connectionId: `The ID of the ${
APP_CONNECTION_NAME_MAP[SECRET_SYNC_CONNECTION_MAP[destination]]
} Connection to use for syncing.`,
isEnabled: `Whether secrets should be synced automatically or not.`,
isAutoSyncEnabled: `Whether secrets should be automatically synced when changes occur at the source location or not.`,
syncOptions: "Optional parameters to modify how secrets are synced."
};
},
@@ -1686,7 +1686,7 @@ export const SecretSyncs = {
environment: `The updated slug of the project environment to sync secrets from.`,
secretPath: `The updated folder path to sync secrets from.`,
description: `The updated description of the ${destinationName} Sync.`,
isEnabled: `Whether secrets should be synced automatically or not.`,
isAutoSyncEnabled: `Whether secrets should be automatically synced when changes occur at the source location or not.`,
syncOptions: "Optional parameters to modify how secrets are synced."
};
},

View File

@@ -28,7 +28,7 @@ export const registerSyncSecretsEndpoints = <T extends TSecretSync, I extends TS
destinationConfig: I["destinationConfig"];
syncOptions: I["syncOptions"];
description?: string | null;
isEnabled?: boolean;
isAutoSyncEnabled?: boolean;
}>;
updateSchema: z.ZodType<{
connectionId?: string;
@@ -38,6 +38,7 @@ export const registerSyncSecretsEndpoints = <T extends TSecretSync, I extends TS
destinationConfig?: I["destinationConfig"];
syncOptions?: I["syncOptions"];
description?: string | null;
isAutoSyncEnabled?: boolean;
}>;
responseSchema: z.ZodTypeAny;
}) => {

View File

@@ -16,7 +16,7 @@ const AwsParameterStoreSyncDestinationConfigSchema = z.object({
.trim()
.min(1, "Parameter Store Path required")
.max(2048, "Cannot exceed 2048 characters")
.regex(/^\/([/]|(([\w-]+\/)+))?$/)
.regex(/^\/([/]|(([\w-]+\/)+))?$/, 'Invalid path - must follow "/example/path/" format')
.describe(SecretSyncs.DESTINATION_CONFIG.AWS_PARAMETER_STORE.PATH)
});

View File

@@ -73,7 +73,7 @@ export const SecretSyncFns = {
return GithubSyncFns.syncSecrets(secretSync, secretMap);
default:
throw new Error(
`Unhandled sync destination for push secrets: ${(secretSync as TSecretSyncWithCredentials).destination}`
`Unhandled sync destination for sync secrets fns: ${(secretSync as TSecretSyncWithCredentials).destination}`
);
}
},
@@ -88,7 +88,7 @@ export const SecretSyncFns = {
break;
default:
throw new Error(
`Unhandled sync destination for push secrets: ${(secretSync as TSecretSyncWithCredentials).destination}`
`Unhandled sync destination for get secrets fns: ${(secretSync as TSecretSyncWithCredentials).destination}`
);
}
@@ -105,7 +105,7 @@ export const SecretSyncFns = {
return GithubSyncFns.removeSecrets(secretSync, secretMap);
default:
throw new Error(
`Unhandled sync destination for removing secrets: ${(secretSync as TSecretSyncWithCredentials).destination}`
`Unhandled sync destination for remove secrets fns: ${(secretSync as TSecretSyncWithCredentials).destination}`
);
}
}

View File

@@ -827,7 +827,7 @@ export const secretSyncQueueFactory = ({
`Could not find folder at path "${secretPath}" for environment with slug "${environmentSlug}" in project with ID "${projectId}"`
);
const secretSyncs = await secretSyncDAL.find({ folderId: folder.id, isEnabled: true });
const secretSyncs = await secretSyncDAL.find({ folderId: folder.id, isAutoSyncEnabled: true });
await Promise.all(secretSyncs.map((secretSync) => queueSecretSyncSyncSecretsById({ syncId: secretSync.id })));
};

View File

@@ -65,7 +65,7 @@ export const GenericCreateSecretSyncFieldsSchema = (destination: SecretSync, syn
.min(1, "Secret path required")
.transform(removeTrailingSlash)
.describe(SecretSyncs.CREATE(destination).secretPath),
isEnabled: z.boolean().default(true).describe(SecretSyncs.CREATE(destination).isEnabled),
isAutoSyncEnabled: z.boolean().default(true).describe(SecretSyncs.CREATE(destination).isAutoSyncEnabled),
syncOptions: SyncOptionsSchema(destination, syncOptionsConfig).describe(SecretSyncs.CREATE(destination).syncOptions)
});
@@ -89,7 +89,7 @@ export const GenericUpdateSecretSyncFieldsSchema = (destination: SecretSync, syn
.transform(removeTrailingSlash)
.optional()
.describe(SecretSyncs.UPDATE(destination).secretPath),
isEnabled: z.boolean().optional().describe(SecretSyncs.UPDATE(destination).isEnabled),
isAutoSyncEnabled: z.boolean().optional().describe(SecretSyncs.UPDATE(destination).isAutoSyncEnabled),
syncOptions: SyncOptionsSchema(destination, syncOptionsConfig)
.optional()
.describe(SecretSyncs.UPDATE(destination).syncOptions)

View File

@@ -218,14 +218,14 @@ export const secretSyncServiceFactory = ({
const sync = await secretSyncDAL.create({
folderId: folder.id,
...params,
...(params.isEnabled && { syncStatus: SecretSyncStatus.Pending }),
...(params.isAutoSyncEnabled && { syncStatus: SecretSyncStatus.Pending }),
projectId
});
return sync;
});
if (secretSync.isEnabled) await secretSyncQueue.queueSecretSyncSyncSecretsById({ syncId: secretSync.id });
if (secretSync.isAutoSyncEnabled) await secretSyncQueue.queueSecretSyncSyncSecretsById({ syncId: secretSync.id });
return secretSync as TSecretSync;
};
@@ -317,18 +317,19 @@ export const secretSyncServiceFactory = ({
});
}
const isEnabled = params.isEnabled ?? secretSync.isEnabled;
const isAutoSyncEnabled = params.isAutoSyncEnabled ?? secretSync.isAutoSyncEnabled;
const updatedSync = await secretSyncDAL.updateById(syncId, {
...params,
...(isEnabled && folderId && { syncStatus: SecretSyncStatus.Pending }),
...(isAutoSyncEnabled && folderId && { syncStatus: SecretSyncStatus.Pending }),
folderId
});
return updatedSync;
});
if (updatedSecretSync.isEnabled) await secretSyncQueue.queueSecretSyncSyncSecretsById({ syncId: secretSync.id });
if (updatedSecretSync.isAutoSyncEnabled)
await secretSyncQueue.queueSecretSyncSyncSecretsById({ syncId: secretSync.id });
return updatedSecretSync as TSecretSync;
};

View File

@@ -51,7 +51,7 @@ export type TCreateSecretSyncDTO = Pick<TSecretSync, "syncOptions" | "destinatio
projectId: string;
secretPath: string;
environment: string;
isEnabled?: boolean;
isAutoSyncEnabled?: boolean;
};
export type TUpdateSecretSyncDTO = Partial<Omit<TCreateSecretSyncDTO, "projectId">> & {

View File

@@ -40,7 +40,7 @@ description: "Learn how to configure an AWS Parameter Store Sync for Infisical."
- **Overwrite Destination Secrets**: Removes any secrets at the destination endpoint not present in Infisical.
- **Import Secrets (Prioritize Infisical)**: Imports secrets from the destination endpoint prior to syncing, prioritizing values present in Infisical if secrets conflict.
- **Import Secrets (Prioritize Parameter Store)**: Imports secrets from the destination endpoint prior to syncing, prioritizing values present in Parameter Store if secrets conflict.
- **Enabled**: If enabled, secrets will automatically be synced from the source. Disable to prevent syncing until enabled.
- **Auto-Sync Enabled**: If enabled, secrets will automatically be synced from the source location when changes occur. Disable to enforce manual syncing only.
6. Configure the **Details** of your Parameter Store Sync, then click **Next**.
![Configure Details](/images/secret-syncs/aws-parameter-store/aws-parameter-store-details.png)

View File

@@ -62,7 +62,7 @@ description: "Learn how to configure a GitHub Sync for Infisical."
<Note>
GitHub does not support importing secrets.
</Note>
- **Enabled**: If enabled, secrets will automatically be synced from the source. Disable to prevent syncing until enabled.
- **Auto-Sync Enabled**: If enabled, secrets will automatically be synced from the source location when changes occur. Disable to enforce manual syncing only.
6. Configure the **Details** of your GitHub Sync, then click **Next**.
![Configure Details](/images/secret-syncs/github/github-details.png)

View File

@@ -51,7 +51,7 @@ export const CreateSecretSyncForm = ({ destination, onComplete, onCancel }: Prop
resolver: zodResolver(SecretSyncFormSchema),
defaultValues: {
destination,
isEnabled: true,
isAutoSyncEnabled: true,
syncOptions: {
initialSyncBehavior: syncOption?.canImportSecrets
? undefined
@@ -161,26 +161,26 @@ export const CreateSecretSyncForm = ({ destination, onComplete, onCancel }: Prop
<SecretSyncOptionsFields />
<Controller
control={control}
name="isEnabled"
name="isAutoSyncEnabled"
render={({ field: { value, onChange }, fieldState: { error } }) => {
return (
<FormControl
helperText={
value
? "Secrets will automatically be synced when changes occur in the source location"
: "Secrets will not be synced until enabled"
? "Secrets will automatically be synced when changes occur in the source location."
: "Secrets will not automatically be synced when changes occur in the source location. You can still trigger syncs manually."
}
isError={Boolean(error)}
errorText={error?.message}
>
<Switch
className="bg-red/50 shadow-inner data-[state=checked]:bg-green/50"
id="secret-sync-enabled"
className="bg-mineshaft-400/50 shadow-inner data-[state=checked]:bg-green/50"
id="auto-sync-enabled"
thumbClassName="bg-mineshaft-800"
onCheckedChange={onChange}
isChecked={value}
>
<p className="w-14">{value ? "Enabled" : "Disabled"}</p>
<p className="w-[8.4rem]">Auto-Sync {value ? "Enabled" : "Disabled"}</p>
</Switch>
</FormControl>
);
@@ -204,9 +204,11 @@ export const CreateSecretSyncForm = ({ destination, onComplete, onCancel }: Prop
containerClassName="-mt-5"
onCheckedChange={(isChecked) => setConfirmOverwrite(Boolean(isChecked))}
>
<p className={`mt-5 text-wrap ${confirmOverwrite ? "text-mineshaft-200" : "text-red"}`}>
<p
className={`mt-5 text-wrap text-xs ${confirmOverwrite ? "text-mineshaft-200" : "text-red"}`}
>
I understand all secrets present in the configured {destinationName} destination will
be removed that are not present within Infisical.
be removed if they are not present within Infisical.
</p>
</Checkbox>
)}
@@ -222,7 +224,6 @@ export const CreateSecretSyncForm = ({ destination, onComplete, onCancel }: Prop
>
{isFinalStep ? "Create Sync" : "Next"}
</Button>
{}
{selectedTabIndex > 0 && (
<Button onClick={handlePrev} colorSchema="secondary">
Back

View File

@@ -26,7 +26,7 @@ export const SecretSyncReviewFields = () => {
initialSyncBehavior
},
destination,
isEnabled
isAutoSyncEnabled
} = watch();
const destinationName = SECRET_SYNC_MAP[destination].name;
@@ -67,9 +67,9 @@ export const SecretSyncReviewFields = () => {
<span className="text-sm text-mineshaft-300">Options</span>
</div>
<div className="flex flex-wrap gap-x-8 gap-y-2">
<SecretSyncLabel label="Sync Enabled">
<Badge variant={isEnabled ? "success" : "danger"}>
{isEnabled ? "Enabled" : "Disabled"}
<SecretSyncLabel label="Auto-Sync">
<Badge variant={isAutoSyncEnabled ? "success" : "danger"}>
{isAutoSyncEnabled ? "Enabled" : "Disabled"}
</Badge>
</SecretSyncLabel>
<SecretSyncLabel label="Initial Sync Behavior">

View File

@@ -10,7 +10,7 @@ export const AwsParameterStoreSyncDestinationSchema = z.object({
.trim()
.min(1, "Parameter Store Path required")
.max(2048, "Cannot exceed 2048 characters")
.regex(/^\/([/]|(([\w-]+\/)+))?$/),
.regex(/^\/([/]|(([\w-]+\/)+))?$/, 'Invalid path - must follow "/example/path/" format'),
region: z.string().min(1, "Region required")
})
});

View File

@@ -26,7 +26,7 @@ const BaseSecretSyncSchema = z.object({
// .transform((str) => str.toUpperCase())
// .optional()
}),
isEnabled: z.boolean()
isAutoSyncEnabled: z.boolean()
});
const SecretSyncUnionSchema = z.discriminatedUnion("destination", [

View File

@@ -24,7 +24,7 @@ export type TCreateSecretSyncDTO = DiscriminativePick<
| "connectionId"
| "syncOptions"
| "destination"
| "isEnabled"
| "isAutoSyncEnabled"
> & { environment: string; secretPath: string; projectId: string };
export type TUpdateSecretSyncDTO = Partial<

View File

@@ -10,7 +10,7 @@ export type TRootSecretSync = {
connectionId: string;
createdAt: string;
updatedAt: string;
isEnabled: boolean;
isAutoSyncEnabled: boolean;
projectId: string;
syncStatus: SecretSyncStatus | null;
lastSyncJobId: string | null;

View File

@@ -76,7 +76,7 @@ export const SecretSyncRow = ({
name,
description,
syncStatus,
isEnabled,
isAutoSyncEnabled,
projectId
} = secretSync;
@@ -131,8 +131,7 @@ export const SecretSyncRow = ({
}
className={twMerge(
"group h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700",
syncStatus === SecretSyncStatus.Failed && "bg-red/5 hover:bg-red/10",
!isEnabled && "bg-mineshaft-400/15 opacity-50 hover:opacity-100"
syncStatus === SecretSyncStatus.Failed && "bg-red/5 hover:bg-red/10"
)}
key={`sync-${id}`}
>
@@ -180,58 +179,59 @@ export const SecretSyncRow = ({
<SecretSyncDestinationCol secretSync={secretSync} />
<Td>
<div className="flex items-center gap-1">
{isEnabled ? (
syncStatus && (
<Tooltip
position="left"
className="max-w-sm"
content={
[SecretSyncStatus.Succeeded, SecretSyncStatus.Failed].includes(syncStatus) ? (
<div className="flex flex-col gap-2 whitespace-normal py-1">
{lastSyncedAt && (
<div>
<div
className={`mb-2 flex self-start ${syncStatus === SecretSyncStatus.Failed ? "text-yellow" : "text-green"}`}
>
<FontAwesomeIcon
icon={faCalendarCheck}
className="ml-1 pr-1.5 pt-0.5 text-sm"
/>
<div className="text-xs">Last Synced</div>
</div>
<div className="rounded bg-mineshaft-600 p-2 text-xs">
{format(new Date(lastSyncedAt), "yyyy-MM-dd, hh:mm aaa")}
</div>
{syncStatus && (
<Tooltip
position="left"
className="max-w-sm"
content={
[SecretSyncStatus.Succeeded, SecretSyncStatus.Failed].includes(syncStatus) ? (
<div className="flex flex-col gap-2 whitespace-normal py-1">
{lastSyncedAt && (
<div>
<div
className={`mb-2 flex self-start ${syncStatus === SecretSyncStatus.Failed ? "text-yellow" : "text-green"}`}
>
<FontAwesomeIcon
icon={faCalendarCheck}
className="ml-1 pr-1.5 pt-0.5 text-sm"
/>
<div className="text-xs">Last Synced</div>
</div>
)}
{failureMessage && (
<div>
<div className="mb-2 flex self-start text-red">
<FontAwesomeIcon
icon={faXmark}
className="ml-1 pr-1.5 pt-0.5 text-sm"
/>
<div className="text-xs">Failure Reason</div>
</div>
<div className="rounded bg-mineshaft-600 p-2 text-xs">
{failureMessage}
</div>
<div className="rounded bg-mineshaft-600 p-2 text-xs">
{format(new Date(lastSyncedAt), "yyyy-MM-dd, hh:mm aaa")}
</div>
)}
</div>
) : undefined
}
>
<div>
<SecretSyncStatusBadge status={syncStatus} />
</div>
</Tooltip>
)
) : (
<Badge className="flex w-min items-center gap-1.5 bg-mineshaft-400/50 text-bunker-300">
<FontAwesomeIcon icon={faBan} />
<span>Disabled</span>
</Badge>
</div>
)}
{failureMessage && (
<div>
<div className="mb-2 flex self-start text-red">
<FontAwesomeIcon icon={faXmark} className="ml-1 pr-1.5 pt-0.5 text-sm" />
<div className="text-xs">Failure Reason</div>
</div>
<div className="rounded bg-mineshaft-600 p-2 text-xs">{failureMessage}</div>
</div>
)}
</div>
) : undefined
}
>
<div>
<SecretSyncStatusBadge status={syncStatus} />
</div>
</Tooltip>
)}
{!isAutoSyncEnabled && (
<Tooltip
className="text-xs"
content="Auto-Sync is disabled. Changes to the source location will not be automatically synced to the destination."
>
<div>
<Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
<FontAwesomeIcon icon={faBan} />
{!syncStatus && "Auto-Sync Disabled"}
</Badge>
</div>
</Tooltip>
)}
<SecretSyncImportStatusBadge mini secretSync={secretSync} />
<SecretSyncRemoveStatusBadge mini secretSync={secretSync} />
@@ -359,13 +359,13 @@ export const SecretSyncRow = ({
{(isAllowed: boolean) => (
<DropdownMenuItem
isDisabled={!isAllowed}
icon={<FontAwesomeIcon icon={isEnabled ? faToggleOff : faToggleOn} />}
icon={<FontAwesomeIcon icon={isAutoSyncEnabled ? faToggleOff : faToggleOn} />}
onClick={(e) => {
e.stopPropagation();
onToggleEnable(secretSync);
}}
>
{isEnabled ? "Disable" : "Enable"} Sync
{isAutoSyncEnabled ? "Disable" : "Enable"} Auto-Sync
</DropdownMenuItem>
)}
</ProjectPermissionCan>

View File

@@ -2,7 +2,6 @@ import { useMemo, useState } from "react";
import {
faArrowDown,
faArrowUp,
faBan,
faCheck,
faCheckCircle,
faFilter,
@@ -61,17 +60,10 @@ enum SecretSyncsOrderBy {
type SecretSyncFilters = {
destinations: SecretSync[];
status: SecretSyncStatusCol[];
status: SecretSyncStatus[];
environmentIds: string[];
};
enum SecretSyncStatusCol {
Pending = "pending",
Success = "success",
Failed = "failed",
Disabled = "disabled"
}
const getSyncStatusOrderValue = (syncStatus: SecretSyncStatus | null) => {
switch (syncStatus) {
case SecretSyncStatus.Failed:
@@ -91,10 +83,10 @@ type Props = {
};
const STATUS_ICON_MAP = {
[SecretSyncStatusCol.Success]: { icon: faCheck, className: "text-green", name: "Synced" },
[SecretSyncStatusCol.Failed]: { icon: faWarning, className: "text-red", name: "Not Synced" },
[SecretSyncStatusCol.Pending]: { icon: faRotate, className: "text-yellow", name: "Syncing" },
[SecretSyncStatusCol.Disabled]: { icon: faBan, className: "text-mineshaft-400", name: "Disabled" }
[SecretSyncStatus.Succeeded]: { icon: faCheck, className: "text-green", name: "Synced" },
[SecretSyncStatus.Failed]: { icon: faWarning, className: "text-red", name: "Not Synced" },
[SecretSyncStatus.Pending]: { icon: faRotate, className: "text-yellow", name: "Syncing" },
[SecretSyncStatus.Running]: { icon: faRotate, className: "text-yellow", name: "Syncing" }
};
export const SecretSyncsTable = ({ secretSyncs }: Props) => {
@@ -133,8 +125,7 @@ export const SecretSyncsTable = ({ secretSyncs }: Props) => {
() =>
secretSyncs
.filter((secretSync) => {
const { destination, name, connection, folder, environment, syncStatus, isEnabled } =
secretSync;
const { destination, name, connection, folder, environment, syncStatus } = secretSync;
if (filters.destinations.length && !filters.destinations.includes(destination))
return false;
@@ -146,12 +137,7 @@ export const SecretSyncsTable = ({ secretSyncs }: Props) => {
)
return false;
const status = isEnabled ? syncStatus : SecretSyncStatusCol.Disabled;
if (
filters.status.length &&
(!status || !filters.status.includes(status as SecretSyncStatusCol))
) {
if (filters.status.length && (!syncStatus || !filters.status.includes(syncStatus))) {
return false;
}
@@ -184,9 +170,6 @@ export const SecretSyncsTable = ({ secretSyncs }: Props) => {
getSecretSyncDestinationColValues(syncTwo).primaryText.toLowerCase()
);
case SecretSyncsOrderBy.Status:
if (!syncOne.isEnabled && syncTwo.isEnabled) return 1;
if (syncOne.isEnabled && !syncTwo.isEnabled) return -1;
if (!syncOne.syncStatus && syncTwo.syncStatus) return 1;
if (syncOne.syncStatus && !syncTwo.syncStatus) return -1;
if (!syncOne.syncStatus && !syncTwo.syncStatus) return 0;
@@ -238,22 +221,22 @@ export const SecretSyncsTable = ({ secretSyncs }: Props) => {
const handleToggleEnableSync = async (secretSync: TSecretSync) => {
const destinationName = SECRET_SYNC_MAP[secretSync.destination].name;
const isEnabled = !secretSync.isEnabled;
const isAutoSyncEnabled = !secretSync.isAutoSyncEnabled;
try {
await updateSync.mutateAsync({
syncId: secretSync.id,
destination: secretSync.destination,
isEnabled
isAutoSyncEnabled
});
createNotification({
text: `Successfully ${isEnabled ? "enabled" : "disabled"} ${destinationName} Sync`,
text: `Successfully ${isAutoSyncEnabled ? "enabled" : "disabled"} auto-sync for ${destinationName} Sync`,
type: "success"
});
} catch {
createNotification({
text: `Failed to ${isEnabled ? "enable" : "disable"} ${destinationName} Sync`,
text: `Failed to ${isAutoSyncEnabled ? "enable" : "disable"} auto-sync for ${destinationName} Sync`,
type: "error"
});
}
@@ -306,7 +289,7 @@ export const SecretSyncsTable = ({ secretSyncs }: Props) => {
</DropdownMenuTrigger>
<DropdownMenuContent className="thin-scrollbar max-h-[70vh] overflow-y-auto" align="end">
<DropdownMenuLabel>Status</DropdownMenuLabel>
{Object.values(SecretSyncStatusCol).map((status) => (
{Object.values(SecretSyncStatus).map((status) => (
<DropdownMenuItem
onClick={(e) => {
e.preventDefault();
@@ -442,7 +425,7 @@ export const SecretSyncsTable = ({ secretSyncs }: Props) => {
</IconButton>
</div>
</Th>
<Th className="min-w-[10rem]">
<Th className="min-w-[10.5rem]">
<div className="flex items-center">
Status
<IconButton

View File

@@ -1,5 +1,6 @@
import { useCallback } from "react";
import {
faBan,
faCheck,
faCopy,
faDownload,
@@ -24,6 +25,7 @@ import {
SecretSyncRemoveStatusBadge
} from "@app/components/secret-syncs";
import {
Badge,
Button,
DropdownMenu,
DropdownMenuContent,
@@ -84,22 +86,22 @@ export const SecretSyncActionTriggers = ({ secretSync }: Props) => {
}, [isIdCopied]);
const handleToggleEnableSync = async () => {
const isEnabled = !secretSync.isEnabled;
const isAutoSyncEnabled = !secretSync.isAutoSyncEnabled;
try {
await updateSync.mutateAsync({
syncId: secretSync.id,
destination: secretSync.destination,
isEnabled
isAutoSyncEnabled
});
createNotification({
text: `Successfully ${isEnabled ? "enabled" : "disabled"} ${destinationName} Sync`,
text: `Successfully ${isAutoSyncEnabled ? "enabled" : "disabled"} auto-sync for ${destinationName} Sync`,
type: "success"
});
} catch {
createNotification({
text: `Failed to ${isEnabled ? "enable" : "disable"} ${destinationName} Sync`,
text: `Failed to ${isAutoSyncEnabled ? "enable" : "disable"} auto-sync for ${destinationName} Sync`,
type: "error"
});
}
@@ -129,6 +131,27 @@ export const SecretSyncActionTriggers = ({ secretSync }: Props) => {
<div className="ml-auto mt-4 flex flex-wrap items-center justify-end gap-2">
<SecretSyncImportStatusBadge secretSync={secretSync} />
<SecretSyncRemoveStatusBadge secretSync={secretSync} />
{secretSync.isAutoSyncEnabled ? (
<Badge
variant="success"
className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap"
>
<FontAwesomeIcon icon={faRotate} />
<span>Auto-Sync Enabled</span>
</Badge>
) : (
<Tooltip
className="text-xs"
content="Auto-Sync is disabled. Changes to the source location will not be automatically synced to the destination."
>
<div>
<Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
<FontAwesomeIcon icon={faBan} />
<span>Auto-Sync Disabled</span>
</Badge>
</div>
</Tooltip>
)}
<div>
<ProjectPermissionCan
I={ProjectPermissionSecretSyncActions.SyncSecrets}
@@ -230,11 +253,13 @@ export const SecretSyncActionTriggers = ({ secretSync }: Props) => {
<DropdownMenuItem
isDisabled={!isAllowed}
icon={
<FontAwesomeIcon icon={secretSync.isEnabled ? faToggleOff : faToggleOn} />
<FontAwesomeIcon
icon={secretSync.isAutoSyncEnabled ? faToggleOff : faToggleOn}
/>
}
onClick={handleToggleEnableSync}
>
{secretSync.isEnabled ? "Disable" : "Enable"} Sync
{secretSync.isAutoSyncEnabled ? "Disable" : "Enable"} Auto-Sync
</DropdownMenuItem>
)}
</ProjectPermissionCan>

View File

@@ -1,11 +1,11 @@
import { useMemo } from "react";
import { faBan, faEdit } from "@fortawesome/free-solid-svg-icons";
import { faEdit } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { format } from "date-fns";
import { ProjectPermissionCan } from "@app/components/permissions";
import { SecretSyncLabel, SecretSyncStatusBadge } from "@app/components/secret-syncs";
import { Badge, IconButton } from "@app/components/v2";
import { SecretSyncLabel } from "@app/components/secret-syncs";
import { IconButton } from "@app/components/v2";
import { ProjectPermissionSub } from "@app/context";
import { ProjectPermissionSecretSyncActions } from "@app/context/ProjectPermissionContext/types";
import { SecretSyncStatus, TSecretSync } from "@app/hooks/api/secretSyncs";
@@ -16,7 +16,7 @@ type Props = {
};
export const SecretSyncDetailsSection = ({ secretSync, onEditDetails }: Props) => {
const { syncStatus, lastSyncMessage, lastSyncedAt, name, description, isEnabled } = secretSync;
const { syncStatus, lastSyncMessage, lastSyncedAt, name, description } = secretSync;
const failureMessage = useMemo(() => {
if (syncStatus === SecretSyncStatus.Failed) {
@@ -57,16 +57,6 @@ export const SecretSyncDetailsSection = ({ secretSync, onEditDetails }: Props) =
<div className="space-y-3">
<SecretSyncLabel label="Name">{name}</SecretSyncLabel>
<SecretSyncLabel label="Description">{description}</SecretSyncLabel>
<SecretSyncLabel label="Status">
{isEnabled ? (
syncStatus && <SecretSyncStatusBadge status={syncStatus} />
) : (
<Badge className="flex w-min items-center gap-1.5 bg-mineshaft-400/50 text-bunker-300">
<FontAwesomeIcon icon={faBan} />
<span>Disabled</span>
</Badge>
)}
</SecretSyncLabel>
{lastSyncedAt && (
<SecretSyncLabel label="Last Synced">
{format(new Date(lastSyncedAt), "yyyy-MM-dd, hh:mm aaa")}