From 3a31cc61708e0812261fad3c836f44113545b3dd Mon Sep 17 00:00:00 2001
From: Aditya Thebe <contact@adityathebe.com>
Date: Wed, 1 Oct 2025 16:15:07 +0545
Subject: [PATCH 1/4] fix(permission): Update the table after saving permission

---
 .../ManagePermissions/Forms/DeletePermission.tsx           | 4 +++-
 .../Permissions/ManagePermissions/Forms/PermissionForm.tsx | 7 ++++---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/Permissions/ManagePermissions/Forms/DeletePermission.tsx b/src/components/Permissions/ManagePermissions/Forms/DeletePermission.tsx
index fd4b19051..6df824457 100644
--- a/src/components/Permissions/ManagePermissions/Forms/DeletePermission.tsx
+++ b/src/components/Permissions/ManagePermissions/Forms/DeletePermission.tsx
@@ -5,7 +5,7 @@ import {
 } from "@flanksource-ui/components/Toast/toast";
 import { ConfirmationPromptDialog } from "@flanksource-ui/ui/AlertDialog/ConfirmationPromptDialog";
 import { Button } from "@flanksource-ui/ui/Buttons/Button";
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AxiosError } from "axios";
 import { useCallback, useState } from "react";
 import { FaCircleNotch, FaTrash } from "react-icons/fa";
