okengine 0.13.0 → 0.15.2

package/src/console/ui-next/src/features/store/detail/browse-section.tsx

@@ -55,6 +55,7 @@ import { ToolbarTip } from "@/components/ui/toolbar-tip.tsx";
 import { buildStoreGridModel, type StoreGridRow } from "../lib/grid-model.ts";
 import { parseIndexQuery } from "../lib/index-query.ts";
 import { childCatalogKind, groupSqlChildren, isSqlCatalogChild } from "../lib/sql-catalog.ts";
+import { QueryGateMenu } from "../query/query-gate-menu.tsx";
 import { TouchedByLists } from "./touched-by-section.tsx";
 
 /** Browse page sizes offered in the Rows select. */
@@ -116,6 +117,10 @@ export function BrowseSection({
   const [indexOpen, setIndexOpen] = useState(false);
   const [triggerOpen, setTriggerOpen] = useState(false);
   const [insertOpen, setInsertOpen] = useState(false);
+  const [rlsAs, setRlsAs] = useState<{ asGate: string | null; asUserId: string | null }>({
+    asGate: null,
+    asUserId: null,
+  });
 
   const debouncedIndexText = useDebouncedValue(indexText, INDEX_SEARCH_DEBOUNCE_MS);
   const indexQuery = useMemo(() => parseIndexQuery(debouncedIndexText), [debouncedIndexText]);
@@ -133,8 +138,25 @@ export function BrowseSection({
         : {}),
       ...(store.facet === "index" && indexQuery.kind === "text" ? { q: indexQuery.q, topK } : {}),
       ...(store.facet === "sql" && !piiMasked ? { revealPii: true } : {}),
+      ...(store.facet === "sql" && !isSqlCatalogChild(child) && rlsAs.asGate
+        ? { asGate: rlsAs.asGate }
+        : {}),
+      ...(store.facet === "sql" && !isSqlCatalogChild(child) && rlsAs.asUserId
+        ? { asUserId: rlsAs.asUserId }
+        : {}),
     };
-  }, [store.ref, store.facet, child.name, tenant, tenantReady, limit, indexQuery, topK, piiMasked]);
+  }, [
+    store.ref,
+    store.facet,
+    child,
+    tenant,
+    tenantReady,
+    limit,
+    indexQuery,
+    topK,
+    piiMasked,
+    rlsAs,
+  ]);
 
   const browse = useStoreQuery(queryInput, tenantReady);
   const deleteMutation = useStoreDelete();
@@ -191,6 +213,8 @@ export function BrowseSection({
               c.key === "with_check" ||
               c.key === "command" ||
               c.key === "permissive",
+            ...(c.key === "origin" ? { label: "Origin" } : {}),
+            ...(c.key === "code" ? { label: "Code" } : {}),
           })),
       };
     }
