awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-09-22 13:39:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(secrets-permissions): UI improvements

Browse Source
This commit is contained in:
carlosmonastyrski
2025-04-23 22:24:41 -03:00
parent 56b3e7a76d
commit 95489e1b0a
2 changed files with 30 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/src/pages/secret-manager/OverviewPage/components/SecretOverviewTableRow/SecretEditRow.tsx
View File

@@ -4,6 +4,7 @@ import { subject } from "@casl/ability";
import {
faCheck,
faCopy,
faEyeSlash,
faProjectDiagram,
faTrash,
faXmark
@@ -25,7 +26,6 @@ import {
ModalTrigger,
Tooltip
} from "@app/components/v2";
import { Blur } from "@app/components/v2/Blur";
import { InfisicalSecretInput } from "@app/components/v2/InfisicalSecretInput";
import { ProjectPermissionActions, ProjectPermissionSub, useProjectPermission } from "@app/context";
import { ProjectPermissionSecretActions } from "@app/context/ProjectPermissionContext/types";
@@ -177,18 +177,22 @@ export const SecretEditRow = ({
deleteKey={secretName}
onDeleteApproved={handleDeleteSecret}
/>
{secretValueHidden && (
<Tooltip
content={`You do not have permission to read the value of this secret.${canEditSecretValue ? " But you can edit this secret" : ""}`}
>
<FontAwesomeIcon className="pl-1" icon={faEyeSlash} />
</Tooltip>
)}
<div className="flex-grow border-r border-r-mineshaft-600 pl-1 pr-2">
{secretValueHidden && !isSecretBlurFocus ? (
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
<div
className="flex flex-grow"
onClick={handleSecretBlurClick}
onBlur={() => setIsSecretBlurFocus.off()}
>
<Blur
tooltipText={`You do not have permission to read the value of this secret.${canEditSecretValue ? " But you have permission to edit it." : ""}`}
/>
<div className="flex flex-grow items-center gap-2" onClick={handleSecretBlurClick}>
<span className="flex flex-row items-center">
<div style={{ fontFamily: "monospace" }} className="h-full w-full">
*********************
</div>
</span>
</div>
) : (
<Controller
@@ -201,7 +205,7 @@ export const SecretEditRow = ({
isReadOnly={isImportedSecret || isRotatedSecret}
value={field.value as string}
key="secret-input"
isVisible={isVisible}
isVisible={isVisible && !secretValueHidden}
secretPath={secretPath}
environment={environment}
isImport={isImportedSecret}

26
frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretItem.tsx
View File

@@ -46,10 +46,9 @@ import {
} from "@app/components/secrets/SecretReferenceDetails";
import { ProjectPermissionSecretActions } from "@app/context/ProjectPermissionContext/types";
import { Blur } from "@app/components/v2/Blur";
import { hasSecretReadValueOrDescribePermission } from "@app/lib/fn/permission";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faKey, faRotate } from "@fortawesome/free-solid-svg-icons";
import { faEyeSlash, faKey, faRotate } from "@fortawesome/free-solid-svg-icons";
import {
FontAwesomeSpriteName,
formSchema,
@@ -311,6 +310,13 @@ export const SecretItem = memo(
tabIndex={0}
role="button"
>
{secretValueHidden && (
<Tooltip
content={`You do not have permission to read the value of this secret.${canEditSecretValue ? " But you can edit this secret" : ""}`}
>
<FontAwesomeIcon className="pr-2" icon={faEyeSlash} />
</Tooltip>
)}
{isOverriden ? (
<Controller
name="valueOverride"
@@ -328,14 +334,12 @@ export const SecretItem = memo(
/>
) : secretValueHidden && !isSecretBlurFocus ? (
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
<div
className="flex flex-grow"
onClick={handleSecretBlurClick}
onBlur={() => setIsSecretBlurFocus.off()}
>
<Blur
tooltipText={`You do not have permission to read the value of this secret.${canEditSecretValue ? " But you have permission to edit it." : ""}`}
/>
<div className="flex flex-grow items-center gap-2" onClick={handleSecretBlurClick}>
<span className="flex flex-row items-center">
<div style={{ fontFamily: "monospace" }} className="h-full w-full">
*********************
</div>
</span>
</div>
) : (
<Controller
@@ -346,7 +350,7 @@ export const SecretItem = memo(
<InfisicalSecretInput
isReadOnly={isReadOnly || isRotatedSecret}
key="secret-value"
isVisible={isVisible}
isVisible={isVisible && !secretValueHidden}
environment={environment}
secretPath={secretPath}
{...field}