feat: updated frontend project permission logic

frontend/src/views/Project/RolePage/components/RolePermissionsSection/RolePermissionsSection.tsx

@@ -10,13 +10,15 @@ import { ProjectPermissionSub, useWorkspace } from "@app/context";
 import { usePopUp } from "@app/hooks";
 import { useGetProjectRoleBySlug, useUpdateProjectRole } from "@app/hooks/api";
 
-import { GeneralPermissionOptions } from "./components/GeneralPermissionOptions";
+import { GeneralPermissionConditions } from "./components/GeneralPermissionConditions";
+import { GeneralPermissionPolicies } from "./components/GeneralPermissionPolicies";
 import { NewPermissionRule } from "./components/NewPermissionRule";
 import { SecretPermissionConditions } from "./components/SecretPermissionConditions";
 import { PermissionEmptyState } from "./PermissionEmptyState";
 import {
   formRolePermission2API,
   formSchema,
+  isConditionalSubjects,
   PROJECT_PERMISSION_OBJECT,
   rolePermission2Form,
   TFormSchema
@@ -27,6 +29,17 @@ type Props = {
   isDisabled?: boolean;
 };
 
+const renderConditionalComponents = (subject: ProjectPermissionSub, isDisabled?: boolean) => {
+  if (subject === ProjectPermissionSub.Secrets)
+    return <SecretPermissionConditions isDisabled={isDisabled} />;
+
+  if (isConditionalSubjects(subject)) {
+    return <GeneralPermissionConditions isDisabled={isDisabled} type={subject} />;
+  }
+
+  return undefined;
+};
+
 export const RolePermissionsSection = ({ roleSlug, isDisabled }: Props) => {
   const { currentWorkspace } = useWorkspace();
   const { popUp, handlePopUpToggle } = usePopUp(["createPolicy"] as const);
@@ -130,17 +143,15 @@ export const RolePermissionsSection = ({ roleSlug, isDisabled }: Props) => {
         <div className="py-4">
           {!isLoading && <PermissionEmptyState />}
           {(Object.keys(PROJECT_PERMISSION_OBJECT) as ProjectPermissionSub[]).map((subject) => (
-            <GeneralPermissionOptions
+            <GeneralPermissionPolicies
               subject={subject}
               actions={PROJECT_PERMISSION_OBJECT[subject].actions}
               title={PROJECT_PERMISSION_OBJECT[subject].title}
               key={`project-permission-${subject}`}
               isDisabled={isDisabled}
             >
-              {subject === ProjectPermissionSub.Secrets ? (
-                <SecretPermissionConditions isDisabled={isDisabled} />
-              ) : undefined}
-            </GeneralPermissionOptions>
+              {renderConditionalComponents(subject, isDisabled)}
+            </GeneralPermissionPolicies>
           ))}
         </div>
       </FormProvider>