From 81f3914e7f9fca7c5b7ae3e6eff0d5e1b4e0ced7 Mon Sep 17 00:00:00 2001
From: dswbx <dennis.senn@gmx.ch>
Date: Mon, 22 Dec 2025 15:10:36 +0100
Subject: [PATCH] admin ui: made context overlays scrollable

---
 .../ui/routes/auth/auth.roles.edit.$role.tsx  | 40 +++++++++----------
 1 file changed, 19 insertions(+), 21 deletions(-)

diff --git a/app/src/ui/routes/auth/auth.roles.edit.$role.tsx b/app/src/ui/routes/auth/auth.roles.edit.$role.tsx
index 477ca9e..72aceb5 100644
--- a/app/src/ui/routes/auth/auth.roles.edit.$role.tsx
+++ b/app/src/ui/routes/auth/auth.roles.edit.$role.tsx
@@ -378,11 +378,7 @@ function replaceEntitiesEnum(schema: Record<string, any>, entities: string[]) {
    });
 }
 
-const Policy = ({
-   permission,
-}: {
-   permission: TPermission;
-}) => {
+const Policy = ({ permission }: { permission: TPermission }) => {
    const { value } = useDerivedFieldContext("", ({ value }) => ({
       effect: (value?.effect ?? "allow") as "allow" | "deny" | "filter",
    }));
@@ -503,22 +499,24 @@ const CustomFieldWrapper = ({
                         className: "max-w-none",
                      }}
                      position="bottom-end"
-                     target={() =>
-                        typeof schema.content === "object" ? (
-                           <JsonViewer
-                              className="w-auto max-w-120 bg-background pr-3 text-sm"
-                              json={schema.content}
-                              title={schema.name}
-                              expand={5}
-                           />
-                        ) : (
-                           <CodePreview
-                              code={schema.content}
-                              lang="typescript"
-                              className="w-auto max-w-120 bg-background p-3 text-sm"
-                           />
-                        )
-                     }
+                     target={() => (
+                        <div className="w-auto max-w-[80vw] md:max-w-120 bg-background overflow-scroll">
+                           {typeof schema.content === "object" ? (
+                              <JsonViewer
+                                 className="pr-3 text-sm"
+                                 json={schema.content}
+                                 title={schema.name}
+                                 expand={5}
+                              />
+                           ) : (
+                              <CodePreview
+                                 code={schema.content}
+                                 lang="typescript"
+                                 className="p-3 text-sm"
+                              />
+                           )}
+                        </div>
+                     )}
                   >
                      <Button variant="ghost" size="smaller" IconLeft={TbCodeDots}>
                         {autoFormatString(schema.name)}