@@ -269,6 +293,9 @@ export function BrowseSection({
 
   const toolbarExtras = (
     <>
+      {store.facet === "sql" && !isSqlCatalogChild(child) ? (
+        <QueryGateMenu manifest={manifest} value={rlsAs} onChange={setRlsAs} />
+      ) : null}
       <Tooltip>
         <TooltipTrigger
           render={(props) => (
@@ -576,9 +603,26 @@ export function BrowseSection({
             }
             insertOpen={insertOpen}
             onInsertOpenChange={setInsertOpen}
+            asGate={rlsAs.asGate}
+            asUserId={rlsAs.asUserId}
             onDeleteRows={
               authReadOnly || extensionCatalog ? undefined : (rows) => setDeleting(rows)
             }
+            onViewportContextMenu={
+              store.ref === "sql:oke_console"
+                ? undefined
+                : policyCatalog
+                  ? () => setPolicyOpen(true)
+                  : functionCatalog
+                    ? () => setFunctionOpen(true)
+                    : indexCatalog
+                      ? () => setIndexOpen(true)
+                      : triggerCatalog
+                        ? () => setTriggerOpen(true)
+                        : store.facet === "sql" && !isSqlCatalogChild(child)
+                          ? () => setInsertOpen(true)
+                          : undefined
+            }
           />
         </div>
       ) : null}

package/src/console/ui-next/src/features/store/detail/resource-panel.tsx

@@ -9,6 +9,8 @@ import {
   CheckmarkCircle02Icon,
   Folder01Icon,
   SecurityCheckIcon,
+  ShieldEnergyIcon,
+  ShieldOff,
   Timer01Icon,
 } from "@hugeicons/core-free-icons";
 import { HugeiconsIcon } from "@hugeicons/react";
@@ -24,8 +26,13 @@ import { formatDuration } from "@/features/flows/traces/format-duration.ts";
 import { cn } from "@/lib/utils";
 import { filesDriverLabel, filesDriverOrigin } from "../lib/files-origin.ts";
 import { latestReplicaLagFromRuns } from "../lib/replica-lag.ts";
-import { isSqlCatalogChild, storeChildLabel } from "../lib/sql-catalog.ts";
-import { STORE_FACET_SPECS } from "../lib/store-tree.ts";
+import {
+  isSqlCatalogChild,
+  storeChildLabel,
+  storeChildRlsPolicyCount,
+  storeChildShowsRls,
+} from "../lib/sql-catalog.ts";
+import { resourceHeaderChildRef, STORE_FACET_SPECS } from "../lib/store-tree.ts";
 import { BrowseSection } from "./browse-section.tsx";
 
 /** Props for {@link ResourcePanel}. */
@@ -77,7 +84,12 @@ export function ResourcePanel({
   const lagTone = lagMs != null ? durationTone(lagMs) : null;
 
   const files = store.facet === "files";
-  const showStatus = Boolean(drift || lagMs !== null || store.contentAddressed || piiCount > 0);
+  const showsRls = storeChildShowsRls(child);
+  const rlsOn = child.rls === true;
+  const rlsCount = storeChildRlsPolicyCount(child, manifest, store.name);
+  const showStatus = Boolean(
+    drift || lagMs !== null || store.contentAddressed || piiCount > 0 || showsRls,
+  );
 
   return (
     <div className="flex h-full min-h-0 flex-col overflow-hidden" data-slot="resource-panel">
@@ -124,18 +136,7 @@ export function ResourcePanel({
                 <CopyInlineButton value={child.effectRef} label="Copy effect ref" />
               </>
             ) : (
-              <>
-                <span className="shrink-0 font-mono text-[11px] leading-none text-muted-foreground">
-                  {store.ref}
-                </span>
-                <span aria-hidden className="text-border">
-                  ·
-                </span>
-                <code className="min-w-0 truncate font-mono text-[11px] leading-none text-foreground/70">
-                  {child.effectRef}
-                </code>
-                <CopyInlineButton value={child.effectRef} label="Copy effect ref" />
-              </>
+              <ResourceRefSubtitle storeRef={store.ref} effectRef={child.effectRef} />
             )}
           </>
         }
@@ -154,6 +155,30 @@ export function ResourcePanel({
                 </StatusChip>
               ) : null}
               {store.contentAddressed ? <StatusChip>content-addressed</StatusChip> : null}
+              {showsRls ? (
+                <StatusChip
+                  tone={rlsOn ? "emerald" : "neutral"}
+                  icon={
+                    <HugeiconsIcon
+                      icon={rlsOn ? ShieldEnergyIcon : ShieldOff}
+                      className="size-3"
+                      aria-hidden
+                    />
+                  }
+                  title={
+                    rlsOn
+                      ? rlsCount > 0
+                        ? `Row-level security enabled · ${rlsCount} ${rlsCount === 1 ? "policy" : "policies"}`
+                        : "Row-level security enabled"
+                      : "Row-level security disabled"
+                  }
+                  role="status"
+                  data-slot="resource-rls"
+                  data-rls={rlsOn ? "on" : "off"}
+                >
+                  {rlsOn && rlsCount > 0 ? `${rlsCount} RLS` : "RLS"}
+                </StatusChip>
+              ) : null}
               {piiCount > 0 ? (
                 <StatusChip
                   tone={piiMasked ? "sky" : "amber"}
@@ -233,6 +258,34 @@ export function ResourcePanel({
   );
 }
 
+function ResourceRefSubtitle({
+  storeRef,
+  effectRef,
+}: {
+  readonly storeRef: string;
+  readonly effectRef: string;
+}): JSX.Element {
+  const childRef = resourceHeaderChildRef(storeRef, effectRef);
+  return (
+    <>
+      <span className="shrink-0 font-mono text-[11px] leading-none text-muted-foreground">
+        {storeRef}
+      </span>
+      {childRef ? (
+        <>
+          <span aria-hidden className="text-border">
+            ·
+          </span>
+          <code className="min-w-0 truncate font-mono text-[11px] leading-none text-foreground/70">
+            {childRef}
+          </code>
+        </>
+      ) : null}
+      <CopyInlineButton value={effectRef} label="Copy effect ref" />
+    </>
+  );
+}
+
 type ChipTone = "neutral" | "emerald" | "amber" | "sky";
 
 const CHIP_TONES: Record<ChipTone, string> = {
@@ -251,6 +304,7 @@ interface StatusChipProps {
   readonly role?: string;
   readonly "data-slot"?: string;
   readonly "data-drifted"?: string;
+  readonly "data-rls"?: string;
   readonly pressed?: boolean;
   readonly onClick?: () => void;
   readonly ariaLabel?: string;
@@ -270,6 +324,7 @@ function StatusChip({
   role,
   "data-slot": dataSlot,
   "data-drifted": dataDrifted,
+  "data-rls": dataRls,
   pressed,
   onClick,
   ariaLabel,
@@ -290,13 +345,20 @@ function StatusChip({
       aria-label={ariaLabel}
       data-slot={dataSlot}
       data-drifted={dataDrifted}
+      data-rls={dataRls}
       onClick={onClick}
     >
       {icon}
       {children}
     </button>
   ) : (
-    <span className={className} role={role} data-slot={dataSlot} data-drifted={dataDrifted}>
+    <span
+      className={className}
+      role={role}
+      data-slot={dataSlot}
+      data-drifted={dataDrifted}
+      data-rls={dataRls}
+    >
       {icon}
       {children}
     </span>

package/src/console/ui-next/src/features/store/detail/store-row-detail-sheet.tsx

@@ -1,12 +1,19 @@
 /**
- * Store row detail Sheet — Fields / JSON tabs + fixed destructive footer.
+ * Store row detail Sheet — Fields / JSON tabs, in-sheet edit, delete.
  */
 
 import { useEffect, useMemo, useState, type JSX } from "react";
-import { Delete02Icon, PencilEdit01Icon } from "@hugeicons/core-free-icons";
+import {
+  Cancel01Icon,
+  Delete02Icon,
+  PencilEdit01Icon,
+  Tick02Icon,
+} from "@hugeicons/core-free-icons";
 import { HugeiconsIcon } from "@hugeicons/react";
 import { HighlightedJson } from "@/components/highlighted-json";
 import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { SHEET_CONTROL, SheetError } from "@/components/ui/sheet-form.tsx";
 import {
   Sheet,
   SheetContent,
@@ -15,9 +22,15 @@ import {
   SheetTitle,
 } from "@/components/ui/sheet";
 import { cn } from "@/lib/utils";
+import { useStoreEdit } from "../data/use-store-edit.ts";
 import { RevealCell } from "./reveal-cell.tsx";
-import { formatGridCell, type StoreGridModel, type StoreGridRow } from "../lib/grid-model.ts";
-import { isStorePiiMask } from "../lib/patch.ts";
+import {
+  formatGridCell,
+  type StoreGridColumn,
+  type StoreGridModel,
+  type StoreGridRow,
+} from "../lib/grid-model.ts";
+import { isStorePiiMask, parseStoreCellDraft, sanitizeStorePatch } from "../lib/patch.ts";
 import { isRtlText } from "../lib/rtl.ts";
 
 /** Props for {@link StoreRowDetailSheet}. */
@@ -31,12 +44,13 @@ export interface StoreRowDetailSheetProps {
   readonly childName: string;
   readonly tenant?: string | null;
   readonly masked?: boolean;
-  readonly onEditRow?: (row: StoreGridRow) => void;
+  readonly asGate?: string | null;
+  readonly asUserId?: string | null;
   readonly onDeleteRow?: (row: StoreGridRow) => void;
 }
 
 /**
- * Right-side detail for one grid row — Fields (Reveal/edit) and full JSON.
+ * Right-side detail for one grid row — Fields (Reveal / edit) and full JSON.
  *
  * @param props - Selected row + facet + mutation callbacks
  */
@@ -50,13 +64,28 @@ export function StoreRowDetailSheet({
   childName,
   tenant,
   masked = false,
-  onEditRow,
+  asGate = null,
+  asUserId = null,
   onDeleteRow,
 }: StoreRowDetailSheetProps): JSX.Element {
+  const edit = useStoreEdit();
   const [tab, setTab] = useState<"fields" | "json">("fields");
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState<Record<string, string>>({});
+  const [error, setError] = useState<string | null>(null);
+
+  const editableColumns = useMemo(
+    () => model.columns.filter((col) => col.editable),
+    [model.columns],
+  );
+  const canEdit =
+    model.editable && (facet === "sql" || facet === "kv") && editableColumns.length > 0;
 
   useEffect(() => {
-    if (open) setTab("fields");
+    if (!open) return;
+    setTab("fields");
+    setEditing(false);
+    setError(null);
   }, [open, row]);
 
   const json = useMemo(() => {
@@ -70,7 +99,45 @@ export function StoreRowDetailSheet({
 
   if (!row) return <></>;
 
-  const canEdit = model.editable && (facet === "sql" || facet === "kv") && onEditRow !== undefined;
+  const startEdit = (): void => {
+    const next: Record<string, string> = {};
+    for (const col of editableColumns) {
+      next[col.key] = draftFromCell(col.type, row.cells[col.key]);
+    }
+    setDraft(next);
+    setError(null);
+    setEditing(true);
+    setTab("fields");
+  };
+
+  const save = async (): Promise<void> => {
+    setError(null);
+    const patch: Record<string, unknown> = {};
+    for (const col of editableColumns) {
+      const text = draft[col.key] ?? "";
+      if (col.pii && text.trim() === "") continue;
+      if (text === draftFromCell(col.type, row.cells[col.key])) continue;
+      patch[col.key] = parseStoreCellDraft(col.type, text);
+    }
+    if (Object.keys(patch).length === 0) {
+      setEditing(false);
+      return;
+    }
+    try {
+      await edit.mutateAsync({
+        ref: storeRef,
+        ...(facet === "sql" ? { child: childName, id: row.id } : { key: row.id }),
+        ...(tenant ? { tenant } : {}),
+        ...(asGate ? { asGate } : {}),
+        ...(asUserId ? { asUserId } : {}),
+        patch: sanitizeStorePatch(patch),
+        commit: true,
+      });
+      setEditing(false);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : String(err));
+    }
+  };
 
   return (
     <Sheet open={open} onOpenChange={onOpenChange}>
@@ -79,11 +146,12 @@ export function StoreRowDetailSheet({
         showOverlay={false}
         className="gap-0 p-0 sm:max-w-md"
         data-slot="store-row-detail-sheet"
+        data-editing={editing ? "true" : "false"}
       >
         <SheetHeader className="gap-2 border-b border-border/50">
           <div className="flex flex-col gap-0.5 pr-8">
             <SheetTitle className="text-sm">
-              Row <span className="font-mono">{row.id}</span>
+              {editing ? "Edit" : "Row"} <span className="font-mono">{row.id}</span>
             </SheetTitle>
             <SheetDescription className="font-mono text-[11px]">
               {storeRef}
@@ -106,6 +174,7 @@ export function StoreRowDetailSheet({
               {model.columns.map((col) => {
                 const value = row.cells[col.key];
                 const maskedPii = col.pii && masked && isStorePiiMask(value);
+                const fieldEditable = editing && col.editable;
                 return (
                   <li key={col.key} className="flex items-baseline gap-3 py-1.5">
                     <span className="flex w-32 shrink-0 items-center gap-1.5">
@@ -130,7 +199,30 @@ export function StoreRowDetailSheet({
                         </span>
                       ) : null}
                     </span>
-                    {maskedPii ? (
+                    {fieldEditable ? (
+                      col.type === "json" ? (
+                        <textarea
+                          value={draft[col.key] ?? ""}
+                          onChange={(event) =>
+                            setDraft((prev) => ({ ...prev, [col.key]: event.target.value }))
+                          }
+                          aria-label={col.key}
+                          rows={3}
+                          className="min-h-16 min-w-0 flex-1 rounded-none border-0 bg-transparent font-mono text-[11px] outline-none"
+                        />
+                      ) : (
+                        <Input
+                          value={draft[col.key] ?? ""}
+                          onChange={(event) =>
+                            setDraft((prev) => ({ ...prev, [col.key]: event.target.value }))
+                          }
+                          type={col.type === "integer" || col.type === "number" ? "number" : "text"}
+                          aria-label={col.key}
+                          flat
+                          className={cn(SHEET_CONTROL, "min-w-0 flex-1 px-0 font-mono")}
+                        />
+                      )
+                    ) : maskedPii ? (
                       <RevealCell
                         refName={storeRef}
                         child={childName}
@@ -162,13 +254,42 @@ export function StoreRowDetailSheet({
           )}
         </div>
 
+        {error ? <SheetError slot="row-detail-error">{error}</SheetError> : null}
+
         <div className="mt-auto flex items-center justify-between gap-2 border-t border-border/50 px-4 py-2.5">
-          {canEdit ? (
+          {editing ? (
+            <div className="flex items-center gap-2">
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                onClick={() => {
+                  setEditing(false);
+                  setError(null);
+                }}
+                disabled={edit.isPending}
+                data-slot="row-detail-cancel"
+              >
+                <HugeiconsIcon icon={Cancel01Icon} className="size-3.5" aria-hidden />
+                Cancel
+              </Button>
+              <Button
+                type="button"
+                size="sm"
+                onClick={() => void save()}
+                disabled={edit.isPending}
+                data-slot="row-detail-save"
+              >
+                <HugeiconsIcon icon={Tick02Icon} className="size-3.5" aria-hidden />
+                {edit.isPending ? "Saving…" : "Save"}
+              </Button>
+            </div>
+          ) : canEdit ? (
             <Button
               type="button"
               variant="outline"
               size="sm"
-              onClick={() => onEditRow(row)}
+              onClick={startEdit}
               data-slot="row-detail-edit"
             >
               <HugeiconsIcon icon={PencilEdit01Icon} className="size-3.5" aria-hidden />
@@ -177,7 +298,7 @@ export function StoreRowDetailSheet({
           ) : (
             <span />
           )}
-          {onDeleteRow ? (
+          {!editing && onDeleteRow ? (
             <Button
               type="button"
               variant="destructive"
@@ -195,6 +316,26 @@ export function StoreRowDetailSheet({
   );
 }
 
+/** Seed / compare an edit draft without turning `null` into the display em dash. */
+function draftFromCell(type: StoreGridColumn["type"], raw: unknown): string {
+  if (raw === null || raw === undefined) return "";
+  if (isStorePiiMask(raw)) return "";
+  if (type === "json") {
+    try {
+      return JSON.stringify(raw, null, 2);
+    } catch {
+      return "";
+    }
+  }
+  if (typeof raw === "string") return raw;
+  if (typeof raw === "number" || typeof raw === "boolean") return String(raw);
+  try {
+    return JSON.stringify(raw);
+  } catch {
+    return "";
+  }
+}
+
 function TabButton({
   active,
   onClick,