mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-20 18:00:54 +00:00
feat: adds secret sync handlers
This commit is contained in:
+7
-7
@@ -130,9 +130,9 @@ export const CloudIntegrationSection = ({
|
||||
tabIndex={0}
|
||||
className={`group relative ${
|
||||
cloudIntegration.isAvailable
|
||||
? "cursor-pointer duration-200 hover:bg-mineshaft-700"
|
||||
? "hover:bg-mineshaft-700 cursor-pointer duration-200"
|
||||
: "opacity-50"
|
||||
} flex h-36 flex-col items-center justify-center rounded-md border border-mineshaft-600 bg-mineshaft-800 p-3`}
|
||||
} border-mineshaft-600 bg-mineshaft-800 flex h-36 flex-col items-center justify-center rounded-md border p-3`}
|
||||
onClick={() => {
|
||||
if (isSyncAvailable) {
|
||||
navigate({
|
||||
@@ -180,9 +180,9 @@ export const CloudIntegrationSection = ({
|
||||
</div>
|
||||
{cloudIntegration.isAvailable &&
|
||||
Boolean(integrationAuths?.[cloudIntegration.slug]) && (
|
||||
<div className="absolute top-0 right-0 z-30 h-full">
|
||||
<div className="absolute right-0 top-0 z-30 h-full">
|
||||
<div className="relative h-full">
|
||||
<div className="absolute top-0 right-0 w-24 flex-row items-center overflow-hidden rounded-tr-md rounded-bl-md bg-primary px-2 py-0.5 text-xs whitespace-nowrap text-black opacity-80 transition-all duration-300 group-hover:w-0 group-hover:p-0">
|
||||
<div className="bg-primary absolute right-0 top-0 w-24 flex-row items-center overflow-hidden whitespace-nowrap rounded-bl-md rounded-tr-md px-2 py-0.5 text-xs text-black opacity-80 transition-all duration-300 group-hover:w-0 group-hover:p-0">
|
||||
<FontAwesomeIcon icon={faCheck} className="mr-2 text-xs" />
|
||||
Authorized
|
||||
</div>
|
||||
@@ -197,7 +197,7 @@ export const CloudIntegrationSection = ({
|
||||
provider: cloudIntegration.slug
|
||||
});
|
||||
}}
|
||||
className="absolute top-0 right-0 flex h-0 w-12 cursor-pointer items-center justify-center overflow-hidden rounded-r-md bg-red text-xs opacity-50 transition-all duration-300 group-hover:h-full hover:opacity-100"
|
||||
className="bg-red absolute right-0 top-0 flex h-0 w-12 cursor-pointer items-center justify-center overflow-hidden rounded-r-md text-xs opacity-50 transition-all duration-300 hover:opacity-100 group-hover:h-full"
|
||||
>
|
||||
<FontAwesomeIcon icon={faXmark} size="xl" />
|
||||
</div>
|
||||
@@ -208,7 +208,7 @@ export const CloudIntegrationSection = ({
|
||||
{isSyncAvailable && (
|
||||
<div className="absolute bottom-0 left-0 z-30 h-full w-full">
|
||||
<div className="relative h-full">
|
||||
<div className="absolute bottom-0 left-0 w-full flex-row overflow-hidden rounded-br-md rounded-bl-md bg-yellow/20 px-2 py-0.5 text-center text-xs whitespace-nowrap text-yellow">
|
||||
<div className="bg-yellow/20 text-yellow absolute bottom-0 left-0 w-full flex-row overflow-hidden whitespace-nowrap rounded-bl-md rounded-br-md px-2 py-0.5 text-center text-xs">
|
||||
Secret Sync Available
|
||||
</div>
|
||||
</div>
|
||||
@@ -230,7 +230,7 @@ export const CloudIntegrationSection = ({
|
||||
{Array.from({ length: 16 }).map((_, index) => (
|
||||
<div
|
||||
key={`dummy-cloud-integration-${index + 1}`}
|
||||
className="h-32 animate-pulse rounded-md border border-mineshaft-600 bg-mineshaft-800"
|
||||
className="border-mineshaft-600 bg-mineshaft-800 h-32 animate-pulse rounded-md border"
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
import { TLaravelForgeSync } from "@app/hooks/api/secretSyncs/types/laravel-forge-sync";
|
||||
|
||||
import { getSecretSyncDestinationColValues } from "../helpers";
|
||||
import { SecretSyncTableCell } from "../SecretSyncTableCell";
|
||||
|
||||
type Props = {
|
||||
secretSync: TLaravelForgeSync;
|
||||
};
|
||||
|
||||
export const LaravelForgeSyncDestinationCol = ({ secretSync }: Props) => {
|
||||
const { primaryText, secondaryText } = getSecretSyncDestinationColValues(secretSync);
|
||||
|
||||
console.log({ secretSync });
|
||||
return <SecretSyncTableCell primaryText={primaryText} secondaryText={secondaryText} />;
|
||||
};
|
||||
+3
@@ -20,6 +20,7 @@ import { GitLabSyncDestinationCol } from "./GitLabSyncDestinationCol";
|
||||
import { HCVaultSyncDestinationCol } from "./HCVaultSyncDestinationCol";
|
||||
import { HerokuSyncDestinationCol } from "./HerokuSyncDestinationCol";
|
||||
import { HumanitecSyncDestinationCol } from "./HumanitecSyncDestinationCol";
|
||||
import { LaravelForgeSyncDestinationCol } from "./LaravelForgeSyncDestinationCol";
|
||||
import { NetlifySyncDestinationCol } from "./NetlifySyncDestinationCol";
|
||||
import { OCIVaultSyncDestinationCol } from "./OCIVaultSyncDestinationCol";
|
||||
import { RailwaySyncDestinationCol } from "./RailwaySyncDestinationCol";
|
||||
@@ -97,6 +98,8 @@ export const SecretSyncDestinationCol = ({ secretSync }: Props) => {
|
||||
return <NetlifySyncDestinationCol secretSync={secretSync} />;
|
||||
case SecretSync.Bitbucket:
|
||||
return <BitbucketSyncDestinationCol secretSync={secretSync} />;
|
||||
case SecretSync.LaravelForge:
|
||||
return <LaravelForgeSyncDestinationCol secretSync={secretSync} />;
|
||||
default:
|
||||
throw new Error(
|
||||
`Unhandled Secret Sync Destination Col: ${(secretSync as TSecretSync).destination}`
|
||||
|
||||
+4
@@ -194,6 +194,10 @@ export const getSecretSyncDestinationColValues = (secretSync: TSecretSync) => {
|
||||
primaryText = destinationConfig.workspaceSlug;
|
||||
secondaryText = destinationConfig.repositorySlug;
|
||||
break;
|
||||
case SecretSync.LaravelForge:
|
||||
primaryText = destinationConfig.siteName || destinationConfig.siteId;
|
||||
secondaryText = destinationConfig.orgName || destinationConfig.orgSlug;
|
||||
break;
|
||||
default:
|
||||
throw new Error(`Unhandled Destination Col Values ${destination}`);
|
||||
}
|
||||
|
||||
+3
-3
@@ -72,7 +72,7 @@ const PageContent = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="container mx-auto flex flex-col justify-between bg-bunker-800 font-inter text-white">
|
||||
<div className="bg-bunker-800 font-inter container mx-auto flex flex-col justify-between text-white">
|
||||
<div className="mx-auto mb-6 w-full max-w-7xl">
|
||||
<Button
|
||||
variant="link"
|
||||
@@ -96,11 +96,11 @@ const PageContent = () => {
|
||||
<img
|
||||
alt={`${destinationDetails.name} sync`}
|
||||
src={`/images/integrations/${destinationDetails.image}`}
|
||||
className="mt-3 ml-1 w-16"
|
||||
className="ml-1 mt-3 w-16"
|
||||
/>
|
||||
<div>
|
||||
<p className="text-3xl font-medium text-white">{secretSync.name}</p>
|
||||
<p className="leading-3 text-bunker-300">{destinationDetails.name} Sync</p>
|
||||
<p className="text-bunker-300 leading-3">{destinationDetails.name} Sync</p>
|
||||
</div>
|
||||
<SecretSyncActionTriggers secretSync={secretSync} />
|
||||
</div>
|
||||
|
||||
+24
@@ -0,0 +1,24 @@
|
||||
import { GenericFieldLabel } from "@app/components/secret-syncs";
|
||||
import { TLaravelForgeSync } from "@app/hooks/api/secretSyncs/types/laravel-forge-sync";
|
||||
|
||||
type Props = {
|
||||
secretSync: TLaravelForgeSync;
|
||||
};
|
||||
|
||||
export const LaravelForgeSyncDestinationSection = ({ secretSync }: Props) => {
|
||||
const { destinationConfig } = secretSync;
|
||||
|
||||
return (
|
||||
<>
|
||||
<GenericFieldLabel label="Account">
|
||||
{destinationConfig.orgName || destinationConfig.orgSlug}
|
||||
</GenericFieldLabel>
|
||||
<GenericFieldLabel label="Server">
|
||||
{destinationConfig.serverName || destinationConfig.serverId}
|
||||
</GenericFieldLabel>
|
||||
<GenericFieldLabel label="Site">
|
||||
{destinationConfig.siteName || destinationConfig.siteId}
|
||||
</GenericFieldLabel>
|
||||
</>
|
||||
);
|
||||
};
|
||||
+7
-3
@@ -31,6 +31,7 @@ import { GitLabSyncDestinationSection } from "./GitLabSyncDestinationSection";
|
||||
import { HCVaultSyncDestinationSection } from "./HCVaultSyncDestinationSection";
|
||||
import { HerokuSyncDestinationSection } from "./HerokuSyncDestinationSection";
|
||||
import { HumanitecSyncDestinationSection } from "./HumanitecSyncDestinationSection";
|
||||
import { LaravelForgeSyncDestinationSection } from "./LaravelForgeSyncDestinationSection";
|
||||
import { NetlifySyncDestinationSection } from "./NetlifySyncDestinationSection";
|
||||
import { OCIVaultSyncDestinationSection } from "./OCIVaultSyncDestinationSection";
|
||||
import { RailwaySyncDestinationSection } from "./RailwaySyncDestinationSection";
|
||||
@@ -148,6 +149,9 @@ export const SecretSyncDestinationSection = ({ secretSync, onEditDestination }:
|
||||
case SecretSync.Bitbucket:
|
||||
DestinationComponents = <BitbucketSyncDestinationSection secretSync={secretSync} />;
|
||||
break;
|
||||
case SecretSync.LaravelForge:
|
||||
DestinationComponents = <LaravelForgeSyncDestinationSection secretSync={secretSync} />;
|
||||
break;
|
||||
default:
|
||||
throw new Error(`Unhandled Destination Section components: ${destination}`);
|
||||
}
|
||||
@@ -161,9 +165,9 @@ export const SecretSyncDestinationSection = ({ secretSync, onEditDestination }:
|
||||
: ProjectPermissionSub.SecretSyncs;
|
||||
|
||||
return (
|
||||
<div className="flex w-full flex-col gap-3 rounded-lg border border-mineshaft-600 bg-mineshaft-900 px-4 py-3">
|
||||
<div className="flex items-center justify-between border-b border-mineshaft-400 pb-2">
|
||||
<h3 className="font-medium text-mineshaft-100">Destination Configuration</h3>
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 flex w-full flex-col gap-3 rounded-lg border px-4 py-3">
|
||||
<div className="border-mineshaft-400 flex items-center justify-between border-b pb-2">
|
||||
<h3 className="text-mineshaft-100 font-medium">Destination Configuration</h3>
|
||||
<ProjectPermissionCan I={ProjectPermissionSecretSyncActions.Edit} a={permissionSubject}>
|
||||
{(isAllowed) => (
|
||||
<IconButton
|
||||
|
||||
+4
-3
@@ -71,6 +71,7 @@ export const SecretSyncOptionsSection = ({ secretSync, onEditOptions }: Props) =
|
||||
case SecretSync.DigitalOceanAppPlatform:
|
||||
case SecretSync.Netlify:
|
||||
case SecretSync.Bitbucket:
|
||||
case SecretSync.LaravelForge:
|
||||
AdditionalSyncOptionsComponent = null;
|
||||
break;
|
||||
default:
|
||||
@@ -87,9 +88,9 @@ export const SecretSyncOptionsSection = ({ secretSync, onEditOptions }: Props) =
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="flex w-full flex-col gap-3 rounded-lg border border-mineshaft-600 bg-mineshaft-900 px-4 py-3">
|
||||
<div className="flex items-center justify-between border-b border-mineshaft-400 pb-2">
|
||||
<h3 className="font-medium text-mineshaft-100">Sync Options</h3>
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 flex w-full flex-col gap-3 rounded-lg border px-4 py-3">
|
||||
<div className="border-mineshaft-400 flex items-center justify-between border-b pb-2">
|
||||
<h3 className="text-mineshaft-100 font-medium">Sync Options</h3>
|
||||
<ProjectPermissionCan I={ProjectPermissionSecretSyncActions.Edit} a={permissionSubject}>
|
||||
{(isAllowed) => (
|
||||
<IconButton
|
||||
|
||||
Reference in New Issue
Block a user