merge main

This commit is contained in:
x032205
2025-10-10 20:33:52 -04:00
parent a61536adbb
commit a804672042
1020 changed files with 23364 additions and 13891 deletions
@@ -754,13 +754,13 @@ const Page = () => {
if (!(currentProject?.version === ProjectVersion.V3))
return (
<div className="flex h-full w-full flex-col items-center justify-center px-6 text-mineshaft-50 dark:[color-scheme:dark]">
<div className="flex h-full w-full flex-col items-center justify-center px-6 text-mineshaft-50 dark:scheme-dark">
<SecretV2MigrationSection />
</div>
);
return (
<div className="container mx-auto flex max-w-7xl flex-col text-mineshaft-50 dark:[color-scheme:dark]">
<div className="container mx-auto flex max-w-7xl flex-col text-mineshaft-50 dark:scheme-dark">
<PageHeader
title="Secrets Management"
description={
@@ -847,7 +847,7 @@ const Page = () => {
<div
ref={tableRef}
className={twMerge(
"thin-scrollbar mt-3 overflow-y-auto overflow-x-hidden rounded-md bg-mineshaft-800 text-left text-sm text-bunker-300",
"mt-3 thin-scrollbar overflow-x-hidden overflow-y-auto rounded-md bg-mineshaft-800 text-left text-sm text-bunker-300",
isNotEmpty && "rounded-b-none"
)}
>
@@ -888,11 +888,11 @@ const Page = () => {
}`}
onMouseDown={handleMouseDown}
/>
<div className="pointer-events-none absolute -right-[0.04rem] top-2 z-30">
<div className="pointer-events-none absolute top-2 -right-[0.04rem] z-30">
<div className="h-5 w-0.5 rounded-[1.5px] bg-gray-400 opacity-50" />
</div>
<div
className="flex flex-shrink-0 items-center border-r border-mineshaft-600 py-2 pl-4"
className="flex shrink-0 items-center border-r border-mineshaft-600 py-2 pl-4"
style={{ width: colWidth }}
role="button"
tabIndex={0}
@@ -908,7 +908,7 @@ const Page = () => {
/>
</div>
</div>
<div className="flex-grow px-4 py-2">Value</div>
<div className="grow px-4 py-2">Value</div>
</div>
)}
{hasPathPolicies &&
@@ -923,7 +923,7 @@ const Page = () => {
<div className="flex items-center text-sm">
<FontAwesomeIcon
icon={faInfoCircle}
className="ml-[0.15rem] mr-[1.65rem] text-primary"
className="mr-[1.65rem] ml-[0.15rem] text-primary"
/>
<span>You do not have permission to read secrets in this folder</span>
</div>
@@ -943,7 +943,7 @@ const Page = () => {
<div className="flex items-center text-sm">
<FontAwesomeIcon
icon={faInfoCircle}
className="ml-[0.15rem] mr-[1.65rem] text-primary"
className="mr-[1.65rem] ml-[0.15rem] text-primary"
/>
<span>
You do not have permission to {!canEditSecrets ? "edit" : ""}
@@ -687,7 +687,7 @@ export const ActionBar = ({
size="sm"
variant="outline_bg"
className={twMerge(
"flex h-[2.5rem]",
"flex h-10",
isTableFiltered && "border-primary/40 bg-primary/10"
)}
leftIcon={
@@ -784,7 +784,7 @@ export const ActionBar = ({
{Boolean(filteredTags) && <Badge>{filteredTags} Applied</Badge>}
</div>
</DropdownSubMenuTrigger>
<DropdownSubMenuContent className="thin-scrollbar max-h-[20rem] overflow-y-auto rounded-l-none">
<DropdownSubMenuContent className="max-h-80 thin-scrollbar overflow-y-auto rounded-l-none">
<DropdownMenuLabel className="sticky top-0 bg-mineshaft-900">
<div className="flex w-full items-center justify-between">
<span>Filter by Secret Tags</span>
@@ -823,7 +823,7 @@ export const ActionBar = ({
Clear Filters
</Button>
)}
<div className="flex-grow" />
<div className="grow" />
<div>
{isProtectedBranch && (
<Tooltip content={`Protected by policy ${protectedBranchPolicyName}`}>
@@ -1066,7 +1066,7 @@ export const ActionBar = ({
</div>
<div
className={twMerge(
"h-0 flex-shrink-0 overflow-hidden transition-all",
"h-0 shrink-0 overflow-hidden transition-all",
isMultiSelectActive && "h-16"
)}
>
@@ -139,7 +139,7 @@ export const AwsElastiCacheInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -189,7 +189,7 @@ export const AwsElastiCacheInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -201,7 +201,7 @@ export const AwsElastiCacheInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Cluster name"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -195,7 +195,7 @@ export const AwsIamInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -245,7 +245,7 @@ export const AwsIamInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -318,7 +318,7 @@ export const AwsIamInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="AWS Access Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -333,7 +333,7 @@ export const AwsIamInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="AWS Secret Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -352,7 +352,7 @@ export const AwsIamInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Assume Role ARN"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -371,7 +371,7 @@ export const AwsIamInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="AWS IAM Path"
className="flex-grow"
className="grow"
isOptional
isError={Boolean(error?.message)}
errorText={error?.message}
@@ -391,7 +391,7 @@ export const AwsIamInputForm = ({
className={
credentialType === DynamicSecretAwsIamCredentialType.TemporaryCredentials
? "w-full"
: "flex-grow"
: "grow"
}
isError={Boolean(error?.message)}
errorText={error?.message}
@@ -149,7 +149,7 @@ export const AzureEntraIdInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -199,11 +199,11 @@ export const AzureEntraIdInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -224,7 +224,7 @@ export const AzureEntraIdInputForm = ({
</div>
</div>
<div className="flex flex-col">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -245,7 +245,7 @@ export const AzureEntraIdInputForm = ({
</div>
</div>
<div className="flex flex-col">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -267,7 +267,7 @@ export const AzureEntraIdInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Select Users
</div>
<div className="mb-4 flex items-center text-sm font-normal text-mineshaft-400">
@@ -201,7 +201,7 @@ export const AzureSqlDatabaseInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -253,7 +253,7 @@ export const AzureSqlDatabaseInputForm = ({
</div>
<MetadataForm control={control} />
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div>
@@ -316,7 +316,7 @@ export const AzureSqlDatabaseInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -340,7 +340,7 @@ export const AzureSqlDatabaseInputForm = ({
/>
</div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="provider.username"
@@ -356,7 +356,7 @@ export const AzureSqlDatabaseInputForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="provider.password"
@@ -371,7 +371,7 @@ export const AzureSqlDatabaseInputForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="provider.database"
@@ -389,7 +389,7 @@ export const AzureSqlDatabaseInputForm = ({
</div>
</div>
<div>
<div className="mb-2 mt-2">
<div className="mt-2 mb-2">
<Controller
control={control}
name="provider.sslEnabled"
@@ -534,7 +534,7 @@ export const AzureSqlDatabaseInputForm = ({
</AccordionContent>
</AccordionItem>
</Accordion>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>Password Configuration (optional)</AccordionTrigger>
<AccordionContent>
@@ -140,7 +140,7 @@ export const CassandraInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -190,7 +190,7 @@ export const CassandraInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -202,7 +202,7 @@ export const CassandraInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -68,7 +68,7 @@ const BucketScopesConfiguration = ({
{scopeFields.map((_scope: any, scopeIndex: number) => (
<div
key={`scope-${scopeIndex + 1}`}
className="space-y-3 rounded border border-mineshaft-600 bg-mineshaft-700 p-3"
className="space-y-3 rounded-sm border border-mineshaft-600 bg-mineshaft-700 p-3"
>
<div className="flex items-center justify-between">
<h5 className="text-xs font-medium text-mineshaft-200">Scope {scopeIndex + 1}</h5>
@@ -146,7 +146,7 @@ const BucketScopesConfiguration = ({
{(!scopeFields[scopeIndex]?.collections ||
scopeFields[scopeIndex].collections.length === 0) && (
<div className="text-xs italic text-mineshaft-400">
<div className="text-xs text-mineshaft-400 italic">
No collections specified (access to all collections in scope)
</div>
)}
@@ -155,7 +155,7 @@ const BucketScopesConfiguration = ({
))}
{scopeFields.length === 0 && (
<div className="rounded border border-dashed border-mineshaft-600 bg-mineshaft-700 p-4 text-center">
<div className="rounded-sm border border-dashed border-mineshaft-600 bg-mineshaft-700 p-4 text-center">
<p className="mb-2 text-xs text-mineshaft-400">
No scopes configured (access to all scopes in bucket)
</p>
@@ -412,7 +412,7 @@ export const CouchbaseInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -462,7 +462,7 @@ export const CouchbaseInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -639,7 +639,7 @@ export const CouchbaseInputForm = ({
(bucketsValue as any[]).map((_, bucketIndex) => (
<div
key={`bucket-${bucketIndex + 1}`}
className="space-y-4 rounded border border-mineshaft-600 bg-mineshaft-800 p-4"
className="space-y-4 rounded-sm border border-mineshaft-600 bg-mineshaft-800 p-4"
>
<div className="flex items-center justify-between">
<h4 className="text-sm font-medium text-mineshaft-200">
@@ -683,7 +683,7 @@ export const CouchbaseInputForm = ({
))}
{(!Array.isArray(bucketsValue) || bucketsValue.length === 0) && (
<div className="rounded border border-dashed border-mineshaft-600 p-8 text-center">
<div className="rounded-sm border border-dashed border-mineshaft-600 p-8 text-center">
<p className="mb-2 text-sm text-mineshaft-400">No buckets configured</p>
<Button
type="button"
@@ -710,7 +710,7 @@ export const CouchbaseInputForm = ({
label="API Key"
>
<SecretInput
containerClassName="text-gray-400 group-focus-within:!border-primary-400/50 border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
containerClassName="text-gray-400 group-focus-within:border-primary-400/50! border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
value={value}
valueAlwaysHidden
rows={1}
@@ -741,7 +741,7 @@ export const CouchbaseInputForm = ({
</FormControl>
)}
/>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>
<div className="flex items-center space-x-2">
@@ -211,7 +211,7 @@ export const CreateDynamicSecretForm = ({
rel="noopener noreferrer"
>
<div className="inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mb-[0.03rem] mr-1 text-[12px]" />
<FontAwesomeIcon icon={faBookOpen} className="mr-1 mb-[0.03rem] text-[12px]" />
<span>Docs</span>
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
@@ -238,7 +238,7 @@ export const CreateDynamicSecretForm = ({
{DYNAMIC_SECRET_LIST.map(({ icon, provider, title }) => (
<div
key={`dynamic-secret-provider-${provider}`}
className="flex h-32 w-32 cursor-pointer flex-col items-center space-y-4 rounded border border-mineshaft-500 bg-bunker-600 p-6 transition-all hover:border-primary/70 hover:bg-primary/10 hover:text-white"
className="flex h-32 w-32 cursor-pointer flex-col items-center space-y-4 rounded-sm border border-mineshaft-500 bg-bunker-600 p-6 transition-all hover:border-primary/70 hover:bg-primary/10 hover:text-white"
role="button"
tabIndex={0}
onClick={() => {
@@ -253,7 +253,7 @@ export const CreateDynamicSecretForm = ({
}}
>
{icon}
<div className="whitespace-pre-wrap text-center text-sm">{title}</div>
<div className="text-center text-sm whitespace-pre-wrap">{title}</div>
</div>
))}
</div>
@@ -162,7 +162,7 @@ export const ElasticSearchInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -212,7 +212,7 @@ export const ElasticSearchInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -224,7 +224,7 @@ export const ElasticSearchInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -367,7 +367,7 @@ export const ElasticSearchInputForm = ({
<div className="flex h-9 items-center gap-2">
<Input
placeholder="Insert role name, (superuser, kibana_admin, custom_role)"
className="mb-0 flex-grow"
className="mb-0 grow"
{...field}
/>
<IconButton
@@ -112,7 +112,7 @@ export const GcpIamInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -162,7 +162,7 @@ export const GcpIamInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
@@ -174,7 +174,7 @@ export const GcpIamInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Service Account Email"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
helperText={
@@ -99,7 +99,7 @@ export const GithubInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -125,7 +125,7 @@ export const GithubInputForm = ({
<FontAwesomeIcon
icon={faQuestionCircle}
size="sm"
className="relative bottom-px right-1"
className="relative right-1 bottom-px"
/>
</Tooltip>
}
@@ -137,7 +137,7 @@ export const GithubInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
@@ -148,7 +148,7 @@ export const GithubInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="App ID"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
isRequired
@@ -164,7 +164,7 @@ export const GithubInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Installation ID"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
isRequired
@@ -180,14 +180,14 @@ export const GithubInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="App Private Key PEM"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
isRequired
>
<SecretInput
{...field}
containerClassName="text-gray-400 group-focus-within:!border-primary-400/50 border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
containerClassName="text-gray-400 group-focus-within:border-primary-400/50! border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
/>
</FormControl>
)}
@@ -236,7 +236,7 @@ export const KubernetesInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -286,12 +286,12 @@ export const KubernetesInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<div>
<OrgPermissionCan
I={OrgGatewayPermissionActions.AttachGateways}
@@ -599,7 +599,7 @@ export const KubernetesInputForm = ({
<Input
{...control.register(`provider.audiences.${index}`)}
placeholder="Enter audience"
className="flex-grow"
className="grow"
/>
<IconButton
onClick={() => remove(index)}
@@ -166,7 +166,7 @@ export const LdapInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -216,12 +216,12 @@ export const LdapInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="provider.url"
@@ -171,7 +171,7 @@ export const MongoAtlasInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -221,7 +221,7 @@ export const MongoAtlasInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -233,7 +233,7 @@ export const MongoAtlasInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Admin Public Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -248,7 +248,7 @@ export const MongoAtlasInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Admin Private Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -276,7 +276,7 @@ export const MongoAtlasInputForm = ({
<div className="mb-3 flex flex-col space-y-2">
{roleFields.fields.map(({ id: roleFieldId }, i) => (
<div key={roleFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
{i === 0 && <span className="text-xs text-mineshaft-400">Database Name</span>}
<Controller
control={control}
@@ -292,7 +292,7 @@ export const MongoAtlasInputForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Collection Name"
@@ -314,7 +314,7 @@ export const MongoAtlasInputForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Role"
@@ -331,7 +331,7 @@ export const MongoAtlasInputForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Input {...field} />
</FormControl>
@@ -399,7 +399,7 @@ export const MongoAtlasInputForm = ({
<div className="mb-2 flex flex-col space-y-2">
{scopeFields.fields.map(({ id: scopeFieldId }, i) => (
<div key={scopeFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Label"
@@ -415,14 +415,14 @@ export const MongoAtlasInputForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Input {...field} placeholder="Cluster or data lake id" />
</FormControl>
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && <span className="text-xs text-mineshaft-400">Type</span>}
<Controller
control={control}
@@ -431,7 +431,7 @@ export const MongoAtlasInputForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Select
defaultValue={field.value}
@@ -148,7 +148,7 @@ export const MongoDBDatabaseInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -198,7 +198,7 @@ export const MongoDBDatabaseInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -210,7 +210,7 @@ export const MongoDBDatabaseInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -283,10 +283,10 @@ export const MongoDBDatabaseInputForm = ({
tooltipText={`Human-readable label that identifies a group of privileges assigned to a database user. This value can either be a built-in role or a custom role.
Built-in: atlasAdmin, backup, clusterMonitor, dbAdmin, dbAdminAnyDatabase, enableSharding, read, readAnyDatabase, readWrite, readWriteAnyDatabase.`}
/>
<div className="mb-3 mt-1 flex flex-col space-y-2">
<div className="mt-1 mb-3 flex flex-col space-y-2">
{roleFields.fields.map(({ id: roleFieldId }, i) => (
<div key={roleFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name={`provider.roles.${i}.roleName`}
@@ -294,7 +294,7 @@ export const MongoDBDatabaseInputForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Input {...field} />
</FormControl>
@@ -151,7 +151,7 @@ export const RabbitMqInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -201,7 +201,7 @@ export const RabbitMqInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -213,7 +213,7 @@ export const RabbitMqInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -374,7 +374,7 @@ export const RabbitMqInputForm = ({
<div className="flex h-9 items-center gap-2">
<Input
placeholder="Insert tag name, (management, policymaker, etc.)"
className="mb-0 flex-grow"
className="mb-0 grow"
{...field}
/>
<IconButton
@@ -133,7 +133,7 @@ export const RedisInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -183,7 +183,7 @@ export const RedisInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -195,7 +195,7 @@ export const RedisInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -134,7 +134,7 @@ sp_droplogin '{{username}}';`
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -184,7 +184,7 @@ sp_droplogin '{{username}}';`
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -196,7 +196,7 @@ sp_droplogin '{{username}}';`
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -134,7 +134,7 @@ DROP USER {{username}};`,
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -184,7 +184,7 @@ DROP USER {{username}};`,
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -196,7 +196,7 @@ DROP USER {{username}};`,
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -131,7 +131,7 @@ export const SnowflakeInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -181,7 +181,7 @@ export const SnowflakeInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -193,7 +193,7 @@ export const SnowflakeInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Account Identifier"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -208,7 +208,7 @@ export const SnowflakeInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Organization Identifier"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -225,7 +225,7 @@ export const SnowflakeInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="User"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -240,7 +240,7 @@ export const SnowflakeInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Password"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -256,7 +256,7 @@ export const SqlDatabaseInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -308,7 +308,7 @@ export const SqlDatabaseInputForm = ({
</div>
<MetadataForm control={control} />
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div>
@@ -394,7 +394,7 @@ export const SqlDatabaseInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -462,7 +462,7 @@ export const SqlDatabaseInputForm = ({
</div>
<div>
{selectedClient === SqlProviders.MsSQL && (
<div className="mb-2 mt-2">
<div className="mt-2 mb-2">
<Controller
control={control}
name="provider.sslEnabled"
@@ -587,7 +587,7 @@ export const SqlDatabaseInputForm = ({
</AccordionContent>
</AccordionItem>
</Accordion>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>Password Configuration (optional)</AccordionTrigger>
<AccordionContent>
@@ -124,7 +124,7 @@ export const TotpInputForm = ({
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -142,7 +142,7 @@ export const TotpInputForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -183,7 +183,7 @@ export const TotpInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="OTP URL"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -201,7 +201,7 @@ export const TotpInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Secret Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -217,7 +217,7 @@ export const TotpInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Period"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -236,7 +236,7 @@ export const TotpInputForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Digits"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -172,7 +172,7 @@ GRANT CREATE ON SCHEMA public TO {{username}};`,
<form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -222,7 +222,7 @@ GRANT CREATE ON SCHEMA public TO {{username}};`,
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div>
@@ -285,7 +285,7 @@ GRANT CREATE ON SCHEMA public TO {{username}};`,
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -415,7 +415,7 @@ GRANT CREATE ON SCHEMA public TO {{username}};`,
</AccordionContent>
</AccordionItem>
</Accordion>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>Password Configuration (optional)</AccordionTrigger>
<AccordionContent>
@@ -114,7 +114,7 @@ export const FolderForm = ({
rows={3}
ref={descriptionRef}
onInput={handleInput}
className="thin-scrollbar w-full !resize-none bg-mineshaft-900"
className="thin-scrollbar w-full resize-none! bg-mineshaft-900"
maxLength={255}
/>
</FormControl>
@@ -278,7 +278,7 @@ export const ReplicateFolderFromBoard = ({
<FormControl
tooltipText="The folder to use as a root for replication. Using /foo as a root for /foo/bar will result in /bar being copied to this context."
label="Source Root Path"
className="flex-grow"
className="grow"
isRequired
>
<SecretPathInput
@@ -296,7 +296,7 @@ export const ReplicateFolderFromBoard = ({
render={({ field: { onChange } }) => (
<FormControl
tooltipText="The folders and secrets to replicate into this context"
className="flex-grow"
className="grow"
label="Affected Subjects"
isRequired
>
@@ -109,11 +109,11 @@ const Folder: React.FC<FolderProps> = ({
return (
<div className={`folder-container ml-${level > 0 ? "4" : 0}`}>
<Collapsible open={open} onOpenChange={setOpen}>
<div className="group flex items-center rounded px-2 py-1">
<div className="group flex items-center rounded-sm px-2 py-1">
<CollapsibleTrigger asChild>
<button
type="button"
className="mr-1 flex h-6 w-6 items-center justify-center rounded focus:outline-none"
className="mr-1 flex h-6 w-6 items-center justify-center rounded-sm focus:outline-hidden"
disabled={!hasContents}
aria-label={open ? "Collapse folder" : "Expand folder"}
>
@@ -142,7 +142,7 @@ const Folder: React.FC<FolderProps> = ({
<label
htmlFor={`folder-${path}`}
className={`ml-2 flex-1 cursor-pointer truncate ${basePath ? "italic text-mineshaft-300" : ""}`}
className={`ml-2 flex-1 cursor-pointer truncate ${basePath ? "text-mineshaft-300 italic" : ""}`}
title={displayName}
>
{displayName || `${basePath}`}
@@ -157,10 +157,10 @@ const Folder: React.FC<FolderProps> = ({
<CollapsibleContent className="overflow-hidden transition-all duration-300 ease-in-out">
<div className="relative mt-1">
<div className="absolute bottom-0 left-5 top-0 w-px bg-mineshaft-600" />
<div className="absolute top-0 bottom-0 left-5 w-px bg-mineshaft-600" />
{structure.items.map((item) => (
<div key={item.id} className="group ml-6 flex items-center rounded px-2 py-1">
<div className="ml-6 mr-2">
<div key={item.id} className="group ml-6 flex items-center rounded-sm px-2 py-1">
<div className="mr-2 ml-6">
<FontAwesomeIcon icon={faKey} className="h-3 w-3" />
</div>
{!isDisabled && (
@@ -295,7 +295,7 @@ export const SecretTreeView: React.FC<TreeViewProps> = ({
return (
<div className="flex w-full items-start gap-3 rounded-lg border border-mineshaft-600 bg-mineshaft-900">
<div className={`w-full rounded-lg shadow-sm ${className}`}>
<div className={`w-full rounded-lg shadow-xs ${className}`}>
<div className="h-[25vh] overflow-auto p-3">
{isEmptyData ? (
<div className="flex h-full w-full items-center justify-center text-center text-mineshaft-300">
@@ -321,7 +321,7 @@ export const SecretTreeView: React.FC<TreeViewProps> = ({
</div>
{!isDisabled && (
<div className="flex justify-end pb-2 pr-2 pt-2">
<div className="flex justify-end pt-2 pr-2 pb-2">
<h3 className="flex items-center text-mineshaft-400">
{selectedItems.length} Item{selectedItems.length === 1 ? "" : "s"} Selected
</h3>
@@ -343,13 +343,13 @@ export const CommitForm: React.FC<CommitFormProps> = ({
</div>
{/* Right Buttons */}
<div className="ml-6 mt-0.5 flex items-center gap-3">
<div className="mt-0.5 ml-6 flex items-center gap-3">
<Button
size="sm"
onClick={() => clearAllPendingChanges({ projectId, environment, secretPath })}
isDisabled={totalChangesCount === 0}
variant="outline_bg"
className="px-4 hover:border-red/40 hover:bg-red/[0.1]"
className="px-4 hover:border-red/40 hover:bg-red/10"
>
Discard
</Button>
@@ -392,7 +392,7 @@ export const CommitForm: React.FC<CommitFormProps> = ({
{/* Folder Changes */}
{pendingChanges.folders.length > 0 && (
<div>
<h4 className="mb-4 flex items-center gap-2 border-b border-mineshaft-700 pb-2 text-sm font-semibold text-mineshaft-200">
<h4 className="mb-4 flex items-center gap-2 border-b border-mineshaft-700 pb-2 text-sm font-medium text-mineshaft-200">
<FontAwesomeIcon icon={faFolder} className="text-mineshaft-300" />
Folders ({pendingChanges.folders.length})
</h4>
@@ -413,7 +413,7 @@ export const CommitForm: React.FC<CommitFormProps> = ({
{/* Secret Changes */}
{pendingChanges.secrets.length > 0 && (
<div>
<h4 className="mb-4 flex items-center gap-2 border-b border-mineshaft-700 pb-2 text-sm font-semibold text-mineshaft-200">
<h4 className="mb-4 flex items-center gap-2 border-b border-mineshaft-700 pb-2 text-sm font-medium text-mineshaft-200">
<FontAwesomeIcon icon={faKey} className="mr-1 text-mineshaft-300" />
Secrets ({pendingChanges.secrets.length})
</h4>
@@ -303,7 +303,7 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
onChangePerPage={handlePerPageChange}
/>
)}
<div className="thin-scrollbar flex flex-1 flex-col overflow-y-auto">
<div className="flex thin-scrollbar flex-1 flex-col overflow-y-auto">
<TableContainer
ref={tableRef}
className={twMerge(
@@ -344,14 +344,14 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
}`}
onMouseDown={handleMouseDown}
/>
<div className="pointer-events-none absolute -right-[0.02rem] top-[0.67rem] z-30">
<div className="pointer-events-none absolute top-[0.67rem] -right-[0.02rem] z-30">
<div className="h-5 w-0.5 rounded-[1.5px] bg-gray-400 opacity-50" />
</div>
<div className="flex h-full items-center border-b-2 border-r border-mineshaft-500 bg-mineshaft-700 bg-clip-padding p-0 px-4 py-2.5 text-sm normal-case">
<div className="flex h-full items-center border-r border-b-2 border-mineshaft-500 bg-mineshaft-700 bg-clip-padding p-0 px-4 py-2.5 text-sm normal-case">
Name
<IconButton
variant="plain"
className="ml-1 mt-[0.1rem]"
className="mt-[0.1rem] ml-1"
ariaLabel="sort"
onClick={() =>
setOrderDirection((prev) =>
@@ -376,7 +376,7 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
return (
<Th
className="whitespace-nowrap border-none p-0 text-center"
className="border-none p-0 text-center whitespace-nowrap"
key={`environment-${slug}`}
>
<div
@@ -398,7 +398,7 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
>
<Badge
variant="primary"
className="-mt-[0.05rem] flex h-4 items-center gap-x-1 pt-[0.1rem] font-normal leading-3"
className="-mt-[0.05rem] flex h-4 items-center gap-x-1 pt-[0.1rem] leading-3 font-normal"
>
<FontAwesomeIcon icon={faWarning} className="-mt-[0.1rem] w-2.5" />
{missingKeyCount}
@@ -499,7 +499,7 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
size="sm"
variant="outline_bg"
className={twMerge(
"flex h-[2.5rem]",
"flex h-10",
isTableFiltered && "border-primary/40 bg-primary/10"
)}
leftIcon={
@@ -513,7 +513,7 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent
className="thin-scrollbar max-h-[70vh] overflow-y-auto"
className="max-h-[70vh] thin-scrollbar overflow-y-auto"
align="end"
sideOffset={2}
>
@@ -574,7 +574,7 @@ export const CompareEnvironments = ({ secretPath }: Props) => {
</DropdownMenu>
)}
</div>
<div className="!z-[99999999]">
<div className="z-99999999!">
<FormLabel label="Select Environments to Compare" />
<FilterableSelect
value={selectedEnvironments}
@@ -76,7 +76,7 @@ export const SecretRotationRow = ({
style={{ minWidth: tableWidth, maxWidth: tableWidth }}
className="sticky left-0 bg-clip-padding px-0 py-0"
>
<div className="flex !h-[40px] items-center justify-between gap-x-2 bg-mineshaft-800 px-4">
<div className="flex h-[40px]! items-center justify-between gap-x-2 bg-mineshaft-800 px-4">
<div className="w-full">
<div className="flex w-full flex-wrap items-center gap-x-2.5">
<span>{envName}</span>
@@ -110,7 +110,7 @@ export const SecretRotationRow = ({
</Tooltip>
</div>
<TableContainer className="rounded-none border-0">
<table className="secret-table w-full border-b-0 !bg-mineshaft-900">
<table className="secret-table w-full border-b-0 bg-mineshaft-900!">
<tbody className="!last:border-b-0 w-full border-t-2 border-mineshaft-600">
{secrets.map((secret, index) => {
return (
@@ -129,7 +129,7 @@ export const SecretRotationRow = ({
style={{
width: colWidth
}}
className="!h-[1px] border-none !p-0"
className="h-px! border-none p-0!"
>
<div
className="flex h-full flex-1 items-center border-r border-mineshaft-500 px-4 py-1"
@@ -137,15 +137,15 @@ export const SecretRotationRow = ({
width: colWidth
}}
>
<span className={twMerge(!secret && "blur", "truncate")}>
<span className={twMerge(!secret && "blur-sm", "truncate")}>
{secret?.key ?? "********"}
</span>
</div>
</td>
<td className="!h-[40px] !px-4">
<td className="h-[40px]! px-4!">
{/* eslint-disable-next-line no-nested-ternary */}
{!secret ? (
<div className="h-full pl-4 blur">********</div>
<div className="h-full pl-4 blur-sm">********</div>
) : secret.secretValueHidden ? (
<Blur
className="py-0"
@@ -30,7 +30,7 @@ export const EnvironmentSecretRow = ({
<FontAwesomeIcon className="pl-2" size="sm" icon={faEyeSlash} />
</Tooltip>
)}
<div className="flex-1 pl-3 pr-2">
<div className="flex-1 pr-2 pl-3">
<InfisicalSecretInput
onChange={() => {}}
isReadOnly
@@ -143,7 +143,7 @@ export const SecretRow = ({
<th style={{ padding: "0.5rem 1rem" }} className="border-none">
Value
</th>
<div className="absolute right-3 top-[4px] ml-auto mr-1 mt-1 w-min">
<div className="absolute top-[4px] right-3 mt-1 mr-1 ml-auto w-min">
<Tooltip
side="left"
content={isSecretVisible ? "Hide Values" : "Reveal Values"}
@@ -173,7 +173,7 @@ export const SecretRow = ({
className="h-full hover:bg-mineshaft-700/70"
>
<td
className="h-[1px] border-none !p-0"
className="h-px border-none p-0!"
style={{
width: colWidth
}}
@@ -183,7 +183,7 @@ export const SecretRow = ({
style={{
width: colWidth
}}
className="flex h-full min-h-[40px] w-[8rem] items-center space-x-2 border-r border-mineshaft-500 px-4"
className="flex h-full min-h-[40px] w-32 items-center space-x-2 border-r border-mineshaft-500 px-4"
>
<span className="truncate">{name}</span>
{isImportedSecret && (
@@ -37,7 +37,7 @@ const OutputDisplay = ({
return (
<div className="relative">
<FormControl label={label} className="flex-grow" helperText={helperText}>
<FormControl label={label} className="grow" helperText={helperText}>
<SecretInput
isReadOnly
value={value}
@@ -49,7 +49,7 @@ const OutputDisplay = ({
ariaLabel="Copy to clipboard"
variant="plain"
size="md"
className="absolute right-2 top-7"
className="absolute top-7 right-2"
onClick={() => {
navigator.clipboard.writeText(value as string);
setCopyText("Copied");
@@ -291,7 +291,7 @@ const renderOutputForm = (
value={PASSWORD}
helperText="Important: Copy these credentials now. You will not be able to see them again after you close the modal."
/>
<FormControl label="DNs" className="flex-grow">
<FormControl label="DNs" className="grow">
<SecretInput
isReadOnly
isVisible
@@ -118,7 +118,7 @@ export const DynamicSecretListView = ({
<div className="flex w-11 items-center px-5 py-3 text-yellow-700">
<FontAwesomeIcon icon={faFingerprint} />
</div>
<div className="flex flex-grow items-center px-4 py-3" role="button" tabIndex={0}>
<div className="flex grow items-center px-4 py-3" role="button" tabIndex={0}>
{secret.name}
<Tag className="ml-4 px-2 py-0 text-xs normal-case">
{formatProviderName(secret.type)}
@@ -134,7 +134,7 @@ export const EditDynamicSecretAwsElastiCacheProviderForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -181,7 +181,7 @@ export const EditDynamicSecretAwsElastiCacheProviderForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -193,7 +193,7 @@ export const EditDynamicSecretAwsElastiCacheProviderForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Cluster name"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -174,7 +174,7 @@ export const EditDynamicSecretAwsIamForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -292,7 +292,7 @@ export const EditDynamicSecretAwsIamForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="AWS Access Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -307,7 +307,7 @@ export const EditDynamicSecretAwsIamForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="AWS Secret Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -326,7 +326,7 @@ export const EditDynamicSecretAwsIamForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Assume Role ARN"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -345,7 +345,7 @@ export const EditDynamicSecretAwsIamForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="AWS IAM Path"
className="flex-grow"
className="grow"
isOptional
isError={Boolean(error?.message)}
errorText={error?.message}
@@ -365,7 +365,7 @@ export const EditDynamicSecretAwsIamForm = ({
className={
credentialType === DynamicSecretAwsIamCredentialType.TemporaryCredentials
? "w-full"
: "flex-grow"
: "grow"
}
isError={Boolean(error?.message)}
errorText={error?.message}
@@ -109,7 +109,7 @@ export const EditDynamicSecretAzureEntraIdForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -160,7 +160,7 @@ export const EditDynamicSecretAzureEntraIdForm = ({
</div>
</div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -175,7 +175,7 @@ export const EditDynamicSecretAzureEntraIdForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -193,7 +193,7 @@ export const EditDynamicSecretAzureEntraIdForm = ({
</div>
</div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -209,7 +209,7 @@ export const EditDynamicSecretAzureEntraIdForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -230,7 +230,7 @@ export const EditDynamicSecretAzureEntraIdForm = ({
</div>
</div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -196,7 +196,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -245,7 +245,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
</div>
<MetadataForm control={control} />
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div>
@@ -306,7 +306,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -329,7 +329,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
/>
</div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="inputs.username"
@@ -344,7 +344,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="inputs.password"
@@ -359,7 +359,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="inputs.database"
@@ -376,7 +376,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
</div>
</div>
<div>
<div className="mb-2 mt-2">
<div className="mt-2 mb-2">
<Controller
control={control}
name="inputs.sslEnabled"
@@ -520,7 +520,7 @@ export const EditDynamicSecretAzureSqlDatabaseForm = ({
</AccordionContent>
</AccordionItem>
</Accordion>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>Password Configuration (optional)</AccordionTrigger>
<AccordionContent>
@@ -136,7 +136,7 @@ export const EditDynamicSecretCassandraForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -193,7 +193,7 @@ export const EditDynamicSecretCassandraForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -68,7 +68,7 @@ const BucketScopesConfiguration = ({
{scopeFields.map((_scope: any, scopeIndex: number) => (
<div
key={`scope-${scopeIndex + 1}`}
className="space-y-3 rounded border border-mineshaft-600 bg-mineshaft-700 p-3"
className="space-y-3 rounded-sm border border-mineshaft-600 bg-mineshaft-700 p-3"
>
<div className="flex items-center justify-between">
<h5 className="text-xs font-medium text-mineshaft-200">Scope {scopeIndex + 1}</h5>
@@ -145,7 +145,7 @@ const BucketScopesConfiguration = ({
{(!scopeFields[scopeIndex]?.collections ||
scopeFields[scopeIndex].collections.length === 0) && (
<div className="text-xs italic text-mineshaft-400">
<div className="text-xs text-mineshaft-400 italic">
No collections specified (access to all collections in scope)
</div>
)}
@@ -154,7 +154,7 @@ const BucketScopesConfiguration = ({
))}
{scopeFields.length === 0 && (
<div className="rounded border border-dashed border-mineshaft-600 bg-mineshaft-700 p-4 text-center">
<div className="rounded-sm border border-dashed border-mineshaft-600 bg-mineshaft-700 p-4 text-center">
<p className="mb-2 text-xs text-mineshaft-400">
No scopes configured (access to all scopes in bucket)
</p>
@@ -424,7 +424,7 @@ export const EditDynamicSecretCouchbaseForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -474,7 +474,7 @@ export const EditDynamicSecretCouchbaseForm = ({
</div>
<MetadataForm control={control} />
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col space-y-4">
@@ -646,7 +646,7 @@ export const EditDynamicSecretCouchbaseForm = ({
(bucketsValue as any[]).map((_, bucketIndex) => (
<div
key={`bucket-${bucketIndex + 1}`}
className="space-y-4 rounded border border-mineshaft-600 bg-mineshaft-800 p-4"
className="space-y-4 rounded-sm border border-mineshaft-600 bg-mineshaft-800 p-4"
>
<div className="flex items-center justify-between">
<h4 className="text-sm font-medium text-mineshaft-200">
@@ -690,7 +690,7 @@ export const EditDynamicSecretCouchbaseForm = ({
))}
{(!Array.isArray(bucketsValue) || bucketsValue.length === 0) && (
<div className="rounded border border-dashed border-mineshaft-600 p-8 text-center">
<div className="rounded-sm border border-dashed border-mineshaft-600 p-8 text-center">
<p className="mb-2 text-sm text-mineshaft-400">No buckets configured</p>
<Button
type="button"
@@ -717,7 +717,7 @@ export const EditDynamicSecretCouchbaseForm = ({
label="API Key"
>
<SecretInput
containerClassName="text-gray-400 group-focus-within:!border-primary-400/50 border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
containerClassName="text-gray-400 group-focus-within:border-primary-400/50! border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
value={value}
valueAlwaysHidden
rows={1}
@@ -745,7 +745,7 @@ export const EditDynamicSecretCouchbaseForm = ({
</FormControl>
)}
/>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>
<div className="flex items-center space-x-2">
@@ -160,7 +160,7 @@ export const EditDynamicSecretElasticSearchForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -210,7 +210,7 @@ export const EditDynamicSecretElasticSearchForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -222,7 +222,7 @@ export const EditDynamicSecretElasticSearchForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -353,11 +353,11 @@ export const EditDynamicSecretElasticSearchForm = ({
key={`role-${i}`}
render={({ field, fieldState: { error } }) => (
<div className="flex items-center gap-2">
<div className="flex-grow">
<div className="grow">
<FormControl isError={Boolean(error?.message)} errorText={error?.message}>
<Input
placeholder="Insert role name, (superuser, kibana_admin, custom_role)"
className="mb-0 flex-grow"
className="mb-0 grow"
{...field}
/>
</FormControl>
@@ -108,7 +108,7 @@ export const EditDynamicSecretGcpIamForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -155,7 +155,7 @@ export const EditDynamicSecretGcpIamForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
@@ -165,7 +165,7 @@ export const EditDynamicSecretGcpIamForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Service Account Email"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -90,7 +90,7 @@ export const EditDynamicSecretGithubForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -115,7 +115,7 @@ export const EditDynamicSecretGithubForm = ({
<FontAwesomeIcon
icon={faQuestionCircle}
size="sm"
className="relative bottom-px right-1"
className="relative right-1 bottom-px"
/>
</Tooltip>
}
@@ -127,7 +127,7 @@ export const EditDynamicSecretGithubForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
@@ -138,7 +138,7 @@ export const EditDynamicSecretGithubForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="App ID"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
isRequired
@@ -154,7 +154,7 @@ export const EditDynamicSecretGithubForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Installation ID"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
isRequired
@@ -170,14 +170,14 @@ export const EditDynamicSecretGithubForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="App Private Key PEM"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
isRequired
>
<SecretInput
{...field}
containerClassName="text-gray-400 group-focus-within:!border-primary-400/50 border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
containerClassName="text-gray-400 group-focus-within:border-primary-400/50! border border-mineshaft-500 bg-mineshaft-900 px-2.5 py-1.5"
/>
</FormControl>
)}
@@ -228,7 +228,7 @@ export const EditDynamicSecretKubernetesForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -278,12 +278,12 @@ export const EditDynamicSecretKubernetesForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<div>
<OrgPermissionCan
I={OrgGatewayPermissionActions.AttachGateways}
@@ -597,7 +597,7 @@ export const EditDynamicSecretKubernetesForm = ({
<Input
{...control.register(`inputs.audiences.${index}`)}
placeholder="Enter audience"
className="flex-grow"
className="grow"
/>
<IconButton
onClick={() => remove(index)}
@@ -152,7 +152,7 @@ export const EditDynamicSecretLdapForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -175,7 +175,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -222,7 +222,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -234,7 +234,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Admin Public Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -249,7 +249,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Admin Private Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -277,7 +277,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
<div className="mb-3 flex flex-col space-y-2">
{roleFields.fields.map(({ id: roleFieldId }, i) => (
<div key={roleFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
{i === 0 && <span className="text-xs text-mineshaft-400">Database Name</span>}
<Controller
control={control}
@@ -293,7 +293,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Collection Name"
@@ -315,7 +315,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Role"
@@ -332,7 +332,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Input {...field} />
</FormControl>
@@ -399,7 +399,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
<div className="mb-2 flex flex-col space-y-2">
{scopeFields.fields.map(({ id: scopeFieldId }, i) => (
<div key={scopeFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Label"
@@ -415,14 +415,14 @@ export const EditDynamicSecretMongoAtlasForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Input {...field} placeholder="Cluster or data lake id" />
</FormControl>
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && <span className="text-xs text-mineshaft-400">Type</span>}
<Controller
control={control}
@@ -431,7 +431,7 @@ export const EditDynamicSecretMongoAtlasForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Select
defaultValue={field.value}
@@ -146,7 +146,7 @@ export const EditDynamicSecretMongoDBForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -193,7 +193,7 @@ export const EditDynamicSecretMongoDBForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -205,7 +205,7 @@ export const EditDynamicSecretMongoDBForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -278,10 +278,10 @@ export const EditDynamicSecretMongoDBForm = ({
tooltipText={`Human-readable label that identifies a group of privileges assigned to a database user. This value can either be a built-in role or a custom role.
Built-in: atlasAdmin, backup, clusterMonitor, dbAdmin, dbAdminAnyDatabase, enableSharding, read, readAnyDatabase, readWrite, readWriteAnyDatabase.`}
/>
<div className="mb-3 mt-1 flex flex-col space-y-2">
<div className="mt-1 mb-3 flex flex-col space-y-2">
{roleFields.fields.map(({ id: roleFieldId }, i) => (
<div key={roleFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name={`inputs.roles.${i}.roleName`}
@@ -289,7 +289,7 @@ export const EditDynamicSecretMongoDBForm = ({
<FormControl
isError={Boolean(error?.message)}
errorText={error?.message}
className="mb-0 flex-grow"
className="mb-0 grow"
>
<Input {...field} />
</FormControl>
@@ -136,7 +136,7 @@ export const EditDynamicSecretRabbitMqForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -186,7 +186,7 @@ export const EditDynamicSecretRabbitMqForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -198,7 +198,7 @@ export const EditDynamicSecretRabbitMqForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -359,7 +359,7 @@ export const EditDynamicSecretRabbitMqForm = ({
<div className="flex h-9 items-center gap-2">
<Input
placeholder="Insert tag name, (management, policymaker, etc.)"
className="mb-0 flex-grow"
className="mb-0 grow"
{...field}
/>
<IconButton
@@ -136,7 +136,7 @@ export const EditDynamicSecretRedisProviderForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -183,7 +183,7 @@ export const EditDynamicSecretRedisProviderForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -194,7 +194,7 @@ export const EditDynamicSecretRedisProviderForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -135,7 +135,7 @@ export const EditDynamicSecretSapAseForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -185,7 +185,7 @@ export const EditDynamicSecretSapAseForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -196,7 +196,7 @@ export const EditDynamicSecretSapAseForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -135,7 +135,7 @@ export const EditDynamicSecretSapHanaForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -185,7 +185,7 @@ export const EditDynamicSecretSapHanaForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -197,7 +197,7 @@ export const EditDynamicSecretSapHanaForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -132,7 +132,7 @@ export const EditDynamicSecretSnowflakeForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -182,7 +182,7 @@ export const EditDynamicSecretSnowflakeForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -194,7 +194,7 @@ export const EditDynamicSecretSnowflakeForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Account Identifer"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -225,7 +225,7 @@ export const EditDynamicSecretSnowflakeForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="User"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -239,7 +239,7 @@ export const EditDynamicSecretSnowflakeForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Password"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -205,7 +205,7 @@ export const EditDynamicSecretSqlProviderForm = ({
<div>
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
name="newName"
@@ -339,7 +339,7 @@ export const EditDynamicSecretSqlProviderForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -411,7 +411,7 @@ export const EditDynamicSecretSqlProviderForm = ({
</div>
<div>
{selectedClient === SqlProviders.MsSQL && (
<div className="mb-2 mt-2">
<div className="mt-2 mb-2">
<Controller
control={control}
name="inputs.sslEnabled"
@@ -448,7 +448,7 @@ export const EditDynamicSecretSqlProviderForm = ({
</FormControl>
)}
/>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="advanced">
<AccordionTrigger>
Creation, Revocation & Renew Statements (optional)
@@ -542,7 +542,7 @@ export const EditDynamicSecretSqlProviderForm = ({
</AccordionContent>
</AccordionItem>
</Accordion>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>Password Configuration (optional)</AccordionTrigger>
<AccordionContent>
@@ -116,7 +116,7 @@ export const EditDynamicSecretTotpForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -134,7 +134,7 @@ export const EditDynamicSecretTotpForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div className="flex flex-col">
@@ -175,7 +175,7 @@ export const EditDynamicSecretTotpForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="OTP URL"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -193,7 +193,7 @@ export const EditDynamicSecretTotpForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Secret Key"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -209,7 +209,7 @@ export const EditDynamicSecretTotpForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Period"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -228,7 +228,7 @@ export const EditDynamicSecretTotpForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Digits"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -181,7 +181,7 @@ export const EditDynamicSecretVerticaForm = ({
<form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
<div>
<div className="flex items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Controller
control={control}
defaultValue=""
@@ -231,7 +231,7 @@ export const EditDynamicSecretVerticaForm = ({
</div>
</div>
<div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
<div className="mt-4 mb-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration
</div>
<div>
@@ -298,7 +298,7 @@ export const EditDynamicSecretVerticaForm = ({
render={({ field, fieldState: { error } }) => (
<FormControl
label="Host"
className="flex-grow"
className="grow"
isError={Boolean(error?.message)}
errorText={error?.message}
>
@@ -426,7 +426,7 @@ export const EditDynamicSecretVerticaForm = ({
</AccordionContent>
</AccordionItem>
</Accordion>
<Accordion type="multiple" className="mb-2 mt-4 w-full bg-mineshaft-700">
<Accordion type="multiple" className="mt-4 mb-2 w-full bg-mineshaft-700">
<AccordionItem value="password-config">
<AccordionTrigger>Password Configuration (optional)</AccordionTrigger>
<AccordionContent>
@@ -25,7 +25,7 @@ export const MetadataForm = ({
<div className="flex flex-col space-y-2">
{metadataFormFields.fields.map(({ id: metadataFieldId }, i) => (
<div key={metadataFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
{i === 0 && <span className="text-xs text-mineshaft-400">Key</span>}
<Controller
control={control}
@@ -41,7 +41,7 @@ export const MetadataForm = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Value"
@@ -148,12 +148,12 @@ export const EnvironmentTabs = ({ secretPath }: Props) => {
</Tab>
</DropdownMenuTrigger>
<DropdownMenuContent
className="thin-scrollbar max-h-[70vh] overflow-y-auto"
className="max-h-[70vh] thin-scrollbar overflow-y-auto"
sideOffset={2}
align="center"
>
<DropdownMenuLabel>Environments</DropdownMenuLabel>
<div className="thin-scrollbar max-h-[40vh] overflow-auto">
<div className="max-h-[40vh] thin-scrollbar overflow-auto">
{dropdownEnvironments.map((environment) => (
<DropdownMenuItem
key={environment.id}
@@ -175,7 +175,7 @@ export const EnvironmentTabs = ({ secretPath }: Props) => {
<DropdownMenuItem
isDisabled={!isAllowed}
onClick={handleAddEnvironment}
className="data-[highlighted]:bg-mineshaft-900"
className="data-highlighted:bg-mineshaft-900"
>
<Button
size="xs"
@@ -217,7 +217,7 @@ export const EnvironmentTabs = ({ secretPath }: Props) => {
<ModalContent
title="Compare Environments"
subTitle="Compare secrets across multiple environments"
className="flex h-full !w-[95vw] max-w-none flex-col"
className="flex h-full w-[95vw]! max-w-none flex-col"
bodyClassName="flex-1 flex flex-col overflow-hidden"
>
<CompareEnvironments secretPath={secretPath} />
@@ -22,7 +22,7 @@ export const FolderBreadCrumbs = ({ secretPath = "/" }: Props) => {
return (
<div className="mb-3 flex flex-wrap items-center gap-x-2 gap-y-3">
<div
className="breadcrumb relative z-20 border-solid border-mineshaft-600 bg-mineshaft-800 py-1 pl-5 pr-2 text-sm hover:bg-mineshaft-600"
className="breadcrumb relative z-20 border-solid border-mineshaft-600 bg-mineshaft-800 py-1 pr-2 pl-5 text-sm hover:bg-mineshaft-600"
onClick={() => onFolderCrumbClick(0)}
onKeyDown={() => null}
role="button"
@@ -38,7 +38,7 @@ export const FolderBreadCrumbs = ({ secretPath = "/" }: Props) => {
key={`secret-path-${index + 1}`}
className={`breadcrumb relative z-20 ${
index + 1 === arr.length ? "cursor-default" : "cursor-pointer"
} border-solid border-mineshaft-600 py-1 pl-5 pr-2 text-sm text-mineshaft-200`}
} border-solid border-mineshaft-600 py-1 pr-2 pl-5 text-sm text-mineshaft-200`}
onClick={() => onFolderCrumbClick(index + 1)}
onKeyDown={() => null}
role="button"
@@ -218,7 +218,7 @@ export const FolderListView = ({
<FontAwesomeIcon icon={faFolder} />
</div>
<div
className="flex flex-grow items-center px-4 py-3"
className="flex grow items-center px-4 py-3"
role="button"
tabIndex={0}
onKeyDown={(evt) => {
@@ -230,7 +230,7 @@ export const FolderListView = ({
{description && (
<Tooltip
position="right"
className="flex max-w-lg items-center space-x-4 whitespace-pre-wrap py-4"
className="flex max-w-lg items-center space-x-4 py-4 whitespace-pre-wrap"
content={description}
>
<FontAwesomeIcon icon={faInfoCircle} className="ml-1 text-mineshaft-400" />
@@ -180,7 +180,7 @@ export const CopySecretsFromBoard = ({
control={control}
name="secretPath"
render={({ field }) => (
<FormControl label="Secret Path" className="flex-grow" isRequired>
<FormControl label="Secret Path" className="grow" isRequired>
<SecretPathInput
{...field}
placeholder="Provide a path, default is /"
@@ -103,7 +103,7 @@ const PasteEnvForm = ({ onParsedEnv }: Pick<Props, "onParsedEnv">) => {
<TextArea
{...register("value")}
placeholder="Paste secrets in .json, .yml or .env format..."
className="h-[60vh] !resize-none"
className="h-[60vh] resize-none!"
/>
</FormControl>
<Button isDisabled={!isDirty} type="submit">
@@ -104,14 +104,14 @@ const MatrixImportModalTableRow = ({
})}
</Select>
</td>
<td className="whitespace-nowrap pl-5 pr-5">
<td className="pr-5 pl-5 whitespace-nowrap">
<div className="flex items-center justify-center">
<FontAwesomeIcon className="text-mineshaft-400" icon={faArrowRight} />
</div>
</td>
<td className="whitespace-nowrap">
<div className="flex h-full items-start justify-center">
<Badge className="pointer-events-none flex h-[36px] w-full items-center justify-center gap-1.5 whitespace-nowrap border border-mineshaft-600 bg-mineshaft-600 text-bunker-200">
<Badge className="pointer-events-none flex h-[36px] w-full items-center justify-center gap-1.5 border border-mineshaft-600 bg-mineshaft-600 whitespace-nowrap text-bunker-200">
{mapKey === "key" && (
<>
<FontAwesomeIcon icon={faKey} />
@@ -400,7 +400,7 @@ export const SecretDropzone = ({
onDragOver={handleDrag}
onDrop={handleDrop}
className={twMerge(
"relative mx-0.5 mb-4 mt-4 flex cursor-pointer items-center justify-center rounded-md bg-mineshaft-900 px-2 py-4 text-sm text-mineshaft-200 opacity-60 outline-dashed outline-2 outline-chicago-600 duration-200 hover:opacity-100",
"relative mx-0.5 mt-4 mb-4 flex cursor-pointer items-center justify-center rounded-md bg-mineshaft-900 px-2 py-4 text-sm text-mineshaft-200 opacity-60 outline-2 outline-chicago-600 duration-200 outline-dashed hover:opacity-100",
isDragActive && "opacity-100",
!isSmaller && "mx-auto mt-40 w-full max-w-3xl flex-col space-y-4 py-20",
isLoading && "bg-bunker-800"
@@ -171,7 +171,7 @@ export const SecretImportItem = ({
<div className="flex w-11 items-center py-2 pl-5 text-green-700">
<FontAwesomeIcon icon={faFileImport} />
</div>
<div className="flex flex-grow items-center py-2 pl-4 pr-2">
<div className="flex grow items-center py-2 pr-2 pl-4">
<EnvFolderIcon
env={importEnv.slug || ""}
secretPath={secretImport?.importPath || ""}
@@ -182,11 +182,11 @@ export const SecretImportItem = ({
{lastReplicated && (
<Tooltip
position="left"
className="max-w-md whitespace-normal break-words"
className="max-w-md break-words whitespace-normal"
content={
<div className="flex max-h-[10rem] flex-col overflow-auto">
<div className="flex max-h-40 flex-col overflow-auto">
<div className="flex self-start">
<FontAwesomeIcon icon={faCalendarCheck} className="pr-2 pt-0.5 text-sm" />
<FontAwesomeIcon icon={faCalendarCheck} className="pt-0.5 pr-2 text-sm" />
<div className="text-sm">Last Replication</div>
</div>
<div className="pl-5 text-left text-xs">
@@ -197,7 +197,7 @@ export const SecretImportItem = ({
{!isReplicationSuccess && (
<>
<div className="mt-2 flex self-start">
<FontAwesomeIcon icon={faXmark} className="pr-2 pt-1 text-sm" />
<FontAwesomeIcon icon={faXmark} className="pt-1 pr-2 text-sm" />
<div className="text-sm">Fail reason</div>
</div>
<div className="pl-5 text-left text-xs">{replicationStatus}</div>
@@ -242,7 +242,7 @@ export const SecretImportItem = ({
</ProjectPermissionCan>
)}
</div>
<div className="flex w-16 items-center justify-between border-l border-mineshaft-600 py-3.5 pl-4 pr-3">
<div className="flex w-16 items-center justify-between border-l border-mineshaft-600 py-3.5 pr-3 pl-4">
<ProjectPermissionCan
I={ProjectPermissionActions.Edit}
a={subject(ProjectPermissionSub.SecretImports, {
@@ -194,11 +194,11 @@ export const CollapsibleSecretImports: React.FC<CollapsibleSecretImportsProps> =
<div className="mb-4 w-full">
<div className={`mb-4 rounded-md border ${alertColors.border} ${alertColors.bg}`}>
<div className="flex items-start gap-3 p-4">
<div className={`mt-0.5 flex-shrink-0 ${alertColors.text}`}>
<div className={`mt-0.5 shrink-0 ${alertColors.text}`}>
<FontAwesomeIcon icon={faWarning} className="h-5 w-5" aria-hidden="true" />
</div>
<div className="w-full">
<p className={`text-sm font-semibold ${alertColors.text}`}>
<p className={`text-sm font-medium ${alertColors.text}`}>
The following resources will be affected by this change
</p>
</div>
@@ -337,7 +337,7 @@ export const CreateReminderForm = ({
{/* Conditional Fields Based on Reminder Type */}
{reminderType === ReminderType.Recurring ? (
<div className="grid grid-cols-[1fr,auto] gap-x-2">
<div className="grid grid-cols-[1fr_auto] gap-x-2">
<Controller
control={control}
name="repeatDays"
@@ -365,7 +365,7 @@ export const CreateReminderForm = ({
{/* Interval description */}
<div
className={twMerge(
"ml-1 mt-2 text-xs",
"mt-2 ml-1 text-xs",
field.value ? "opacity-60" : "opacity-0"
)}
>
@@ -352,7 +352,7 @@ export const SecretDetailSidebar = ({
>
<DrawerContent
title={`Secret – ${secret?.key}`}
className="thin-scrollbar h-full"
className="h-full thin-scrollbar"
cardBodyClassName="pb-0"
onOpenAutoFocus={(e) => e.preventDefault()}
>
@@ -474,7 +474,7 @@ export const SecretDetailSidebar = ({
Multi-line encoding
<Tooltip
content="When enabled, multiline secrets will be handled by escaping newlines and enclosing the entire value in double quotes."
className="z-[100]"
className="z-100"
>
<FontAwesomeIcon icon={faCircleQuestion} className="ml-2" />
</Tooltip>
@@ -552,7 +552,7 @@ export const SecretDetailSidebar = ({
</DropdownMenuTrigger>
)}
</ProjectPermissionCan>
<DropdownMenuContent align="start" side="right" className="z-[100]">
<DropdownMenuContent align="start" side="right" className="z-100">
<DropdownMenuLabel className="pl-2">
Add tags to this secret
</DropdownMenuLabel>
@@ -618,7 +618,7 @@ export const SecretDetailSidebar = ({
<div className="flex flex-col space-y-2">
{metadataFormFields.fields.map(({ id: metadataFieldId }, i) => (
<div key={metadataFieldId} className="flex items-end space-x-2">
<div className="flex-grow">
<div className="grow">
{i === 0 && <span className="text-xs text-mineshaft-400">Key</span>}
<Controller
control={control}
@@ -634,7 +634,7 @@ export const SecretDetailSidebar = ({
)}
/>
</div>
<div className="flex-grow">
<div className="grow">
{i === 0 && (
<FormLabel
label="Value"
@@ -692,7 +692,7 @@ export const SecretDetailSidebar = ({
className="mb-0 h-[125px] pb-0"
>
<TextArea
className="mb-0 !resize-none border border-mineshaft-600 bg-mineshaft-900 text-sm"
className="mb-0 resize-none! border border-mineshaft-600 bg-mineshaft-900 text-sm"
readOnly={isReadOnly}
placeholder="add a comment or note to this secret..."
rows={4}
@@ -701,9 +701,9 @@ export const SecretDetailSidebar = ({
</FormControl>
)}
/>
<div className="dark flex max-h-[24rem] flex-1 cursor-default flex-col text-sm text-bunker-300">
<div className="dark flex max-h-96 flex-1 cursor-default flex-col text-sm text-bunker-300">
<div className="mb-0.5 text-mineshaft-400">Version History</div>
<div className="thin-scrollbar flex flex-1 flex-col space-y-2 overflow-y-auto overflow-x-hidden rounded-md border border-mineshaft-600 bg-mineshaft-900 p-4 dark:[color-scheme:dark]">
<div className="flex thin-scrollbar flex-1 flex-col space-y-2 overflow-x-hidden overflow-y-auto rounded-md border border-mineshaft-600 bg-mineshaft-900 p-4 dark:scheme-dark">
{secretVersion?.map((version) => (
<SecretVersionItem
canReadValue={!cannotReadSecretValue}
@@ -726,13 +726,13 @@ export const SecretDetailSidebar = ({
Access List
<Tooltip
content="Lists all users, machine identities, and groups that have been granted any permission level (read, create, edit, or delete) for this secret."
className="z-[100]"
className="z-100"
>
<FontAwesomeIcon icon={faCircleQuestion} className="ml-2" />
</Tooltip>
</div>
{secretAccessList ? (
<div className="flex flex-col space-y-2 overflow-y-auto overflow-x-hidden rounded-md border border-mineshaft-600 bg-mineshaft-900 p-4 dark:[color-scheme:dark]">
<div className="flex flex-col space-y-2 overflow-x-hidden overflow-y-auto rounded-md border border-mineshaft-600 bg-mineshaft-900 p-4 dark:scheme-dark">
{secretAccessList.users.length > 0 && (
<div className="pb-3">
<div className="mb-2 font-bold">Users</div>
@@ -744,20 +744,11 @@ export const SecretDetailSidebar = ({
content={user.allowedActions
.map((action) => camelCaseToSpaces(action))
.join(", ")}
className="z-[100] capitalize"
className="z-100 capitalize"
>
<Link
to={
`${getProjectBaseURL(currentProject.type)}/members/$membershipId` as const
}
params={{
projectId: currentProject.id,
membershipId: user.membershipId
}}
className="text-secondary/80 rounded-md border border-mineshaft-600 bg-mineshaft-700 px-1 py-0.5 text-sm hover:text-mineshaft-100"
>
<div className="text-secondary/80 rounded-md border border-mineshaft-600 bg-mineshaft-700 px-1 py-0.5 text-sm hover:text-mineshaft-100">
{user.name}
</Link>
</div>
</Tooltip>
</div>
))}
@@ -778,7 +769,7 @@ export const SecretDetailSidebar = ({
action.charAt(0).toUpperCase() + action.slice(1).toLowerCase()
)
.join(", ")}
className="z-[100]"
className="z-100"
>
<Link
to={
@@ -812,7 +803,7 @@ export const SecretDetailSidebar = ({
action.charAt(0).toUpperCase() + action.slice(1).toLowerCase()
)
.join(", ")}
className="z-[100]"
className="z-100"
>
<Link
to={"/organization/groups/$groupId" as const}
@@ -853,7 +844,7 @@ export const SecretDetailSidebar = ({
>
Secret Reference Tree
</Button>
<Tooltip content="Copy Secret ID" className="z-[100]">
<Tooltip content="Copy Secret ID" className="z-100">
<IconButton
variant="outline_bg"
ariaLabel="Copy Secret ID"
@@ -880,7 +871,7 @@ export const SecretDetailSidebar = ({
})}
>
{(isAllowed) => (
<Tooltip content="Delete Secret" align="end" className="z-[100]">
<Tooltip content="Delete Secret" align="end" className="z-100">
<IconButton
colorSchema="danger"
variant="outline_bg"
@@ -449,7 +449,7 @@ export const SecretItem = memo(
<FontAwesomeIcon
icon={faRotate}
size="xs"
className="absolute -bottom-[0.05rem] -right-[0.2rem] text-mineshaft-400"
className="absolute -right-[0.2rem] -bottom-[0.05rem] text-mineshaft-400"
/>
</div>
) : (
@@ -462,18 +462,15 @@ export const SecretItem = memo(
/>
<FontAwesomeSymbol
className={twMerge(
"ml-3 block h-3.5 w-3.5 group-hover:hidden",
isSelected && "hidden"
"ml-3 block h-3.5 w-3.5 group-hover:!hidden",
isSelected && "!hidden"
)}
symbolName={FontAwesomeSpriteName.SecretKey}
/>
</>
)}
</div>
<div
className="flex h-11 flex-shrink-0 items-center px-4 py-2"
style={{ width: colWidth }}
>
<div className="flex h-11 shrink-0 items-center px-4 py-2" style={{ width: colWidth }}>
<Controller
name="key"
control={control}
@@ -518,7 +515,7 @@ export const SecretItem = memo(
/>
</div>
<div
className="flex w-80 flex-grow items-center border-x border-mineshaft-600 py-1 pl-4 pr-2"
className="flex w-80 grow items-center border-x border-mineshaft-600 py-1 pr-2 pl-4"
tabIndex={0}
role="button"
>
@@ -586,7 +583,7 @@ export const SecretItem = memo(
{pendingAction !== PendingAction.Create && pendingAction !== PendingAction.Delete && (
<div
key="actions"
className="flex h-full flex-shrink-0 self-start transition-all group-hover:gap-x-2"
className="flex h-full shrink-0 self-start transition-all group-hover:gap-x-2"
>
<IconButton
isDisabled={secret.secretValueHidden}
@@ -851,7 +848,7 @@ export const SecretItem = memo(
{pendingAction === PendingAction.Create && (
<div
key="actions"
className="flex h-full flex-shrink-0 self-start transition-all group-hover:gap-x-2"
className="flex h-full shrink-0 self-start transition-all group-hover:gap-x-2"
>
<DropdownMenu>
<ProjectPermissionCan
@@ -941,7 +938,7 @@ export const SecretItem = memo(
{isInAutoSaveMode ? (
<motion.div
key="auto-save-mode"
className="flex w-[63px] flex-shrink-0 items-center justify-between px-3"
className="flex w-[63px] shrink-0 items-center justify-between px-3"
initial={{ x: -10, opacity: 0 }}
animate={{ x: 0, opacity: 1 }}
exit={{ x: -10, opacity: 0 }}
@@ -952,7 +949,7 @@ export const SecretItem = memo(
isPending ? (
<motion.div
key="options"
className="flex w-[63px] flex-shrink-0 items-center justify-between px-3"
className="flex w-[63px] shrink-0 items-center justify-between px-3"
initial={{ x: 0, opacity: 0 }}
animate={{ x: 0, opacity: 1 }}
exit={{ x: 10, opacity: 0 }}
@@ -992,7 +989,7 @@ export const SecretItem = memo(
) : (
<motion.div
key="options"
className="flex w-[63px] flex-shrink-0 items-center justify-between px-3"
className="flex w-[63px] shrink-0 items-center justify-between px-3"
initial={{ x: 0, opacity: 0 }}
animate={{ x: 0, opacity: 1 }}
exit={{ x: 10, opacity: 0 }}
@@ -1051,7 +1048,7 @@ export const SecretItem = memo(
) : (
<motion.div
key="options-save"
className="flex w-[63px] flex-shrink-0 items-center justify-between px-3"
className="flex w-[63px] shrink-0 items-center justify-between px-3"
initial={{ x: -10, opacity: 0 }}
animate={{ x: 0, opacity: 1 }}
exit={{ x: -10, opacity: 0 }}
@@ -39,7 +39,7 @@ export const SecretNoAccessListView = ({ count, isRotationView }: Props) => {
<FontAwesomeIcon
icon={faRotate}
size="xs"
className="absolute -bottom-[0.05rem] -right-[0.2rem] text-mineshaft-400"
className="absolute -right-[0.2rem] -bottom-[0.05rem] text-mineshaft-400"
/>
</div>
) : (
@@ -49,14 +49,14 @@ export const SecretNoAccessListView = ({ count, isRotationView }: Props) => {
/>
)}
</div>
<div className="ml-[0.05rem] flex h-11 w-80 flex-shrink-0 items-center border-r border-mineshaft-600 px-4 py-2">
<div className="ml-[0.05rem] flex h-11 w-80 shrink-0 items-center border-r border-mineshaft-600 px-4 py-2">
<Input
autoComplete="off"
isReadOnly
variant="plain"
value="NO ACCESS"
isDisabled
className="w-full px-0 blur-sm placeholder:text-red-500 focus:text-bunker-100 focus:ring-transparent"
className="w-full px-0 blur-xs placeholder:text-red-500 focus:text-bunker-100 focus:ring-transparent"
/>
</div>
<Blur className="pl-8" />
@@ -150,7 +150,7 @@ export const SecretVersionItem = ({
</div>
<div className="flex w-full cursor-default">
<div className="relative w-10">
<div className="absolute bottom-0 left-3 top-0 mt-0.5 border-l border-mineshaft-400/60" />
<div className="absolute top-0 bottom-0 left-3 mt-0.5 border-l border-mineshaft-400/60" />
</div>
<div className="flex w-full cursor-default flex-col">
{actor && (
@@ -172,14 +172,14 @@ export const SecretVersionItem = ({
</div>
)}
<div className="flex flex-row">
<div className="h-min w-fit rounded-sm bg-primary-500/10 px-1 text-primary-300/70">
<div className="h-min w-fit rounded-xs bg-primary-500/10 px-1 text-primary-300/70">
Value:
</div>
<div className="group break-all pl-1 font-mono">
<div className="group pl-1 font-mono break-all">
<div className="relative hidden cursor-pointer transition-all duration-200 group-[.show-value]:inline">
<button
type="button"
className="select-none text-left"
className="text-left select-none"
onClick={async (e) => {
if (secretValueHidden) return;
@@ -48,7 +48,7 @@ export const SecretRotationItem = ({
<div className="text- flex w-11 items-center py-2 pl-5 text-mineshaft-400">
<FontAwesomeIcon icon={faRotate} />
</div>
<div className="flex flex-grow items-center py-2 pl-4 pr-2">
<div className="flex grow items-center py-2 pr-2 pl-4">
<div className="flex w-full flex-wrap items-center">
<span>{name}</span>
<Tag className="mx-2.5 flex items-center gap-1 px-1.5 py-0 text-xs normal-case">
@@ -70,7 +70,7 @@ export const SecretRotationItem = ({
<SecretRotationV2StatusBadge className="mx-2" secretRotation={secretRotation} />
<div
key="actions"
className="flex h-full flex-shrink-0 self-start transition-all group-hover:gap-x-2"
className="flex h-full shrink-0 self-start transition-all group-hover:gap-x-2"
>
<Tooltip content="View Rotation Secrets">
<IconButton
@@ -48,14 +48,14 @@ export const SecretRotationSecretRow = ({
className="max-w-sm"
content={secret ? undefined : "You do not have permission to view this secret."}
>
<tr className="h-full last:!border-b-0 hover:bg-mineshaft-700">
<tr className="h-full last:border-b-0! hover:bg-mineshaft-700">
<td className="flex h-full items-center" style={{ padding: "0.5rem 1rem" }}>
<span className={twMerge(!secret && "blur")}>{secret?.key ?? "********"}</span>
<span className={twMerge(!secret && "blur-sm")}>{secret?.key ?? "********"}</span>
</td>
<td className="col-span-2 h-full w-full" style={{ padding: "0.5rem 1rem" }}>
{/* eslint-disable-next-line no-nested-ternary */}
{!secret ? (
<div className="h-full pl-4 blur">********</div>
<div className="h-full pl-4 blur-sm">********</div>
) : secret.secretValueHidden ? (
<Blur
className="py-0"
@@ -69,13 +69,13 @@ export const SecretItem = ({ mode, preSecret, postSecret }: Props) => {
if (evt.key === "Enter") setIsExpanded.toggle();
}}
>
<div className="w-12 flex-shrink-0 px-4 py-3">
<div className="w-12 shrink-0 px-4 py-3">
<Tooltip content={mode}>{renderIcon(mode)}</Tooltip>
</div>
<div className="w-12 flex-shrink-0 px-4 py-3">
<div className="w-12 shrink-0 px-4 py-3">
<FontAwesomeIcon icon={faKey} />
</div>
<div className="flex flex-grow items-center space-x-4 px-4 py-3">
<div className="flex grow items-center space-x-4 px-4 py-3">
{mode === "modified" && !preSecret?.isRotatedSecret ? (
<>
<div>{preSecret?.key}</div>
@@ -106,7 +106,7 @@ export const SecretItem = ({ mode, preSecret, postSecret }: Props) => {
<TableContainer>
<Table>
<THead>
<Th className="min-table-row min-w-[11rem] border-r border-mineshaft-600">Type</Th>
<Th className="min-table-row min-w-44 border-r border-mineshaft-600">Type</Th>
{isModified ? (
<>
<Th className="border-r border-mineshaft-600">Before rollback</Th>
@@ -183,7 +183,7 @@ export const SnapshotView = ({
onChange={(evt) => setSearch(evt.target.value)}
/>
</div>
<div className="flex-grow" />
<div className="grow" />
{isAllowedRollback && (
<div>
<Button
@@ -230,9 +230,9 @@ export const SnapshotView = ({
<div className="mt-4 rounded-md bg-mineshaft-800 text-left text-sm text-bunker-300">
<div className="flex flex-col">
<div className="flex border-b border-mineshaft-600 font-medium">
<div className="w-12 flex-shrink-0" />
<div className="w-12 flex-shrink-0" />
<div className="flex flex-grow items-center px-4 py-2">Changes</div>
<div className="w-12 shrink-0" />
<div className="w-12 shrink-0" />
<div className="flex grow items-center px-4 py-2">Changes</div>
</div>
{folderDiffView
.sort((a, b) => a.post.name.toLowerCase().localeCompare(b.post.name.toLowerCase()))
@@ -242,13 +242,13 @@ export const SnapshotView = ({
className="group flex cursor-pointer border-b border-mineshaft-600 hover:bg-mineshaft-700"
key={`folder-${mode}-${index + 1}`}
>
<div className="w-12 flex-shrink-0 px-4 py-3">
<div className="w-12 shrink-0 px-4 py-3">
<Tooltip content={mode}>{renderIcon(mode)}</Tooltip>
</div>
<div className="w-12 flex-shrink-0 px-4 py-3">
<div className="w-12 shrink-0 px-4 py-3">
<FontAwesomeIcon icon={faFolder} />
</div>
<div className="flex flex-grow items-center space-x-4 px-4 py-3">
<div className="flex grow items-center space-x-4 px-4 py-3">
{mode === "modified" ? (
<>
<div>{pre?.name}</div>