Fix type issues

backend/src/ee/services/ssh/ssh-certificate-authority-service.ts

@@ -11,7 +11,6 @@ import { TSshCertificateAuthoritySecretDALFactory } from "@app/ee/services/ssh/s
 import { TSshCertificateTemplateDALFactory } from "@app/ee/services/ssh-certificate-template/ssh-certificate-template-dal";
 import { NotFoundError } from "@app/lib/errors";
 import { TKmsServiceFactory } from "@app/services/kms/kms-service";
-import { TProjectDALFactory } from "@app/services/project/project-dal";
 
 import {
   createSshCert,
@@ -39,7 +38,6 @@ type TSshCertificateAuthorityServiceFactoryDep = {
   >;
   sshCertificateAuthoritySecretDAL: Pick<TSshCertificateAuthoritySecretDALFactory, "create" | "findOne">;
   sshCertificateTemplateDAL: Pick<TSshCertificateTemplateDALFactory, "find" | "getByName">;
-  projectDAL: Pick<TProjectDALFactory, "findProjectBySlug" | "findOne" | "updateById" | "findById" | "transaction">;
   kmsService: Pick<TKmsServiceFactory, "generateKmsKey" | "encryptWithKmsKey" | "decryptWithKmsKey" | "getOrgKmsKeyId">;
   permissionService: Pick<TPermissionServiceFactory, "getOrgPermission">;
 };

backend/src/server/routes/index.ts

@@ -808,7 +808,6 @@ export const registerRoutes = async (
     projectRoleDAL,
     folderDAL,
     licenseService,
-    sshCertificateAuthorityDAL,
     certificateAuthorityDAL,
     certificateDAL,
     pkiAlertDAL,

frontend/src/views/Org/RolePage/components/OrgRoleModifySection.utils.ts

@@ -62,7 +62,7 @@ export const formSchema = z.object({
       [OrgPermissionSubjects.Kms]: generalPermissionSchema,
       [OrgPermissionSubjects.ProjectTemplates]: generalPermissionSchema,
       [OrgPermissionSubjects.SshCertificateAuthorities]: generalPermissionSchema,
-      [OrgPermissionSubjects.SshCertificateTemplates]: sshCertificateTemplatePermissionSchmea
+      "ssh-certificate-templates": sshCertificateTemplatePermissionSchmea
     })
     .optional()
 });

frontend/src/views/Org/RolePage/components/RolePermissionsSection/RolePermissionRow.tsx

@@ -51,15 +51,6 @@ const PROJECT_TEMPLATES_PERMISSIONS = [
   { action: "delete", label: "Remove" }
 ] as const;
 
