From d3bdca82f6f8d2da10665edc5b8a9d1327fc9367 Mon Sep 17 00:00:00 2001
From: Aditya Thebe <contact@adityathebe.com>
Date: Thu, 9 Oct 2025 00:11:29 +0545
Subject: [PATCH] feat: show CRD access scopes in read-only YAML viewer

---
 .../AccessScopes/Forms/AccessScopeForm.tsx      | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/components/AccessScopes/Forms/AccessScopeForm.tsx b/src/components/AccessScopes/Forms/AccessScopeForm.tsx
index eefc1ae67..120b21dee 100644
--- a/src/components/AccessScopes/Forms/AccessScopeForm.tsx
+++ b/src/components/AccessScopes/Forms/AccessScopeForm.tsx
@@ -25,6 +25,8 @@ import CanEditResource from "@flanksource-ui/components/Settings/CanEditResource
 import { AuthorizationAccessCheck } from "@flanksource-ui/components/Permissions/AuthorizationAccessCheck";
 import { tables } from "@flanksource-ui/context/UserAccessContext/permissions";
 import { useUser } from "@flanksource-ui/context";
+import { JSONViewer } from "@flanksource-ui/ui/Code/JSONViewer";
+import YAML from "yaml";
 
 // Form values type - names is string for textarea input
 type AccessScopeFormScope = Omit<AccessScopeScope, "names"> & {
@@ -213,7 +215,20 @@ export default function AccessScopeForm({
 
             <AccessScopeResourcesSelect disabled={isReadOnly} />
 
-            <AccessScopeCriteriaForm disabled={isReadOnly} />
+            {isReadOnly ? (
+              <div className="flex flex-col gap-2">
+                <label className="form-label">Scopes</label>
+                <div className="rounded border border-gray-300 bg-gray-50">
+                  <JSONViewer
+                    code={YAML.stringify(data?.scopes || [])}
+                    format="yaml"
+                    showLineNo={false}
+                  />
+                </div>
+              </div>
+            ) : (
+              <AccessScopeCriteriaForm disabled={isReadOnly} />
+            )}
           </div>
 
           <CanEditResource