mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-09-22 13:39:35 +00:00
fix: requested changes
This commit is contained in:
@@ -4,7 +4,6 @@ import {
|
||||
faCheck,
|
||||
faEdit,
|
||||
faHourglass,
|
||||
faQuestionCircle,
|
||||
faTriangleExclamation,
|
||||
faUser,
|
||||
faUserSlash
|
||||
@@ -58,8 +57,9 @@ const getReviewedStatusSymbol = (status?: ApprovalStatus, isOrgMembershipActive?
|
||||
return (
|
||||
// Can't do a tooltip here because nested tooltips doesn't work properly as of yet.
|
||||
// TODO(daniel): Fix nested tooltips in the future.
|
||||
<Badge variant="danger" className="flex h-4 items-center justify-center">
|
||||
<FontAwesomeIcon icon={faUserSlash} size="xs" />
|
||||
|
||||
<Badge className="flex h-4 items-center justify-center bg-mineshaft-400/50 text-bunker-300">
|
||||
<FontAwesomeIcon size="xs" icon={faUserSlash} />
|
||||
</Badge>
|
||||
);
|
||||
}
|
||||
@@ -206,6 +206,7 @@ export const ReviewAccessRequestModal = ({
|
||||
(acc, curr) => {
|
||||
if (acc.length && acc[acc.length - 1].sequence === curr.sequence) {
|
||||
acc[acc.length - 1][curr.type]?.push(curr);
|
||||
|
||||
return acc;
|
||||
}
|
||||
|
||||
@@ -217,6 +218,7 @@ export const ReviewAccessRequestModal = ({
|
||||
? { user: [curr], group: [], sequence, approvals }
|
||||
: { group: [curr], user: [], sequence, approvals }
|
||||
);
|
||||
|
||||
return acc;
|
||||
},
|
||||
[] as {
|
||||
@@ -430,24 +432,32 @@ export const ReviewAccessRequestModal = ({
|
||||
<GenericFieldLabel className="col-span-2" icon={faUser} label="Users">
|
||||
{Boolean(approver.user.length) && (
|
||||
<div className="flex flex-row flex-wrap gap-2">
|
||||
{approver?.user?.map((el) => {
|
||||
{approver?.user?.map((el, index) => {
|
||||
const member = approverSequence?.membersGroupById?.[el.id]?.[0];
|
||||
if (!member) return null;
|
||||
|
||||
return member.user.isOrgMembershipActive ? (
|
||||
<span key={el.id}>{member.user.username}</span>
|
||||
<div className="flex items-center" key={member.user.id}>
|
||||
<span>{member.user.username}</span>
|
||||
{index < approver.user.length - 1 && ","}
|
||||
</div>
|
||||
) : (
|
||||
<span className="opacity-40" key={el.id}>
|
||||
{member.user.username}{" "}
|
||||
<span className="text-xs">
|
||||
<Tooltip content="This user has been deactivated and no longer has an active organization membership.">
|
||||
<div>
|
||||
(Inactive){" "}
|
||||
<FontAwesomeIcon size="xs" icon={faQuestionCircle} />
|
||||
</div>
|
||||
</Tooltip>
|
||||
<div className="flex items-center" key={member.user.id}>
|
||||
<span className="flex items-center opacity-40">
|
||||
{member.user.username}
|
||||
<span className="text-xs">
|
||||
<Tooltip content="This user has been deactivated and no longer has an active organization membership.">
|
||||
<div>
|
||||
<Badge className="pointer-events-none ml-1 mr-auto flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
|
||||
<FontAwesomeIcon icon={faBan} />
|
||||
Inactive
|
||||
</Badge>
|
||||
</div>
|
||||
</Tooltip>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
{index < approver.user.length - 1 && ","}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
@@ -44,7 +44,6 @@ import { EnforcementLevel, PolicyType } from "@app/hooks/api/policies/enums";
|
||||
import { TWorkspaceUser } from "@app/hooks/api/users/types";
|
||||
|
||||
import { PolicyMemberOption } from "./PolicyMemberOption";
|
||||
import { PolicyBypasserMemberOption } from "./PolicyBypasserMemberOption";
|
||||
|
||||
type Props = {
|
||||
isOpen?: boolean;
|
||||
@@ -144,7 +143,7 @@ const Form = ({
|
||||
handleSubmit,
|
||||
watch,
|
||||
resetField,
|
||||
formState: { isSubmitting, errors }
|
||||
formState: { isSubmitting }
|
||||
} = useForm<TFormSchema>({
|
||||
resolver: zodResolver(formSchema),
|
||||
values: editValues
|
||||
@@ -415,8 +414,6 @@ const Form = ({
|
||||
setDragOverItem(null);
|
||||
};
|
||||
|
||||
console.log("error", errors);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-3">
|
||||
<form onSubmit={handleSubmit(handleFormSubmit)}>
|
||||
@@ -812,7 +809,7 @@ const Form = ({
|
||||
menuPlacement="top"
|
||||
isMulti
|
||||
placeholder="Select members..."
|
||||
components={{ Option: PolicyBypasserMemberOption }}
|
||||
components={{ Option: PolicyMemberOption }}
|
||||
options={bypasserMemberOptions}
|
||||
getOptionValue={(option) => option.id}
|
||||
getOptionLabel={(option) => {
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { useMemo } from "react";
|
||||
import {
|
||||
faBan,
|
||||
faClipboardCheck,
|
||||
faEdit,
|
||||
faEllipsisV,
|
||||
faQuestionCircle,
|
||||
faTrash,
|
||||
faUser,
|
||||
faUserGroup
|
||||
@@ -215,21 +215,29 @@ export const ApprovalPolicyRow = ({
|
||||
<GenericFieldLabel className="col-span-2" icon={faUser} label="Users">
|
||||
{Boolean(el.users.length) && (
|
||||
<div className="flex flex-row flex-wrap gap-2">
|
||||
{el.users.map((u) => {
|
||||
{el.users.map((u, index) => {
|
||||
return u.user.isOrgMembershipActive ? (
|
||||
<span key={u.id}>{getMemberLabel(u)}</span>
|
||||
<div className="flex items-center" key={u.id}>
|
||||
<span>{getMemberLabel(u)}</span>
|
||||
{index < el.users.length - 1 && ","}
|
||||
</div>
|
||||
) : (
|
||||
<span className="opacity-40" key={u.id}>
|
||||
{getMemberLabel(u)}{" "}
|
||||
<span className="text-xs">
|
||||
<Tooltip content="This user has been deactivated and no longer has an active organization membership.">
|
||||
<div>
|
||||
(Inactive){" "}
|
||||
<FontAwesomeIcon size="xs" icon={faQuestionCircle} />
|
||||
</div>
|
||||
</Tooltip>
|
||||
<div className="flex items-center" key={u.id}>
|
||||
<span className="flex items-center opacity-40">
|
||||
{getMemberLabel(u)}
|
||||
<span className="text-xs">
|
||||
<Tooltip content="This user has been deactivated and no longer has an active organization membership.">
|
||||
<div>
|
||||
<Badge className="pointer-events-none ml-1 mr-auto flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
|
||||
<FontAwesomeIcon icon={faBan} />
|
||||
Inactive
|
||||
</Badge>
|
||||
</div>
|
||||
</Tooltip>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
{index < el.users.length - 1 && ","}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
import { components, OptionProps } from "react-select";
|
||||
import { faCheckCircle } from "@fortawesome/free-regular-svg-icons";
|
||||
import { faBan } from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
import { Badge } from "@app/components/v2";
|
||||
import { BypasserType } from "@app/hooks/api/accessApproval/types";
|
||||
|
||||
export const PolicyBypasserMemberOption = ({
|
||||
isSelected,
|
||||
children,
|
||||
...props
|
||||
}: OptionProps<{
|
||||
id: string;
|
||||
type: BypasserType;
|
||||
isOrgMembershipActive?: boolean;
|
||||
}>) => {
|
||||
return (
|
||||
<components.Option isSelected={isSelected} {...props}>
|
||||
<div className="flex flex-row items-center justify-between">
|
||||
<p
|
||||
className={twMerge("truncate", !props.data.isOrgMembershipActive && "text-mineshaft-400")}
|
||||
>
|
||||
{children}
|
||||
</p>
|
||||
{!props.data.isOrgMembershipActive && (
|
||||
<Badge className="pointer-events-none ml-1 mr-auto flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
|
||||
<FontAwesomeIcon icon={faBan} />
|
||||
Inactive
|
||||
</Badge>
|
||||
)}
|
||||
{isSelected && (
|
||||
<FontAwesomeIcon className="ml-2 text-primary" icon={faCheckCircle} size="sm" />
|
||||
)}
|
||||
</div>
|
||||
</components.Option>
|
||||
);
|
||||
};
|
||||
@@ -5,7 +5,8 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
import { Badge } from "@app/components/v2";
|
||||
import { ApproverType } from "@app/hooks/api/accessApproval/types";
|
||||
import { BypasserType } from "@app/hooks/api/accessApproval/types";
|
||||
import { ApproverType } from "@app/hooks/api/secretApproval/types";
|
||||
|
||||
export const PolicyMemberOption = ({
|
||||
isSelected,
|
||||
@@ -13,8 +14,8 @@ export const PolicyMemberOption = ({
|
||||
...props
|
||||
}: OptionProps<{
|
||||
id: string;
|
||||
type: BypasserType | ApproverType;
|
||||
isOrgMembershipActive?: boolean;
|
||||
type: ApproverType;
|
||||
}>) => {
|
||||
return (
|
||||
<components.Option isSelected={isSelected} {...props}>
|
||||
|
||||
@@ -554,31 +554,27 @@ export const SecretApprovalRequestChanges = ({
|
||||
>
|
||||
<Tooltip
|
||||
content={
|
||||
requiredApprover.firstName
|
||||
? `${requiredApprover.firstName || ""} ${requiredApprover.lastName || ""}`
|
||||
: undefined
|
||||
!isOrgMembershipActive
|
||||
? "This user has been deactivated and no longer has an active organization membership."
|
||||
: requiredApprover.firstName
|
||||
? `${requiredApprover.firstName || ""} ${requiredApprover.lastName || ""}`
|
||||
: undefined
|
||||
}
|
||||
position="left"
|
||||
sideOffset={10}
|
||||
>
|
||||
<div className="flex">
|
||||
<div className="flex items-center">
|
||||
<div>{requiredApprover?.email}</div>
|
||||
<span className="text-red">*</span>
|
||||
{!isOrgMembershipActive && (
|
||||
<FontAwesomeIcon
|
||||
icon={faUserSlash}
|
||||
size="xs"
|
||||
className="ml-1 text-mineshaft-300"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</Tooltip>
|
||||
|
||||
{!isOrgMembershipActive && (
|
||||
<Tooltip
|
||||
className="relative !z-[500]"
|
||||
content="This user has been deactivated and no longer has an active organization membership."
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={faUserSlash}
|
||||
size="xs"
|
||||
className="text-mineshaft-300"
|
||||
/>
|
||||
</Tooltip>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center">
|
||||
{reviewer?.comment && (
|
||||
@@ -632,24 +628,23 @@ export const SecretApprovalRequestChanges = ({
|
||||
>
|
||||
<Tooltip
|
||||
className="relative !z-[500]"
|
||||
content={`${reviewer.firstName || ""} ${reviewer.lastName || ""}`}
|
||||
content={
|
||||
!isOrgMembershipActive
|
||||
? "This user has been deactivated and no longer has an active organization membership."
|
||||
: `${reviewer.firstName || ""} ${reviewer.lastName || ""}`
|
||||
}
|
||||
>
|
||||
<div className="flex">
|
||||
<div className="flex items-center">
|
||||
<span>{reviewer?.email} </span>
|
||||
{!isOrgMembershipActive && (
|
||||
<FontAwesomeIcon
|
||||
icon={faUserSlash}
|
||||
size="xs"
|
||||
className="ml-1 text-mineshaft-300"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</Tooltip>
|
||||
{!isOrgMembershipActive && (
|
||||
<Tooltip
|
||||
className="relative !z-[500]"
|
||||
content="This user has been deactivated and no longer has an active organization membership."
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={faUserSlash}
|
||||
size="xs"
|
||||
className="text-mineshaft-300"
|
||||
/>
|
||||
</Tooltip>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
Reference in New Issue
Block a user