-const SSH_CERTIFICATE_TEMPLATES_PERMISSIONS = [
-  { action: "read", label: "Read" },
-  { action: "create", label: "Create" },
-  { action: "edit", label: "Modify" },
-  { action: "delete", label: "Remove" },
-  { action: "sign-ssh-key", label: "Sign SSH Key" },
-  { action: "issue-ssh-credentials", label: "Issue SSH Credentials" }
-] as const;
-
 const getPermissionList = (option: string) => {
   switch (option) {
     case "secret-scanning":
@@ -72,8 +63,6 @@ const getPermissionList = (option: string) => {
       return MEMBERS_PERMISSIONS;
     case OrgPermissionSubjects.ProjectTemplates:
       return PROJECT_TEMPLATES_PERMISSIONS;
-    case OrgPermissionSubjects.SshCertificateTemplates:
-      return SSH_CERTIFICATE_TEMPLATES_PERMISSIONS;
     default:
       return PERMISSIONS;
   }

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

@@ -15,6 +15,7 @@ import {
 import { OrgPermissionAdminConsoleRow } from "./OrgPermissionAdminConsoleRow";
 import { OrgRoleWorkspaceRow } from "./OrgRoleWorkspaceRow";
 import { RolePermissionRow } from "./RolePermissionRow";
+import { SshCertificateTemplateRow } from "./SshCertificateTemplateRow";
 
 const SIMPLE_PERMISSION_OPTIONS = [
   {
@@ -73,10 +74,6 @@ const SIMPLE_PERMISSION_OPTIONS = [
   {
     title: "SSH Certificate Authorities",
     formName: OrgPermissionSubjects.SshCertificateAuthorities
-  },
-  {
-    title: "SSH Certificate Templates",
-    formName: OrgPermissionSubjects.SshCertificateTemplates
   }
 ] as const;
 
@@ -172,6 +169,11 @@ export const RolePermissionsSection = ({ roleId }: Props) => {
                   />
                 );
               })}
+              <SshCertificateTemplateRow
+                control={control}
+                setValue={setValue}
+                isEditable={isCustomRole}
+              />
               <OrgRoleWorkspaceRow
                 control={control}
                 setValue={setValue}

frontend/src/views/Org/RolePage/components/RolePermissionsSection/SshCertificateTemplateRow.tsx

@@ -0,0 +1,137 @@
+import { useEffect, useMemo } from "react";
+import { Control, Controller, UseFormSetValue, useWatch } from "react-hook-form";
+import { faChevronDown, faChevronRight } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { createNotification } from "@app/components/notifications";
+import { Checkbox, Select, SelectItem, Td, Tr } from "@app/components/v2";
+import { OrgPermissionSubjects } from "@app/context";
+import { useToggle } from "@app/hooks";
+import { TFormSchema } from "@app/views/Org/RolePage/components/OrgRoleModifySection.utils";
+
+type Props = {
+  isEditable: boolean;
+  setValue: UseFormSetValue<TFormSchema>;
+  control: Control<TFormSchema>;
+};
+
+enum Permission {
+  NoAccess = "no-access",
+  Custom = "custom"
+}
+
+const PERMISSION_ACTIONS = [
+  { action: "read", label: "Read" },
+  { action: "create", label: "Create" },
+  { action: "edit", label: "Modify" },
+  { action: "delete", label: "Remove" },
+  { action: "sign-ssh-key", label: "Sign SSH Key" },
+  { action: "issue-ssh-credentials", label: "Issue SSH Credentials" }
+] as const;
+
+export const SshCertificateTemplateRow = ({ isEditable, control, setValue }: Props) => {
+  const [isRowExpanded, setIsRowExpanded] = useToggle();
+  const [isCustom, setIsCustom] = useToggle();
+
+  const rule = useWatch({
+    control,
+    name: "permissions.ssh-certificate-templates"
+  });
+
+  const selectedPermissionCategory = useMemo(() => {
+    if (rule?.create) {
+      return Permission.Custom;
+    }
+    return Permission.NoAccess;
+  }, [rule, isCustom]);
+
+  useEffect(() => {
+    if (selectedPermissionCategory === Permission.Custom) setIsCustom.on();
+    else setIsCustom.off();
+  }, [selectedPermissionCategory]);
+
+  useEffect(() => {
+    const isRowCustom = selectedPermissionCategory === Permission.Custom;
+    if (isRowCustom) {
+      setIsRowExpanded.on();
+    }
+  }, []);
+
+  const handlePermissionChange = (val: Permission) => {
+    if (!val) return;
+    if (val === Permission.Custom) {
+      setIsRowExpanded.on();
+      setIsCustom.on();
+      return;
+    }
+    setIsCustom.off();
+
+    if (val === Permission.NoAccess) {
+      setValue("permissions.workspace", { create: false }, { shouldDirty: true });
+    }
+  };
+
+  return (
+    <>
+      <Tr
+        className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
+        onClick={() => setIsRowExpanded.toggle()}
+      >
+        <Td>
+          <FontAwesomeIcon icon={isRowExpanded ? faChevronDown : faChevronRight} />
+        </Td>
+        <Td>SSH Certificate Templates</Td>
+        <Td>
+          <Select
+            value={selectedPermissionCategory}
+            className="w-40 bg-mineshaft-600"
+            dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
+            onValueChange={handlePermissionChange}
+            isDisabled={!isEditable}
+          >
+            <SelectItem value={Permission.NoAccess}>No Access</SelectItem>
+            <SelectItem value={Permission.Custom}>Custom</SelectItem>
+          </Select>
+        </Td>
+      </Tr>
+      {isRowExpanded && (
+        <Tr>
+          <Td
+            colSpan={3}
+            className={`bg-bunker-600 px-0 py-0 ${isRowExpanded && " border-mineshaft-500 p-8"}`}
+          >
+            <div className="grid grid-cols-3 gap-4">
+              {PERMISSION_ACTIONS.map(({ action, label }) => {
+                return (
+                  <Controller
+                    name={`permissions.${OrgPermissionSubjects.SshCertificateTemplates}.${action}`}
+                    key={`permissions.${OrgPermissionSubjects.SshCertificateTemplates}.${action}`}
+                    control={control}
+                    render={({ field }) => (
+                      <Checkbox
+                        isChecked={field.value}
+                        onCheckedChange={(e) => {
+                          if (!isEditable) {
+                            createNotification({
+                              type: "error",
+                              text: "Failed to update default role"
+                            });
+                            return;
+                          }
+                          field.onChange(e);
+                        }}
+                        id={`permissions.${OrgPermissionSubjects.SshCertificateTemplates}.${action}`}
+                      >
+                        {label}
+                      </Checkbox>
+                    )}
+                  />
+                );
+              })}
+            </div>
+          </Td>
+        </Tr>
+      )}
+    </>
+  );
+};