misc: finalized ui

This commit is contained in:
Sheen Capadngan
2025-01-08 20:50:20 +08:00
parent 2819c8519e
commit c2453f0c84
@@ -511,7 +511,15 @@ export const SecretDetailSidebar = ({
</div> </div>
</div> </div>
<div className="dark mb-4 flex-grow text-sm text-bunker-300"> <div className="dark mb-4 flex-grow text-sm text-bunker-300">
<div className="mb-2">Access List</div> <div className="mb-2">
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]"
>
<FontAwesomeIcon icon={faCircleQuestion} className="ml-1" size="sm" />
</Tooltip>
</div>
{isPending && ( {isPending && (
<Button className="w-full px-2 py-1" variant="outline_bg" isDisabled> <Button className="w-full px-2 py-1" variant="outline_bg" isDisabled>
Analyze Access Analyze Access
@@ -536,28 +544,20 @@ export const SecretDetailSidebar = ({
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
{secretAccessList.users.map((user) => ( {secretAccessList.users.map((user) => (
<div className="rounded-md bg-bunker-500 px-1"> <div className="rounded-md bg-bunker-500 px-1">
<Link <Tooltip content={user.allowedActions.join(", ")} className="z-[100]">
to={ <Link
`/${ProjectType.SecretManager}/$projectId/members/$membershipId` as const to={
} `/${ProjectType.SecretManager}/$projectId/members/$membershipId` as const
params={{ }
projectId: currentWorkspace.id, params={{
membershipId: user.membershipId projectId: currentWorkspace.id,
}} membershipId: user.membershipId
className="text-secondary/80 text-sm hover:text-primary" }}
> className="text-secondary/80 text-sm hover:text-primary"
{user.name}
<Tooltip
content={user.allowedActions.join(", ")}
className="z-[100]"
> >
<FontAwesomeIcon {user.name}
icon={faCircleQuestion} </Link>
className="ml-1" </Tooltip>
size="sm"
/>
</Tooltip>
</Link>
</div> </div>
))} ))}
</div> </div>
@@ -569,28 +569,23 @@ export const SecretDetailSidebar = ({
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
{secretAccessList.identities.map((identity) => ( {secretAccessList.identities.map((identity) => (
<div className="rounded-md bg-bunker-500 px-1"> <div className="rounded-md bg-bunker-500 px-1">
<Link <Tooltip
to={ content={identity.allowedActions.join(", ")}
`/${ProjectType.SecretManager}/$projectId/identities/$identityId` as const className="z-[100]"
}
params={{
projectId: currentWorkspace.id,
identityId: identity.id
}}
className="text-secondary/80 text-sm hover:text-primary"
> >
{identity.name} <Link
<Tooltip to={
content={identity.allowedActions.join(", ")} `/${ProjectType.SecretManager}/$projectId/identities/$identityId` as const
className="z-[100]" }
params={{
projectId: currentWorkspace.id,
identityId: identity.id
}}
className="text-secondary/80 text-sm hover:text-primary"
> >
<FontAwesomeIcon {identity.name}
icon={faCircleQuestion} </Link>
className="ml-1" </Tooltip>
size="sm"
/>
</Tooltip>
</Link>
</div> </div>
))} ))}
</div> </div>
@@ -602,25 +597,20 @@ export const SecretDetailSidebar = ({
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
{secretAccessList.groups.map((group) => ( {secretAccessList.groups.map((group) => (
<div className="rounded-md bg-bunker-500 px-1"> <div className="rounded-md bg-bunker-500 px-1">
<Link <Tooltip
to={"/organization/groups/$groupId" as const} content={group.allowedActions.join(", ")}
params={{ className="z-[100]"
groupId: group.id
}}
className="text-secondary/80 text-sm hover:text-primary"
> >
{group.name} <Link
<Tooltip to={"/organization/groups/$groupId" as const}
content={group.allowedActions.join(", ")} params={{
className="z-[100]" groupId: group.id
}}
className="text-secondary/80 text-sm hover:text-primary"
> >
<FontAwesomeIcon {group.name}
icon={faCircleQuestion} </Link>
className="ml-1" </Tooltip>
size="sm"
/>
</Tooltip>
</Link>
</div> </div>
))} ))}
</div> </div>