@@ -18,6 +18,7 @@ export default function DeletePermission({
   onDeleted: () => void;
 }) {
   const [isConfirmDialogOpen, setIsConfirmDialogOpen] = useState(false);
+  const queryClient = useQueryClient();
 
   const { mutate: deleteResource, isLoading } = useMutation({
     mutationFn: async (id: string) => {
@@ -26,6 +27,7 @@ export default function DeletePermission({
     },
     onSuccess: (_) => {
       toastSuccess("Permission deleted");
+      queryClient.invalidateQueries({ queryKey: ["permissions_summary"] });
       onDeleted();
     },
     onError: (error: AxiosError) => {
diff --git a/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx b/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx
index 2c007d607..ae4402a04 100644
--- a/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx
+++ b/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx
@@ -16,7 +16,7 @@ import { useUser } from "@flanksource-ui/context";
 import { tables } from "@flanksource-ui/context/UserAccessContext/permissions";
 import { Button } from "@flanksource-ui/ui/Buttons/Button";
 import { Modal } from "@flanksource-ui/ui/Modal";
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AxiosError } from "axios";
 import clsx from "clsx";
 import { Form, Formik, useFormikContext } from "formik";
@@ -85,6 +85,7 @@ export default function PermissionForm({
   }, [data]);
 
   const { user } = useUser();
+  const queryClient = useQueryClient();
 
   const { data: agents } = useAllAgentNamesQuery({});
 
@@ -106,8 +107,8 @@ export default function PermissionForm({
       return res.data;
     },
     onSuccess: () => {
-      // do something
       toastSuccess("Permission added");
+      queryClient.invalidateQueries({ queryKey: ["permissions_summary"] });
       onClose();
     },
     onError: (error: AxiosError) => {
@@ -126,8 +127,8 @@ export default function PermissionForm({
       return res.data;
     },
     onSuccess: () => {
-      // do something
       toastSuccess("Permission updated");
+      queryClient.invalidateQueries({ queryKey: ["permissions_summary"] });
       onClose();
     },
     onError: (error: AxiosError) => {

From aba71a219edd24fb0f84c332b4dd3060c3bbddfb Mon Sep 17 00:00:00 2001
From: Aditya Thebe <contact@adityathebe.com>
Date: Wed, 1 Oct 2025 16:15:28 +0545
Subject: [PATCH 2/4] fix: Persion must be the first tab on the subject list

---
 .../ManagePermissions/Forms/PermissionSubjectControls.tsx       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Permissions/ManagePermissions/Forms/PermissionSubjectControls.tsx b/src/components/Permissions/ManagePermissions/Forms/PermissionSubjectControls.tsx
index b6b582d4e..966683285 100644
--- a/src/components/Permissions/ManagePermissions/Forms/PermissionSubjectControls.tsx
+++ b/src/components/Permissions/ManagePermissions/Forms/PermissionSubjectControls.tsx
@@ -48,7 +48,7 @@ export default function PermissionsSubjectControls() {
       <div>
         <div className="flex w-full flex-row">
           <Switch
-            options={["Team", "Person", "Notification", "Role", "Playbook"]}
+            options={["Person", "Team", "Notification", "Role", "Playbook"]}
             className="w-auto"
             itemsClassName=""
             defaultValue="Go Template"

From 98957efb541efb593ef219e5a2ee95a4635f03e7 Mon Sep 17 00:00:00 2001
From: Aditya Thebe <contact@adityathebe.com>
Date: Wed, 1 Oct 2025 16:38:41 +0545
Subject: [PATCH 3/4] feat: add source to permission summary

* CRD linked permission must be readonly
---
 src/api/services/permissions.ts               |  4 +-
 src/api/types/permissions.ts                  |  3 +-
 .../Forms/PermissionForm.tsx                  | 93 ++++++++++++-------
 .../Permissions/PermissionsTable.tsx          |  8 +-
 .../Permissions/PermissionsView.tsx           |  4 +-
 5 files changed, 70 insertions(+), 42 deletions(-)

diff --git a/src/api/services/permissions.ts b/src/api/services/permissions.ts
index 4bbe59df9..aef9f4237 100644
--- a/src/api/services/permissions.ts
+++ b/src/api/services/permissions.ts
@@ -1,6 +1,6 @@
 import { IncidentCommander } from "../axios";
 import { resolvePostGrestRequestWithPagination } from "../resolve";
-import { PermissionAPIResponse, PermissionTable } from "../types/permissions";
+import { PermissionsSummary, PermissionTable } from "../types/permissions";
 
 export type FetchPermissionsInput = {
   componentId?: string;
@@ -74,7 +74,7 @@ export function fetchPermissions(
 
   const url = `/permissions_summary?${queryParam}&select=${selectFields.join(",")}&deleted_at=is.null&limit=${pageSize}&offset=${pageIndex * pageSize}`;
   return resolvePostGrestRequestWithPagination(
-    IncidentCommander.get<PermissionAPIResponse[]>(url, {
+    IncidentCommander.get<PermissionsSummary[]>(url, {
       headers: {
         Prefer: "count=exact"
       }
diff --git a/src/api/types/permissions.ts b/src/api/types/permissions.ts
index 0d269e374..86daf98ec 100644
--- a/src/api/types/permissions.ts
+++ b/src/api/types/permissions.ts
@@ -45,10 +45,11 @@ export type PermissionTable = {
   playbook_id?: string;
 };
 
-export type PermissionAPIResponse = PermissionTable & {
+export type PermissionsSummary = PermissionTable & {
   // checks: Pick<HealthCheck, "id" | "name" | "type" | "status">;
   catalog: Pick<ConfigItem, "id" | "name" | "type" | "config_class">;
   component: Pick<Topology, "id" | "name" | "icon">;
+  source?: string;
   canary: {
     id: string;
     name: string;
diff --git a/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx b/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx
index ae4402a04..13cc253da 100644
--- a/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx
+++ b/src/components/Permissions/ManagePermissions/Forms/PermissionForm.tsx
@@ -36,7 +36,7 @@ type PermissionFormProps = {
   data?: Partial<PermissionTable>;
 };
 
-function PermissionActionDropdown() {
+function PermissionActionDropdown({ isDisabled }: { isDisabled?: boolean }) {
   const { values } = useFormikContext<Partial<PermissionTable>>();
 
   const resourceType = useMemo<ResourceType | undefined>(() => {
@@ -63,17 +63,68 @@ function PermissionActionDropdown() {
       options={availableActions}
       name="action"
       label="Action"
+      isDisabled={isDisabled}
     />
   );
 }
 
+function PermissionFormContent({
+  isResourceIdProvided,
+  agentOptions,
+  source
+}: {
+  isResourceIdProvided: boolean;
+  agentOptions: { label: string; value: string }[];
+  source?: string;
+}) {
+  const isReadOnly = source === "KubernetesCRD";
+
+  return (
+    <div className="flex flex-col gap-3 p-4">
+      <PermissionsSubjectControls />
+      {isResourceIdProvided ? (
+        <div className="flex flex-col gap-2">
+          <label className="text-sm font-semibold">Resource</label>
+          <PermissionResource />
+        </div>
+      ) : (
+        <FormikPermissionSelectResourceFields />
+      )}
+      <PermissionActionDropdown isDisabled={isReadOnly} />
+      <FormikCheckbox name="deny" label="Deny" disabled={isReadOnly} />
+      <div className="rounded-lg border border-gray-200 bg-gray-50 p-4">
+        <div className="space-y-3">
+          <FormikKeyValueMapField
+            name="tags"
+            label="Tags"
+            hint="Permission will apply only to resources matching these tags"
+          />
+          <FormikSelectDropdown
+            name="agents"
+            label="Agents"
+            options={agentOptions}
+            isMulti
+            placeholder="Select agents..."
+            isDisabled={isReadOnly}
+          />
+        </div>
+      </div>
+      <FormikTextArea
+        name="description"
+        label="Description"
+        disabled={isReadOnly}
+      />
+    </div>
+  );
+}
+
 export default function PermissionForm({
   onClose,
   isOpen = false,
   data
 }: PermissionFormProps) {
   const isResourceIdProvided = useMemo(() => {
-    return (
+    return !!(
       data?.component_id ||
       data?.config_id ||
       data?.canary_id ||
@@ -188,42 +239,18 @@ export default function PermissionForm({
           }}
         >
           <Form className="flex flex-1 flex-col gap-2 overflow-y-auto">
-            <div className="flex flex-1 flex-col gap-3 p-4">
-              <PermissionsSubjectControls />
-              {isResourceIdProvided ? (
-                <div className="flex flex-col gap-2">
-                  <label className="text-sm font-semibold">Resource</label>
-                  <PermissionResource />
-                </div>
-              ) : (
-                <FormikPermissionSelectResourceFields />
-              )}
-              <PermissionActionDropdown />
-              <FormikCheckbox name="deny" label="Deny" />
-              <div className="rounded-lg border border-gray-200 bg-gray-50 p-4">
-                <div className="space-y-3">
-                  <FormikKeyValueMapField
-                    name="tags"
-                    label="Tags"
-                    hint="Permission will apply only to resources matching these tags"
-                  />
-                  <FormikSelectDropdown
-                    name="agents"
-                    label="Agents"
-                    options={agentOptions}
-                    isMulti
-                    placeholder="Select agents..."
-                  />
-                </div>
-              </div>
-              <FormikTextArea name="description" label="Description" />
+            <div className="flex flex-1 flex-col overflow-y-auto">
+              <PermissionFormContent
+                isResourceIdProvided={isResourceIdProvided}
+                agentOptions={agentOptions}
+                source={data?.source}
+              />
             </div>
             <CanEditResource
               id={data?.id}
-              name={"Permission"}
               resourceType={"permissions"}
               source={data?.source}
-              className="flex flex-col"
+              className="flex items-center bg-gray-100 px-5 py-4"
             >
               <AuthorizationAccessCheck
                 resource={tables.permissions}
diff --git a/src/components/Permissions/PermissionsTable.tsx b/src/components/Permissions/PermissionsTable.tsx
index 553821160..4a32d2e95 100644
--- a/src/components/Permissions/PermissionsTable.tsx
+++ b/src/components/Permissions/PermissionsTable.tsx
@@ -1,4 +1,4 @@
-import { PermissionAPIResponse } from "@flanksource-ui/api/types/permissions";
+import { PermissionsSummary } from "@flanksource-ui/api/types/permissions";
 import { Avatar } from "@flanksource-ui/ui/Avatar";
 import { Icon } from "@flanksource-ui/ui/Icons/Icon";
 import { MRTDateCell } from "@flanksource-ui/ui/MRTDataTable/Cells/MRTDateCells";
@@ -18,7 +18,7 @@ const formatTagText = (key: string, value: string): string => {
   return `${key}: ${value}`;
 };
 
-const permissionsTableColumns: MRT_ColumnDef<PermissionAPIResponse>[] = [
+const permissionsTableColumns: MRT_ColumnDef<PermissionsSummary>[] = [
   {
     header: "Subject",
     size: 100,
@@ -259,11 +259,11 @@ const permissionsTableColumns: MRT_ColumnDef<PermissionAPIResponse>[] = [
 ];
 
 type PermissionsTableProps = {
-  permissions: PermissionAPIResponse[];
+  permissions: PermissionsSummary[];
   isLoading: boolean;
   pageCount: number;
   totalEntries: number;
-  handleRowClick?: (row: PermissionAPIResponse) => void;
+  handleRowClick?: (row: PermissionsSummary) => void;
   hideResourceColumn?: boolean;
 };
 
diff --git a/src/components/Permissions/PermissionsView.tsx b/src/components/Permissions/PermissionsView.tsx
index a00faadc2..df57a43f1 100644
--- a/src/components/Permissions/PermissionsView.tsx
+++ b/src/components/Permissions/PermissionsView.tsx
@@ -3,7 +3,7 @@ import {
   FetchPermissionsInput
 } from "@flanksource-ui/api/services/permissions";
 import {
-  PermissionAPIResponse,
+  PermissionsSummary,
   PermissionTable
 } from "@flanksource-ui/api/types/permissions";
 import useReactTablePaginationState from "@flanksource-ui/ui/DataTable/Hooks/useReactTablePaginationState";
@@ -81,7 +81,7 @@ export default function PermissionsView({
   onRefetch
 }: PermissionsViewProps) {
   const [selectedPermission, setSelectedPermission] =
-    useState<PermissionAPIResponse>();
+    useState<PermissionsSummary>();
   const { pageSize, pageIndex } = useReactTablePaginationState();
   const [isPermissionModalOpen, setIsPermissionModalOpen] = useState(false);
 

From 67e2233458472d116a98e77be8802d83780d9528 Mon Sep 17 00:00:00 2001
From: Aditya Thebe <contact@adityathebe.com>
Date: Wed, 1 Oct 2025 16:49:08 +0545
Subject: [PATCH 4/4] feat: Permission table show CRD

---
 src/components/Permissions/PermissionsTable.tsx | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/components/Permissions/PermissionsTable.tsx b/src/components/Permissions/PermissionsTable.tsx
index 4a32d2e95..4dda4285a 100644
--- a/src/components/Permissions/PermissionsTable.tsx
+++ b/src/components/Permissions/PermissionsTable.tsx
@@ -13,6 +13,7 @@ import { permissionsActionsList } from "./PermissionsView";
 import { BsBan } from "react-icons/bs";
 import { Link } from "react-router-dom";
 import { Badge } from "@flanksource-ui/ui/Badge/Badge";
+import CRDSource from "../Settings/CRDSource";
 
 const formatTagText = (key: string, value: string): string => {
   return `${key}: ${value}`;
@@ -253,6 +254,13 @@ const permissionsTableColumns: MRT_ColumnDef<PermissionsSummary>[] = [
     size: 40,
     Cell: ({ row }) => {
       const createdBy = row.original.createdBy;
+      const source = row.original.source;
+
+      if (source?.toLowerCase() === "KubernetesCRD".toLowerCase()) {
+        const id = row.original.id;
+        return <CRDSource source={source} id={id} showMinimal />;
+      }
+
       return <Avatar user={createdBy} />;
     }
   }