From de83d8a03016782bfa28eb1f12d04bb5addd1df3 Mon Sep 17 00:00:00 2001
From: Suresh Chaudhary <hello@suresh.im>
Date: Fri, 22 May 2026 01:36:07 +0530
Subject: [PATCH 1/3] fix: make toasts clickable while using Radix React Remove
 Scroll

---
 ui/app/globals.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/ui/app/globals.css b/ui/app/globals.css
index 474730b3bf..53a9bb2fde 100644
--- a/ui/app/globals.css
+++ b/ui/app/globals.css
@@ -390,6 +390,11 @@ div.content-container:has(.no-border-parent) #trial-notification-banner {
 	@apply rounded-sm!;
 }
 
+/* Ensure toasts remain clickable above modal overlays (radix react-remove-scroll) */
+[data-sonner-toaster] {
+	pointer-events: auto !important;
+}
+
 /* Move Sonner toast close button to top-right */
 [data-sonner-toaster][dir="ltr"],
 [data-sonner-toaster] {

From 285d7d0ca1986302fe10623efbc03875d01c0361 Mon Sep 17 00:00:00 2001
From: Suresh Chaudhary <hello@suresh.im>
Date: Fri, 22 May 2026 02:02:31 +0530
Subject: [PATCH 2/3] chore: sheet forms action button position

---
 .../workspace/routing-rules/views/routingRuleSheet.tsx | 10 ++++------
 .../workspace/virtual-keys/views/virtualKeySheet.tsx   |  2 +-
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/ui/app/workspace/routing-rules/views/routingRuleSheet.tsx b/ui/app/workspace/routing-rules/views/routingRuleSheet.tsx
index ae19662ed0..f93973d546 100644
--- a/ui/app/workspace/routing-rules/views/routingRuleSheet.tsx
+++ b/ui/app/workspace/routing-rules/views/routingRuleSheet.tsx
@@ -3,7 +3,6 @@
  * Create/Edit form for routing rules
  */
 
-import { RbacOperation, RbacResource, useRbac } from "@enterprise/lib";
 import { Button } from "@/components/ui/button";
 import { ComboboxSelect } from "@/components/ui/combobox";
 import { Input } from "@/components/ui/input";
@@ -30,7 +29,8 @@ import {
 } from "@/lib/types/routingRules";
 import { validateRateLimitAndBudgetRules, validateRoutingRules } from "@/lib/utils/celConverterRouting";
 import { normalizeRoutingRuleGroupQuery } from "@/lib/utils/routingRuleGroupQuery";
-import { Plus, Save, Trash2, X } from "lucide-react";
+import { RbacOperation, RbacResource, useRbac } from "@enterprise/lib";
+import { Plus, Trash2, X } from "lucide-react";
 import { lazy, Suspense, useCallback, useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { RuleGroupType } from "react-querybuilder";
@@ -273,8 +273,8 @@ export function RoutingRuleSheet({ open, onOpenChange, editingRule, onSuccess }:
 					</SheetDescription>
 				</SheetHeader>
 
-				<form onSubmit={handleSubmit(onSubmit)}>
-					<div className="flex flex-col gap-6 px-8 pb-6">
+				<form onSubmit={handleSubmit(onSubmit)} className="flex flex-col grow">
+					<div className="flex flex-col gap-6 px-8 pb-6 grow">
 						{/* Rule Name */}
 						<div className="space-y-3">
 							<Label htmlFor="name">
@@ -584,11 +584,9 @@ export function RoutingRuleSheet({ open, onOpenChange, editingRule, onSuccess }:
 					{/* Action Buttons */}
 					<div className="bg-card sticky bottom-0 flex justify-end gap-3 border-t px-8 py-4">
 						<Button type="button" variant="outline" onClick={handleCancel} disabled={isLoading}>
-							<X className="h-4 w-4" />
 							Cancel
 						</Button>
 						<Button type="submit" disabled={isLoading || !hasRequiredAccess}>
-							<Save className="h-4 w-4" />
 							{isEditing ? "Update Rule" : "Save Rule"}
 						</Button>
 					</div>
diff --git a/ui/app/workspace/virtual-keys/views/virtualKeySheet.tsx b/ui/app/workspace/virtual-keys/views/virtualKeySheet.tsx
index 3e0659454b..56e594427e 100644
--- a/ui/app/workspace/virtual-keys/views/virtualKeySheet.tsx
+++ b/ui/app/workspace/virtual-keys/views/virtualKeySheet.tsx
@@ -1013,7 +1013,7 @@ export default function VirtualKeySheet({
             onSubmit={form.handleSubmit(onSubmit)}
             className="flex h-full flex-col gap-6"
           >
-            <div className="space-y-4 px-8">
+            <div className="space-y-4 px-8 grow">
               {isManagedByProfile && (
                 <Alert variant="info">
                   <Lock className="h-4 w-4" />

From 444f243bbc91ae4e564b335e507e8311711c8f3b Mon Sep 17 00:00:00 2001
From: Suresh Chaudhary <hello@suresh.im>
Date: Fri, 22 May 2026 02:11:58 +0530
Subject: [PATCH 3/3] fix: virtual keys table scroll

---
 .../virtual-keys/views/virtualKeysTable.tsx   | 20 +++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/ui/app/workspace/virtual-keys/views/virtualKeysTable.tsx b/ui/app/workspace/virtual-keys/views/virtualKeysTable.tsx
index 2788d7984e..da82fb3f37 100644
--- a/ui/app/workspace/virtual-keys/views/virtualKeysTable.tsx
+++ b/ui/app/workspace/virtual-keys/views/virtualKeysTable.tsx
@@ -659,8 +659,8 @@ export default function VirtualKeysTable({
 				</AlertDialogContent>
 			</AlertDialog>
 
-			<div className="space-y-4">
-				<div className="flex items-center justify-between">
+			<div className="flex min-h-0 w-full grow flex-col gap-4 overflow-hidden">
+				<div className="flex shrink-0 items-center justify-between">
 					<div>
 						<h2 className="text-lg font-semibold">Virtual Keys</h2>
 						<p className="text-muted-foreground text-sm">Manage virtual keys, their permissions, budgets, and rate limits.</p>
@@ -689,7 +689,7 @@ export default function VirtualKeysTable({
 				</div>
 
 				{/* Toolbar: Search + Filters */}
-				<div className="flex items-center gap-3">
+				<div className="flex shrink-0 items-center gap-3">
 					<div className="relative max-w-sm flex-1">
 						<Search className="text-muted-foreground absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2" />
 						<Input
@@ -720,9 +720,9 @@ export default function VirtualKeysTable({
 					/>
 				</div>
 
-				<div className="rounded-sm border">
-					<Table className="w-full min-w-[1528px] table-fixed" data-testid="vk-table">
-						<TableHeader>
+				<div className="min-h-0 grow overflow-hidden rounded-sm border">
+					<Table containerClassName="h-full overflow-auto" className="w-full min-w-[1528px] table-fixed" data-testid="vk-table">
+						<TableHeader className="bg-muted sticky top-0 z-20">
 							<TableRow>
 								<TableHead className="w-[48px]">
 									<Checkbox
@@ -744,7 +744,7 @@ export default function VirtualKeysTable({
 								<TableHead className="w-[120px]">
 									<SortableHeader column="status" label="Status" />
 								</TableHead>
-								<TableHead className={`bg-muted sticky right-0 z-10 w-[56px] text-right ${PIN_SHADOW_RIGHT}`}></TableHead>
+								<TableHead className={`bg-muted sticky right-0 z-30 w-[56px] text-right ${PIN_SHADOW_RIGHT}`}></TableHead>
 							</TableRow>
 						</TableHeader>
 						<TableBody>
@@ -824,7 +824,7 @@ export default function VirtualKeysTable({
 												<VKActiveSwitch vk={vk} hasUpdateAccess={hasUpdateAccess} onToggle={handleToggleActive} />
 											</TableCell>
 											<TableCell
-												className={`group-hover:bg-muted dark:bg-card dark:group-hover:bg-muted sticky right-0 z-10 bg-white text-right ${PIN_SHADOW_RIGHT}`}
+												className={`group-hover:bg-muted dark:bg-card dark:group-hover:bg-muted sticky right-0 z-20 bg-white text-right ${PIN_SHADOW_RIGHT}`}
 												onClick={(e) => e.stopPropagation()}
 											>
 												<VKActionsMenu
@@ -846,8 +846,8 @@ export default function VirtualKeysTable({
 
 				{/* Pagination */}
 				{totalCount > 0 && (
-					<div className="flex items-center justify-between px-2">
-						<p className="text-muted-foreground text-sm">
+					<div className="flex shrink-0 items-center justify-between px-2 text-xs">
+						<p className="text-muted-foreground">
 							Showing {offset + 1}-{Math.min(offset + limit, totalCount)} of {totalCount}
 						</p>
 						<div className="flex gap-2">