mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-08 14:28:20 +00:00
Chore: Remove unused files
This commit is contained in:
-266
@@ -1,266 +0,0 @@
|
|||||||
import { useEffect } from "react";
|
|
||||||
import { Controller, useForm } from "react-hook-form";
|
|
||||||
import { faCheckCircle } from "@fortawesome/free-solid-svg-icons";
|
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
|
||||||
import { z } from "zod";
|
|
||||||
|
|
||||||
import { createNotification } from "@app/components/notifications";
|
|
||||||
import {
|
|
||||||
Button,
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuLabel,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
FormControl,
|
|
||||||
Input,
|
|
||||||
Modal,
|
|
||||||
ModalContent,
|
|
||||||
Select,
|
|
||||||
SelectItem
|
|
||||||
} from "@app/components/v2";
|
|
||||||
import { useWorkspace } from "@app/context";
|
|
||||||
import {
|
|
||||||
useCreateAccessApprovalPolicy,
|
|
||||||
useUpdateAccessApprovalPolicy
|
|
||||||
} from "@app/hooks/api/accessApproval";
|
|
||||||
import { TAccessApprovalPolicy } from "@app/hooks/api/accessApproval/types";
|
|
||||||
import { TWorkspaceUser } from "@app/hooks/api/users/types";
|
|
||||||
|
|
||||||
type Props = {
|
|
||||||
isOpen?: boolean;
|
|
||||||
onToggle: (isOpen: boolean) => void;
|
|
||||||
members?: TWorkspaceUser[];
|
|
||||||
projectSlug: string;
|
|
||||||
editValues?: TAccessApprovalPolicy;
|
|
||||||
};
|
|
||||||
|
|
||||||
const formSchema = z
|
|
||||||
.object({
|
|
||||||
environment: z.string(),
|
|
||||||
name: z.string().optional(),
|
|
||||||
secretPath: z.string().optional(),
|
|
||||||
approvals: z.number().min(1),
|
|
||||||
approvers: z.string().array().min(1)
|
|
||||||
})
|
|
||||||
.refine((data) => data.approvals <= data.approvers.length, {
|
|
||||||
path: ["approvals"],
|
|
||||||
message: "The number of approvals should be lower than the number of approvers."
|
|
||||||
});
|
|
||||||
|
|
||||||
type TFormSchema = z.infer<typeof formSchema>;
|
|
||||||
|
|
||||||
export const AccessPolicyForm = ({
|
|
||||||
isOpen,
|
|
||||||
onToggle,
|
|
||||||
members = [],
|
|
||||||
projectSlug,
|
|
||||||
editValues
|
|
||||||
}: Props) => {
|
|
||||||
const {
|
|
||||||
control,
|
|
||||||
handleSubmit,
|
|
||||||
reset,
|
|
||||||
formState: { isSubmitting }
|
|
||||||
} = useForm<TFormSchema>({
|
|
||||||
resolver: zodResolver(formSchema),
|
|
||||||
values: editValues ? { ...editValues, environment: editValues.environment.slug } : undefined
|
|
||||||
});
|
|
||||||
const { currentWorkspace } = useWorkspace();
|
|
||||||
|
|
||||||
const environments = currentWorkspace?.environments || [];
|
|
||||||
useEffect(() => {
|
|
||||||
if (!isOpen) reset({});
|
|
||||||
}, [isOpen]);
|
|
||||||
|
|
||||||
const isEditMode = Boolean(editValues);
|
|
||||||
|
|
||||||
const { mutateAsync: createAccessApprovalPolicy } = useCreateAccessApprovalPolicy();
|
|
||||||
const { mutateAsync: updateAccessApprovalPolicy } = useUpdateAccessApprovalPolicy();
|
|
||||||
|
|
||||||
const handleCreatePolicy = async (data: TFormSchema) => {
|
|
||||||
if (!projectSlug) return;
|
|
||||||
|
|
||||||
try {
|
|
||||||
await createAccessApprovalPolicy({
|
|
||||||
...data,
|
|
||||||
projectSlug
|
|
||||||
});
|
|
||||||
createNotification({
|
|
||||||
type: "success",
|
|
||||||
text: "Successfully created policy"
|
|
||||||
});
|
|
||||||
onToggle(false);
|
|
||||||
} catch (err) {
|
|
||||||
console.log(err);
|
|
||||||
createNotification({
|
|
||||||
type: "error",
|
|
||||||
text: "Failed to create policy"
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleUpdatePolicy = async (data: TFormSchema) => {
|
|
||||||
if (!projectSlug) return;
|
|
||||||
if (!editValues?.id) return;
|
|
||||||
|
|
||||||
try {
|
|
||||||
await updateAccessApprovalPolicy({
|
|
||||||
id: editValues?.id,
|
|
||||||
...data,
|
|
||||||
projectSlug
|
|
||||||
});
|
|
||||||
createNotification({
|
|
||||||
type: "success",
|
|
||||||
text: "Successfully updated policy"
|
|
||||||
});
|
|
||||||
onToggle(false);
|
|
||||||
} catch (err) {
|
|
||||||
console.log(err);
|
|
||||||
createNotification({
|
|
||||||
type: "error",
|
|
||||||
text: "failed to update policy"
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleFormSubmit = async (data: TFormSchema) => {
|
|
||||||
if (isEditMode) {
|
|
||||||
await handleUpdatePolicy(data);
|
|
||||||
} else {
|
|
||||||
await handleCreatePolicy(data);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal isOpen={isOpen} onOpenChange={onToggle}>
|
|
||||||
<ModalContent title={isEditMode ? "Edit Access Policy" : "Create Access Policy"}>
|
|
||||||
<form onSubmit={handleSubmit(handleFormSubmit)}>
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="name"
|
|
||||||
render={({ field, fieldState: { error } }) => (
|
|
||||||
<FormControl label="Policy Name" isError={Boolean(error)} errorText={error?.message}>
|
|
||||||
<Input {...field} value={field.value || ""} />
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="environment"
|
|
||||||
render={({ field: { value, onChange }, fieldState: { error } }) => (
|
|
||||||
<FormControl
|
|
||||||
label="Environment"
|
|
||||||
isRequired
|
|
||||||
className="mt-4"
|
|
||||||
isError={Boolean(error)}
|
|
||||||
errorText={error?.message}
|
|
||||||
>
|
|
||||||
<Select
|
|
||||||
isDisabled={isEditMode}
|
|
||||||
value={value}
|
|
||||||
onValueChange={(val) => onChange(val)}
|
|
||||||
className="w-full border border-mineshaft-500"
|
|
||||||
>
|
|
||||||
{environments.map((sourceEnvironment) => (
|
|
||||||
<SelectItem
|
|
||||||
value={sourceEnvironment.slug}
|
|
||||||
key={`azure-key-vault-environment-${sourceEnvironment.slug}`}
|
|
||||||
>
|
|
||||||
{sourceEnvironment.name}
|
|
||||||
</SelectItem>
|
|
||||||
))}
|
|
||||||
</Select>
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="secretPath"
|
|
||||||
render={({ field, fieldState: { error } }) => (
|
|
||||||
<FormControl label="Secret Path" isError={Boolean(error)} errorText={error?.message}>
|
|
||||||
<Input {...field} value={field.value || ""} />
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="approvers"
|
|
||||||
render={({ field: { value, onChange }, fieldState: { error } }) => (
|
|
||||||
<FormControl
|
|
||||||
label="Approvers Required"
|
|
||||||
isError={Boolean(error)}
|
|
||||||
errorText={error?.message}
|
|
||||||
>
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<Input
|
|
||||||
isReadOnly
|
|
||||||
value={value?.length ? `${value.length} selected` : "None"}
|
|
||||||
className="text-left"
|
|
||||||
/>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent
|
|
||||||
style={{ width: "var(--radix-dropdown-menu-trigger-width)" }}
|
|
||||||
align="start"
|
|
||||||
>
|
|
||||||
<DropdownMenuLabel>
|
|
||||||
Select members that are allowed to approve changes
|
|
||||||
</DropdownMenuLabel>
|
|
||||||
{members.map(({ id, user }) => {
|
|
||||||
const isChecked = value?.includes(id);
|
|
||||||
return (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={(evt) => {
|
|
||||||
evt.preventDefault();
|
|
||||||
onChange(
|
|
||||||
isChecked ? value?.filter((el) => el !== id) : [...(value || []), id]
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
key={`create-policy-members-${id}`}
|
|
||||||
iconPos="right"
|
|
||||||
icon={isChecked && <FontAwesomeIcon icon={faCheckCircle} />}
|
|
||||||
>
|
|
||||||
{user.email}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="approvals"
|
|
||||||
defaultValue={1}
|
|
||||||
render={({ field, fieldState: { error } }) => (
|
|
||||||
<FormControl
|
|
||||||
label="Approvals Required"
|
|
||||||
isError={Boolean(error)}
|
|
||||||
errorText={error?.message}
|
|
||||||
>
|
|
||||||
<Input
|
|
||||||
{...field}
|
|
||||||
type="number"
|
|
||||||
onChange={(el) => field.onChange(parseInt(el.target.value, 10))}
|
|
||||||
/>
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<div className="mt-8 flex items-center space-x-4">
|
|
||||||
<Button type="submit" isLoading={isSubmitting} isDisabled={isSubmitting}>
|
|
||||||
Save
|
|
||||||
</Button>
|
|
||||||
<Button onClick={() => onToggle(false)} variant="outline_bg">
|
|
||||||
Close
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</ModalContent>
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
-146
@@ -1,146 +0,0 @@
|
|||||||
import { useState } from "react";
|
|
||||||
import { faCheckCircle, faPencil, faTrash } from "@fortawesome/free-solid-svg-icons";
|
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
||||||
|
|
||||||
import { ProjectPermissionCan } from "@app/components/permissions";
|
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuLabel,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
IconButton,
|
|
||||||
Input,
|
|
||||||
Td,
|
|
||||||
Tr
|
|
||||||
} from "@app/components/v2";
|
|
||||||
import { ProjectPermissionActions, ProjectPermissionSub, useProjectPermission } from "@app/context";
|
|
||||||
import { useUpdateAccessApprovalPolicy } from "@app/hooks/api";
|
|
||||||
import { TAccessApprovalPolicy } from "@app/hooks/api/types";
|
|
||||||
import { TWorkspaceUser } from "@app/hooks/api/users/types";
|
|
||||||
|
|
||||||
type Props = {
|
|
||||||
policy: TAccessApprovalPolicy;
|
|
||||||
members?: TWorkspaceUser[];
|
|
||||||
projectSlug: string;
|
|
||||||
onEdit: () => void;
|
|
||||||
onDelete: () => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const AccessApprovalPolicyRow = ({
|
|
||||||
policy,
|
|
||||||
members = [],
|
|
||||||
projectSlug,
|
|
||||||
onEdit,
|
|
||||||
onDelete
|
|
||||||
}: Props) => {
|
|
||||||
const [selectedApprovers, setSelectedApprovers] = useState<string[]>([]);
|
|
||||||
const { mutate: updateAccessApprovalPolicy, isLoading } = useUpdateAccessApprovalPolicy();
|
|
||||||
const { permission } = useProjectPermission();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Tr>
|
|
||||||
<Td>{policy.name}</Td>
|
|
||||||
<Td>{policy.environment.slug}</Td>
|
|
||||||
<Td>{policy.secretPath || "*"}</Td>
|
|
||||||
<Td>
|
|
||||||
<DropdownMenu
|
|
||||||
onOpenChange={(isOpen) => {
|
|
||||||
if (!isOpen) {
|
|
||||||
updateAccessApprovalPolicy(
|
|
||||||
{
|
|
||||||
projectSlug,
|
|
||||||
id: policy.id,
|
|
||||||
approvers: selectedApprovers
|
|
||||||
},
|
|
||||||
{
|
|
||||||
onSettled: () => {
|
|
||||||
setSelectedApprovers([]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
setSelectedApprovers(policy.approvers);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<DropdownMenuTrigger
|
|
||||||
asChild
|
|
||||||
disabled={
|
|
||||||
isLoading ||
|
|
||||||
permission.cannot(ProjectPermissionActions.Edit, ProjectPermissionSub.SecretApproval)
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<Input
|
|
||||||
isReadOnly
|
|
||||||
value={policy.approvers?.length ? `${policy.approvers.length} selected` : "None"}
|
|
||||||
className="text-left"
|
|
||||||
/>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent
|
|
||||||
style={{ width: "var(--radix-dropdown-menu-trigger-width)" }}
|
|
||||||
align="start"
|
|
||||||
>
|
|
||||||
<DropdownMenuLabel>
|
|
||||||
Select members that are allowed to approve changes
|
|
||||||
</DropdownMenuLabel>
|
|
||||||
{members?.map(({ id, user }) => {
|
|
||||||
const isChecked = selectedApprovers.includes(id);
|
|
||||||
return (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={(evt) => {
|
|
||||||
evt.preventDefault();
|
|
||||||
setSelectedApprovers((state) =>
|
|
||||||
isChecked ? state.filter((el) => el !== id) : [...state, id]
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
key={`create-policy-members-${id}`}
|
|
||||||
iconPos="right"
|
|
||||||
icon={isChecked && <FontAwesomeIcon icon={faCheckCircle} />}
|
|
||||||
>
|
|
||||||
{user.email}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
</Td>
|
|
||||||
<Td>{policy.approvals}</Td>
|
|
||||||
<Td>
|
|
||||||
<div className="flex items-center justify-end space-x-4">
|
|
||||||
<ProjectPermissionCan
|
|
||||||
I={ProjectPermissionActions.Edit}
|
|
||||||
a={ProjectPermissionSub.SecretApproval}
|
|
||||||
renderTooltip
|
|
||||||
allowedLabel="Edit"
|
|
||||||
>
|
|
||||||
{(isAllowed) => (
|
|
||||||
<IconButton variant="plain" ariaLabel="edit" onClick={onEdit} isDisabled={!isAllowed}>
|
|
||||||
<FontAwesomeIcon icon={faPencil} size="lg" />
|
|
||||||
</IconButton>
|
|
||||||
)}
|
|
||||||
</ProjectPermissionCan>
|
|
||||||
<ProjectPermissionCan
|
|
||||||
I={ProjectPermissionActions.Delete}
|
|
||||||
a={ProjectPermissionSub.SecretApproval}
|
|
||||||
renderTooltip
|
|
||||||
allowedLabel="Delete"
|
|
||||||
>
|
|
||||||
{(isAllowed) => (
|
|
||||||
<IconButton
|
|
||||||
variant="plain"
|
|
||||||
colorSchema="danger"
|
|
||||||
size="lg"
|
|
||||||
ariaLabel="edit"
|
|
||||||
onClick={onDelete}
|
|
||||||
isDisabled={!isAllowed}
|
|
||||||
>
|
|
||||||
<FontAwesomeIcon icon={faTrash} />
|
|
||||||
</IconButton>
|
|
||||||
)}
|
|
||||||
</ProjectPermissionCan>
|
|
||||||
</div>
|
|
||||||
</Td>
|
|
||||||
</Tr>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
-261
@@ -1,261 +0,0 @@
|
|||||||
import { useEffect } from "react";
|
|
||||||
import { Controller, useForm } from "react-hook-form";
|
|
||||||
import { faCheckCircle } from "@fortawesome/free-solid-svg-icons";
|
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
|
||||||
import { z } from "zod";
|
|
||||||
|
|
||||||
import { createNotification } from "@app/components/notifications";
|
|
||||||
import {
|
|
||||||
Button,
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuLabel,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
FormControl,
|
|
||||||
Input,
|
|
||||||
Modal,
|
|
||||||
ModalContent,
|
|
||||||
Select,
|
|
||||||
SelectItem
|
|
||||||
} from "@app/components/v2";
|
|
||||||
import { useWorkspace } from "@app/context";
|
|
||||||
import {
|
|
||||||
useCreateAccessApprovalPolicy,
|
|
||||||
useUpdateAccessApprovalPolicy
|
|
||||||
} from "@app/hooks/api/accessApproval";
|
|
||||||
import { TAccessApprovalPolicy } from "@app/hooks/api/accessApproval/types";
|
|
||||||
import { TWorkspaceUser } from "@app/hooks/api/users/types";
|
|
||||||
|
|
||||||
type Props = {
|
|
||||||
isOpen?: boolean;
|
|
||||||
onToggle: (isOpen: boolean) => void;
|
|
||||||
members?: TWorkspaceUser[];
|
|
||||||
projectSlug: string;
|
|
||||||
editValues?: TAccessApprovalPolicy;
|
|
||||||
};
|
|
||||||
|
|
||||||
const formSchema = z
|
|
||||||
.object({
|
|
||||||
environment: z.string(),
|
|
||||||
name: z.string().optional(),
|
|
||||||
secretPath: z.string().optional(),
|
|
||||||
approvals: z.number().min(1),
|
|
||||||
approvers: z.string().array().min(1)
|
|
||||||
})
|
|
||||||
.refine((data) => data.approvals <= data.approvers.length, {
|
|
||||||
path: ["approvals"],
|
|
||||||
message: "The number of approvals should be lower than the number of approvers."
|
|
||||||
});
|
|
||||||
|
|
||||||
type TFormSchema = z.infer<typeof formSchema>;
|
|
||||||
|
|
||||||
export const AccessPolicyForm = ({
|
|
||||||
isOpen,
|
|
||||||
onToggle,
|
|
||||||
members = [],
|
|
||||||
projectSlug,
|
|
||||||
editValues
|
|
||||||
}: Props) => {
|
|
||||||
const {
|
|
||||||
control,
|
|
||||||
handleSubmit,
|
|
||||||
reset,
|
|
||||||
formState: { isSubmitting }
|
|
||||||
} = useForm<TFormSchema>({
|
|
||||||
resolver: zodResolver(formSchema),
|
|
||||||
values: editValues ? { ...editValues, environment: editValues.environment.slug } : undefined
|
|
||||||
});
|
|
||||||
const { currentWorkspace } = useWorkspace();
|
|
||||||
|
|
||||||
const environments = currentWorkspace?.environments || [];
|
|
||||||
useEffect(() => {
|
|
||||||
if (!isOpen) reset({});
|
|
||||||
}, [isOpen]);
|
|
||||||
|
|
||||||
const isEditMode = Boolean(editValues);
|
|
||||||
|
|
||||||
const { mutateAsync: createAccessApprovalPolicy } = useCreateAccessApprovalPolicy();
|
|
||||||
const { mutateAsync: updateAccessApprovalPolicy } = useUpdateAccessApprovalPolicy();
|
|
||||||
|
|
||||||
const handleCreatePolicy = async (data: TFormSchema) => {
|
|
||||||
try {
|
|
||||||
await createAccessApprovalPolicy({
|
|
||||||
...data,
|
|
||||||
projectSlug
|
|
||||||
});
|
|
||||||
createNotification({
|
|
||||||
type: "success",
|
|
||||||
text: "Successfully created policy"
|
|
||||||
});
|
|
||||||
onToggle(false);
|
|
||||||
} catch (err) {
|
|
||||||
console.log(err);
|
|
||||||
createNotification({
|
|
||||||
type: "error",
|
|
||||||
text: "Failed to create policy"
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleUpdatePolicy = async (data: TFormSchema) => {
|
|
||||||
if (!editValues?.id) return;
|
|
||||||
try {
|
|
||||||
await updateAccessApprovalPolicy({
|
|
||||||
id: editValues?.id,
|
|
||||||
...data,
|
|
||||||
projectSlug
|
|
||||||
});
|
|
||||||
createNotification({
|
|
||||||
type: "success",
|
|
||||||
text: "Successfully updated policy"
|
|
||||||
});
|
|
||||||
onToggle(false);
|
|
||||||
} catch (err) {
|
|
||||||
console.log(err);
|
|
||||||
createNotification({
|
|
||||||
type: "error",
|
|
||||||
text: "failed to update policy"
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleFormSubmit = async (data: TFormSchema) => {
|
|
||||||
if (isEditMode) {
|
|
||||||
await handleUpdatePolicy(data);
|
|
||||||
} else {
|
|
||||||
await handleCreatePolicy(data);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal isOpen={isOpen} onOpenChange={onToggle}>
|
|
||||||
<ModalContent title={isEditMode ? "Edit Access Policy" : "Create Access Policy"}>
|
|
||||||
<form onSubmit={handleSubmit(handleFormSubmit)}>
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="name"
|
|
||||||
render={({ field, fieldState: { error } }) => (
|
|
||||||
<FormControl label="Policy Name" isError={Boolean(error)} errorText={error?.message}>
|
|
||||||
<Input {...field} value={field.value || ""} />
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="environment"
|
|
||||||
render={({ field: { value, onChange }, fieldState: { error } }) => (
|
|
||||||
<FormControl
|
|
||||||
label="Environment"
|
|
||||||
isRequired
|
|
||||||
className="mt-4"
|
|
||||||
isError={Boolean(error)}
|
|
||||||
errorText={error?.message}
|
|
||||||
>
|
|
||||||
<Select
|
|
||||||
value={value}
|
|
||||||
onValueChange={(val) => onChange(val)}
|
|
||||||
className="w-full border border-mineshaft-500"
|
|
||||||
>
|
|
||||||
{environments.map((sourceEnvironment) => (
|
|
||||||
<SelectItem
|
|
||||||
value={sourceEnvironment.slug}
|
|
||||||
key={`azure-key-vault-environment-${sourceEnvironment.slug}`}
|
|
||||||
>
|
|
||||||
{sourceEnvironment.name}
|
|
||||||
</SelectItem>
|
|
||||||
))}
|
|
||||||
</Select>
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="secretPath"
|
|
||||||
render={({ field, fieldState: { error } }) => (
|
|
||||||
<FormControl label="Secret Path" isError={Boolean(error)} errorText={error?.message}>
|
|
||||||
<Input {...field} value={field.value || ""} />
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="approvers"
|
|
||||||
render={({ field: { value, onChange }, fieldState: { error } }) => (
|
|
||||||
<FormControl
|
|
||||||
label="Approvers Required"
|
|
||||||
isError={Boolean(error)}
|
|
||||||
errorText={error?.message}
|
|
||||||
>
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<Input
|
|
||||||
isReadOnly
|
|
||||||
value={value?.length ? `${value.length} selected` : "None"}
|
|
||||||
className="text-left"
|
|
||||||
/>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent
|
|
||||||
style={{ width: "var(--radix-dropdown-menu-trigger-width)" }}
|
|
||||||
align="start"
|
|
||||||
>
|
|
||||||
<DropdownMenuLabel>
|
|
||||||
Select members that are allowed to approve changes
|
|
||||||
</DropdownMenuLabel>
|
|
||||||
{members.map(({ id, user }) => {
|
|
||||||
const isChecked = value?.includes(id);
|
|
||||||
return (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={(evt) => {
|
|
||||||
evt.preventDefault();
|
|
||||||
onChange(
|
|
||||||
isChecked ? value?.filter((el) => el !== id) : [...(value || []), id]
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
key={`create-policy-members-${id}`}
|
|
||||||
iconPos="right"
|
|
||||||
icon={isChecked && <FontAwesomeIcon icon={faCheckCircle} />}
|
|
||||||
>
|
|
||||||
{user.email}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<Controller
|
|
||||||
control={control}
|
|
||||||
name="approvals"
|
|
||||||
defaultValue={1}
|
|
||||||
render={({ field, fieldState: { error } }) => (
|
|
||||||
<FormControl
|
|
||||||
label="Approvals Required"
|
|
||||||
isError={Boolean(error)}
|
|
||||||
errorText={error?.message}
|
|
||||||
>
|
|
||||||
<Input
|
|
||||||
{...field}
|
|
||||||
type="number"
|
|
||||||
onChange={(el) => field.onChange(parseInt(el.target.value, 10))}
|
|
||||||
/>
|
|
||||||
</FormControl>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<div className="mt-8 flex items-center space-x-4">
|
|
||||||
<Button type="submit" isLoading={isSubmitting} isDisabled={isSubmitting}>
|
|
||||||
Save
|
|
||||||
</Button>
|
|
||||||
<Button onClick={() => onToggle(false)} variant="outline_bg">
|
|
||||||
Close
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</ModalContent>
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
Reference in New Issue
Block a user