Allow multiple environments on secret and access policies

frontend/src/hooks/api/accessApproval/mutation.tsx

@@ -17,7 +17,7 @@ export const useCreateAccessApprovalPolicy = () => {
 
   return useMutation<object, object, TCreateAccessPolicyDTO>({
     mutationFn: async ({
-      environment,
+      environments,
       projectSlug,
       approvals,
       approvers,
@@ -29,7 +29,7 @@ export const useCreateAccessApprovalPolicy = () => {
       approvalsRequired
     }) => {
       const { data } = await apiRequest.post("/api/v1/access-approvals/policies", {
-        environment,
+        environments,
         projectSlug,
         approvals,
         bypassers,
@@ -63,7 +63,8 @@ export const useUpdateAccessApprovalPolicy = () => {
       secretPath,
       enforcementLevel,
       allowedSelfApprovals,
-      approvalsRequired
+      approvalsRequired,
+      environments
     }) => {
       const { data } = await apiRequest.patch(`/api/v1/access-approvals/policies/${id}`, {
         approvals,
@@ -73,7 +74,8 @@ export const useUpdateAccessApprovalPolicy = () => {
         name,
         enforcementLevel,
         allowedSelfApprovals,
-        approvalsRequired
+        approvalsRequired,
+        environments
       });
       return data;
     },

frontend/src/hooks/api/accessApproval/types.ts

@@ -10,7 +10,7 @@ export type TAccessApprovalPolicy = {
   secretPath: string;
   envId: string;
   workspace: string;
-  environment: WorkspaceEnv;
+  environments: WorkspaceEnv[];
   projectId: string;
   policyType: PolicyType;
   approversRequired: boolean;
@@ -166,7 +166,7 @@ export type TGetSecretApprovalPolicyOfBoardDTO = {
 export type TCreateAccessPolicyDTO = {
   projectSlug: string;
   name?: string;
-  environment: string;
+  environments: string[];
   approvers?: Approver[];
   bypassers?: Bypasser[];
   approvals?: number;
@@ -182,7 +182,7 @@ export type TUpdateAccessPolicyDTO = {
   approvers?: Approver[];
   bypassers?: Bypasser[];
   secretPath?: string;
-  environment?: string;
+  environments?: string[];
   approvals?: number;
   enforcementLevel?: EnforcementLevel;
   allowedSelfApprovals: boolean;

frontend/src/hooks/api/secretApproval/mutation.tsx

@@ -10,7 +10,7 @@ export const useCreateSecretApprovalPolicy = () => {
 
   return useMutation<object, object, TCreateSecretPolicyDTO>({
     mutationFn: async ({
-      environment,
+      environments,
       workspaceId,
       approvals,
       approvers,
@@ -21,7 +21,7 @@ export const useCreateSecretApprovalPolicy = () => {
       allowedSelfApprovals
     }) => {
       const { data } = await apiRequest.post("/api/v1/secret-approvals", {
-        environment,
+        environments,
         workspaceId,
         approvals,
         approvers,
@@ -53,7 +53,8 @@ export const useUpdateSecretApprovalPolicy = () => {
       secretPath,
       name,
       enforcementLevel,
-      allowedSelfApprovals
+      allowedSelfApprovals,
+      environments
     }) => {
       const { data } = await apiRequest.patch(`/api/v1/secret-approvals/${id}`, {
         approvals,
@@ -62,7 +63,8 @@ export const useUpdateSecretApprovalPolicy = () => {
         secretPath,
         name,
         enforcementLevel,
-        allowedSelfApprovals
+        allowedSelfApprovals,
+        environments
       });
       return data;
     },

frontend/src/hooks/api/secretApproval/types.ts

@@ -6,7 +6,7 @@ export type TSecretApprovalPolicy = {
   workspace: string;
   name: string;
   envId: string;
-  environment: WorkspaceEnv;
+  environments: WorkspaceEnv[];
   secretPath?: string;
   approvals: number;
   approvers: Approver[];
@@ -48,7 +48,7 @@ export type TGetSecretApprovalPolicyOfBoardDTO = {
 export type TCreateSecretPolicyDTO = {
   workspaceId: string;
   name?: string;
-  environment: string;
+  environments: string[];
   secretPath: string;
   approvers?: Approver[];
   bypassers?: Bypasser[];
@@ -68,6 +68,7 @@ export type TUpdateSecretPolicyDTO = {
   enforcementLevel?: EnforcementLevel;
   // for invalidating list
   workspaceId: string;
+  environments?: string[];
 };
 
 export type TDeleteSecretPolicyDTO = {

frontend/src/hooks/usePathAccessPolicies.tsx

@@ -49,7 +49,8 @@ export const usePathAccessPolicies = ({ secretPath, environment }: Params) => {
   return useMemo(() => {
     const pathPolicies = policies?.filter(
       (policy) =>
-        policy.environment.slug === environment && matchesPath(secretPath, policy.secretPath)
+        policy.environments?.some((env) => env.slug === environment) &&
+        matchesPath(secretPath, policy.secretPath)
     );
 
     return {

frontend/src/pages/project/AccessControlPage/components/MembersTab/components/MemberRoleForm/SpecificPrivilegeSection.tsx

@@ -155,8 +155,8 @@ export const SpecificPrivilegeSecretForm = ({
 
   const selectablePaths = useMemo(() => {
     if (!policies) return [];
-    const environmentPolicies = policies.filter(
-      (policy) => policy.environment.slug === selectedEnvironment
+    const environmentPolicies = policies.filter((policy) =>
+      policy.environments.find((env) => env.slug === selectedEnvironment)
     );
 
     privilegeForm.setValue("secretPath", "", {

frontend/src/pages/secret-manager/SecretApprovalsPage/components/ApprovalPolicyList/ApprovalPolicyList.tsx

@@ -166,17 +166,20 @@ export const ApprovalPolicyList = ({ workspaceId }: IProps) => {
   const filteredPolicies = useMemo(
     () =>
       policies
-        .filter(({ policyType, environment, name, secretPath }) => {
+        .filter(({ policyType, environments, name, secretPath }) => {
           if (filters.type && policyType !== filters.type) return false;
 
-          if (filters.environmentIds.length && !filters.environmentIds.includes(environment.id))
+          if (
+            filters.environmentIds.length &&
+            !environments.some((env) => filters.environmentIds.includes(env.id))
+          )
             return false;
 
           const searchValue = search.trim().toLowerCase();
 
           return (
             name.toLowerCase().includes(searchValue) ||
-            environment.name.toLowerCase().includes(searchValue) ||
+            environments.some((env) => env.name.toLowerCase().includes(searchValue)) ||
             (secretPath ?? "*").toLowerCase().includes(searchValue)
           );
         })
@@ -189,9 +192,18 @@ export const ApprovalPolicyList = ({ workspaceId }: IProps) => {
                 .toLowerCase()
                 .localeCompare(policyTwo.policyType.toLowerCase());
             case PolicyOrderBy.Environment:
-              return policyOne.environment.name
-                .toLowerCase()
-                .localeCompare(policyTwo.environment.name.toLowerCase());
+              // eslint-disable-next-line no-case-declarations
+              const getFirstEnvName = (policy: { environments: { name: string }[] }) => {
+                if (!policy.environments?.length) return "";
+                return (
+                  policy.environments
+                    .map((env) => env.name?.toLowerCase() || "")
+                    .filter((name) => name)
+                    .sort()[0] || ""
+                );
+              };
+
+              return getFirstEnvName(policyOne).localeCompare(getFirstEnvName(policyTwo));
             case PolicyOrderBy.SecretPath:
               return (policyOne.secretPath ?? "*")
                 .toLowerCase()

frontend/src/pages/secret-manager/SecretApprovalsPage/components/ApprovalPolicyList/components/AccessPolicyModal.tsx

@@ -54,7 +54,7 @@ type Props = {
 
 const formSchema = z
   .object({
-    environment: z.object({ slug: z.string(), name: z.string() }),
+    environments: z.array(z.object({ slug: z.string(), name: z.string() })).min(1),
     name: z.string().optional(),
     secretPath: z.string().trim().min(1),
     approvals: z.number().min(1).default(1),
@@ -134,7 +134,7 @@ const Form = ({
     values: editValues
       ? ({
           ...editValues,
-          environment: editValues.environment,
+          environments: editValues.environments,
           userApprovers:
             editValues?.approvers
               ?.filter((approver) => approver.type === ApproverType.User)
@@ -191,7 +191,7 @@ const Form = ({
   const { currentWorkspace } = useWorkspace();
   const { data: groups } = useListWorkspaceGroups(projectId);
 
-  const environments = currentWorkspace?.environments || [];
+  const availableEnvironments = currentWorkspace?.environments || [];
   const isAccessPolicyType = watch("policyType") === PolicyType.AccessPolicy;
 
   const { mutateAsync: createAccessApprovalPolicy } = useCreateAccessApprovalPolicy();
@@ -204,11 +204,11 @@ const Form = ({
 
   const formUserBypassers = watch("userBypassers");
   const formGroupBypassers = watch("groupBypassers");
-  const formEnvironment = watch("environment")?.slug;
+  const formEnvironments = watch("environments");
   const bypasserCount = (formUserBypassers || []).length + (formGroupBypassers || []).length;
 
   const handleCreatePolicy = async ({
-    environment,
+    environments,
     groupApprovers,
     userApprovers,
     groupBypassers,
@@ -226,7 +226,7 @@ const Form = ({
           ...data,
           approvers: [...userApprovers, ...groupApprovers],
           bypassers: bypassers.length > 0 ? bypassers : undefined,
-          environment: environment.slug,
+          environments: environments.map((env) => env.slug),
           workspaceId: currentWorkspace?.id || ""
         });
       } else {
@@ -242,7 +242,7 @@ const Form = ({
             numberOfApprovals: el.approvals
           })),
           bypassers: bypassers.length > 0 ? bypassers : undefined,
-          environment: environment.slug,
+          environments: environments.map((env) => env.slug),
           projectSlug
         });
       }
@@ -261,7 +261,7 @@ const Form = ({
   };
 
   const handleUpdatePolicy = async ({
-    environment,
+    environments,
     userApprovers,
     groupApprovers,
     userBypassers,
@@ -281,7 +281,8 @@ const Form = ({
           ...data,
           approvers: [...userApprovers, ...groupApprovers],
           bypassers: bypassers.length > 0 ? bypassers : undefined,
-          workspaceId: currentWorkspace?.id || ""
+          workspaceId: currentWorkspace?.id || "",
+          environments: environments.map((env) => env.slug)
         });
       } else {
         await updateAccessApprovalPolicy({
@@ -297,7 +298,7 @@ const Form = ({
             numberOfApprovals: el.approvals
           })),
           bypassers: bypassers.length > 0 ? bypassers : undefined,
-          environment: environment.slug,
+          environments: environments.map((env) => env.slug),
           projectSlug
         });
       }
@@ -479,14 +480,14 @@ const Form = ({
                 <SecretPathInput
                   {...field}
                   value={field.value || ""}
-                  environment={formEnvironment}
+                  environment={formEnvironments?.[0]?.slug || ""}
                 />
               </FormControl>
             )}
           />
           <Controller
             control={control}
-            name="environment"
+            name="environments"
             render={({ field: { value, onChange }, fieldState: { error } }) => (
               <FormControl
                 label="Environment"
@@ -496,11 +497,11 @@ const Form = ({
                 className="flex-1"
               >
                 <FilterableSelect
-                  isDisabled={isEditMode}
                   value={value}
+                  isMulti
                   onChange={onChange}
                   placeholder="Select environment..."
-                  options={environments}
+                  options={availableEnvironments}
                   getOptionValue={(option) => option.slug}
                   getOptionLabel={(option) => option.name}
                 />

frontend/src/pages/secret-manager/SecretApprovalsPage/components/ApprovalPolicyList/components/ApprovalPolicyRow.tsx

@@ -37,7 +37,7 @@ import { TWorkspaceUser } from "@app/hooks/api/users/types";
 interface IPolicy {
   id: string;
   name: string;
-  environment: WorkspaceEnv;
+  environments: WorkspaceEnv[];
   projectId?: string;
   secretPath?: string;
   approvals: number;
@@ -112,7 +112,7 @@ export const ApprovalPolicyRow = ({
         onClick={() => setIsExpanded.toggle()}
       >
         <Td>{policy.name || <span className="text-mineshaft-400">Unnamed Policy</span>}</Td>
-        <Td>{policy.environment.name}</Td>
+        <Td>{policy.environments.map((env) => env.name).join(", ")}</Td>
         <Td>{policy.secretPath || "*"}</Td>
         <Td>
           <Badge