@xyo-network/xl1-react-client-sdk 1.30.2 → 1.30.4

package/dist/browser/index.mjs

@@ -876,51 +876,34 @@ var DataLakeListButton = ({ timeout, ...props }) => {
 // src/client/components/connected/DataLakeOperationsPanel.tsx
 import {
   Divider,
-  Stack as Stack9,
-  Typography as Typography9
+  Stack as Stack11,
+  Typography as Typography10
 } from "@mui/material";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
-var DataLakeOperationsPanel = ({ timeout, ...props }) => {
-  return /* @__PURE__ */ jsxs9(
-    Stack9,
-    {
-      ...props,
-      sx: {
-        gap: 3,
-        alignItems: "stretch",
-        ...props.sx
-      },
-      children: [
-        /* @__PURE__ */ jsxs9(Stack9, { sx: { gap: 1 }, children: [
-          /* @__PURE__ */ jsx9(Typography9, { variant: "subtitle2", children: "List approved lakes" }),
-          /* @__PURE__ */ jsx9(DataLakeListButton, { timeout })
-        ] }),
-        /* @__PURE__ */ jsx9(Divider, {}),
-        /* @__PURE__ */ jsxs9(Stack9, { sx: { gap: 1 }, children: [
-          /* @__PURE__ */ jsx9(Typography9, { variant: "subtitle2", children: "Insert payloads" }),
-          /* @__PURE__ */ jsx9(DataLakeInsertPanel, { timeout })
-        ] }),
-        /* @__PURE__ */ jsx9(Divider, {}),
-        /* @__PURE__ */ jsxs9(Stack9, { sx: { gap: 1 }, children: [
-          /* @__PURE__ */ jsx9(Typography9, { variant: "subtitle2", children: "Get payloads by hash" }),
-          /* @__PURE__ */ jsx9(DataLakeGetPanel, { timeout })
-        ] })
-      ]
-    }
-  );
-};
+
+// src/client/components/connected/DataLakeRequestAccessPanel.tsx
+import {
+  Checkbox,
+  FormControl as FormControl2,
+  FormControlLabel,
+  InputLabel as InputLabel2,
+  MenuItem as MenuItem2,
+  Select as Select2,
+  Stack as Stack10
+} from "@mui/material";
+import { asSchema } from "@xyo-network/sdk-js";
+import { useMemo as useMemo3, useState as useState10 } from "react";
 
 // src/client/components/connected/DataLakeRequestAccessButton.tsx
 import {
   Alert as Alert7,
-  Stack as Stack10,
-  Typography as Typography10
+  Stack as Stack9,
+  Typography as Typography9
 } from "@mui/material";
 import { ButtonEx as ButtonEx6 } from "@xylabs/react-button";
 import { ErrorRender as ErrorRender6 } from "@xylabs/react-error";
 import { isDefined as isDefined8, isDefinedNotNull as isDefinedNotNull6 } from "@xylabs/sdk-js";
 import { useState as useState9 } from "react";
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 var DataLakeRequestAccessButton = ({
   options,
   timeout,
@@ -951,8 +934,8 @@ var DataLakeRequestAccessButton = ({
       setRequesting(false);
     }
   };
-  return /* @__PURE__ */ jsxs10(
-    Stack10,
+  return /* @__PURE__ */ jsxs9(
+    Stack9,
     {
       ...props,
       sx: {
@@ -961,9 +944,9 @@ var DataLakeRequestAccessButton = ({
         ...props.sx
       },
       children: [
-        timedout ? /* @__PURE__ */ jsx10(Alert7, { severity: "warning", children: "Wallet not detected." }) : null,
-        isDefinedNotNull6(client) && !supported ? /* @__PURE__ */ jsx10(Alert7, { severity: "warning", children: "This wallet does not expose `xyo.client.dataLakes`." }) : null,
-        /* @__PURE__ */ jsx10(
+        timedout ? /* @__PURE__ */ jsx9(Alert7, { severity: "warning", children: "Wallet not detected." }) : null,
+        isDefinedNotNull6(client) && !supported ? /* @__PURE__ */ jsx9(Alert7, { severity: "warning", children: "This wallet does not expose `xyo.client.dataLakes`." }) : null,
+        /* @__PURE__ */ jsx9(
           ButtonEx6,
           {
             variant: "contained",
@@ -974,32 +957,273 @@ var DataLakeRequestAccessButton = ({
             children: "Request data lake access"
           }
         ),
-        isDefined8(granted) ? /* @__PURE__ */ jsxs10(Stack10, { sx: { gap: 0.5 }, children: [
-          /* @__PURE__ */ jsx10(Typography10, { variant: "subtitle2", children: "Granted:" }),
-          /* @__PURE__ */ jsxs10(Typography10, { variant: "body2", sx: { fontFamily: "monospace", wordBreak: "break-all" }, children: [
+        isDefined8(granted) ? /* @__PURE__ */ jsxs9(Stack9, { sx: { gap: 0.5 }, children: [
+          /* @__PURE__ */ jsx9(Typography9, { variant: "subtitle2", children: "Granted:" }),
+          /* @__PURE__ */ jsxs9(Typography9, { variant: "body2", sx: { fontFamily: "monospace", wordBreak: "break-all" }, children: [
             "id:",
             " ",
             granted.id
           ] }),
-          /* @__PURE__ */ jsx10(Typography10, { variant: "body2", sx: { color: "text.secondary" }, children: "If you picked multiple lakes, call `list()` to enumerate all granted ids." })
+          /* @__PURE__ */ jsx9(Typography9, { variant: "body2", sx: { color: "text.secondary" }, children: "If you picked multiple lakes, call `list()` to enumerate all granted ids." })
         ] }) : null,
-        /* @__PURE__ */ jsx10(ErrorRender6, { error: clientError ?? requestError, scope: "DataLakeRequestAccessButton" })
+        /* @__PURE__ */ jsx9(ErrorRender6, { error: clientError ?? requestError, scope: "DataLakeRequestAccessButton" })
       ]
     }
   );
 };
 
-// src/client/components/connected/RequestPermissionsButton.tsx
+// src/client/components/connected/DataLakeRequestAccessPanel.tsx
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+var observationSchema = asSchema("network.xyo.observation.v2", true);
+var locationSchema = asSchema("network.xyo.location", true);
+var DataLakeRequestAccessPanel = ({ timeout, ...props }) => {
+  const [capability, setCapability] = useState10("read+write");
+  const [includeSchemas, setIncludeSchemas] = useState10(true);
+  const supportsSchemasFilter = capability !== "viewer";
+  const options = useMemo3(() => {
+    const cap = capability === "read+write" ? { read: true, write: true } : capability;
+    if (supportsSchemasFilter && includeSchemas) {
+      return { capability: cap, schemas: [observationSchema, locationSchema] };
+    }
+    return { capability: cap };
+  }, [capability, includeSchemas, supportsSchemasFilter]);
+  return /* @__PURE__ */ jsxs10(
+    Stack10,
+    {
+      ...props,
+      sx: {
+        gap: 2,
+        alignItems: "stretch",
+        ...props.sx
+      },
+      children: [
+        /* @__PURE__ */ jsxs10(FormControl2, { size: "small", fullWidth: true, children: [
+          /* @__PURE__ */ jsx10(InputLabel2, { children: "Capability" }),
+          /* @__PURE__ */ jsxs10(
+            Select2,
+            {
+              value: capability,
+              label: "Capability",
+              onChange: (event) => setCapability(event.target.value),
+              children: [
+                /* @__PURE__ */ jsx10(MenuItem2, { value: "viewer", children: "Read only (viewer)" }),
+                /* @__PURE__ */ jsx10(MenuItem2, { value: "runner", children: "Write only (runner)" }),
+                /* @__PURE__ */ jsx10(MenuItem2, { value: "read+write", children: "Read + Write" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx10(
+          FormControlLabel,
+          {
+            control: /* @__PURE__ */ jsx10(
+              Checkbox,
+              {
+                checked: supportsSchemasFilter && includeSchemas,
+                disabled: !supportsSchemasFilter,
+                onChange: (event) => setIncludeSchemas(event.target.checked),
+                size: "small"
+              }
+            ),
+            label: "Include schemas filter (observation + location)"
+          }
+        ),
+        /* @__PURE__ */ jsx10(DataLakeRequestAccessButton, { options, timeout })
+      ]
+    }
+  );
+};
+
+// src/client/components/connected/DataLakeOperationsPanel.tsx
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+var DataLakeOperationsPanel = ({ timeout, ...props }) => {
+  return /* @__PURE__ */ jsxs11(
+    Stack11,
+    {
+      ...props,
+      sx: {
+        gap: 3,
+        alignItems: "stretch",
+        ...props.sx
+      },
+      children: [
+        /* @__PURE__ */ jsxs11(Stack11, { sx: { gap: 1 }, children: [
+          /* @__PURE__ */ jsx11(Typography10, { variant: "subtitle2", children: "Request data lake access" }),
+          /* @__PURE__ */ jsx11(DataLakeRequestAccessPanel, { timeout })
+        ] }),
+        /* @__PURE__ */ jsx11(Divider, {}),
+        /* @__PURE__ */ jsxs11(Stack11, { sx: { gap: 1 }, children: [
+          /* @__PURE__ */ jsx11(Typography10, { variant: "subtitle2", children: "List approved lakes" }),
+          /* @__PURE__ */ jsx11(DataLakeListButton, { timeout })
+        ] }),
+        /* @__PURE__ */ jsx11(Divider, {}),
+        /* @__PURE__ */ jsxs11(Stack11, { sx: { gap: 1 }, children: [
+          /* @__PURE__ */ jsx11(Typography10, { variant: "subtitle2", children: "Insert payloads" }),
+          /* @__PURE__ */ jsx11(DataLakeInsertPanel, { timeout })
+        ] }),
+        /* @__PURE__ */ jsx11(Divider, {}),
+        /* @__PURE__ */ jsxs11(Stack11, { sx: { gap: 1 }, children: [
+          /* @__PURE__ */ jsx11(Typography10, { variant: "subtitle2", children: "Get payloads by hash" }),
+          /* @__PURE__ */ jsx11(DataLakeGetPanel, { timeout })
+        ] })
+      ]
+    }
+  );
+};
+
+// src/client/components/connected/PermissionsReviewDialog.tsx
 import {
   Alert as Alert8,
-  Stack as Stack11,
+  Box,
+  Chip,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  Divider as Divider2,
+  Stack as Stack12,
   Typography as Typography11
 } from "@mui/material";
 import { ButtonEx as ButtonEx7 } from "@xylabs/react-button";
 import { ErrorRender as ErrorRender7 } from "@xylabs/react-error";
-import { isDefined as isDefined9, isDefinedNotNull as isDefinedNotNull7 } from "@xylabs/sdk-js";
-import { useState as useState10 } from "react";
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { isDefined as isDefined9 } from "@xylabs/sdk-js";
+import React10 from "react";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+var renderCaveatValue = (caveat) => {
+  if (caveat.type === "restrictReturnedAccounts" && Array.isArray(caveat.value)) {
+    if (caveat.value.length === 0) {
+      return /* @__PURE__ */ jsx12(Typography11, { variant: "caption", sx: { color: "text.secondary" }, children: "(no address restriction \u2014 every selected account is returned)" });
+    }
+    return /* @__PURE__ */ jsx12(Stack12, { direction: "row", sx: { flexWrap: "wrap", gap: 0.5 }, children: caveat.value.map((address) => /* @__PURE__ */ jsx12(
+      Chip,
+      {
+        label: String(address),
+        size: "small",
+        sx: { fontFamily: "monospace" }
+      },
+      String(address)
+    )) });
+  }
+  if (caveat.type === "dataLakeAccess" && typeof caveat.value === "object" && caveat.value !== null) {
+    const value = caveat.value;
+    return /* @__PURE__ */ jsxs12(Stack12, { sx: { gap: 0.5 }, children: [
+      isDefined9(value.perOriginId) ? /* @__PURE__ */ jsxs12(Stack12, { direction: "row", sx: { alignItems: "center", gap: 1 }, children: [
+        /* @__PURE__ */ jsx12(Typography11, { variant: "caption", sx: { color: "text.secondary" }, children: "id:" }),
+        /* @__PURE__ */ jsx12(Typography11, { variant: "body2", sx: { fontFamily: "monospace", wordBreak: "break-all" }, children: value.perOriginId })
+      ] }) : null,
+      isDefined9(value.narrowedSchemas) && value.narrowedSchemas.length > 0 ? /* @__PURE__ */ jsxs12(
+        Stack12,
+        {
+          direction: "row",
+          sx: {
+            alignItems: "center",
+            flexWrap: "wrap",
+            gap: 0.5
+          },
+          children: [
+            /* @__PURE__ */ jsx12(Typography11, { variant: "caption", sx: { color: "text.secondary" }, children: "schemas:" }),
+            value.narrowedSchemas.map((schema) => /* @__PURE__ */ jsx12(
+              Chip,
+              {
+                label: schema,
+                size: "small",
+                variant: "outlined"
+              },
+              schema
+            ))
+          ]
+        }
+      ) : null
+    ] });
+  }
+  return /* @__PURE__ */ jsx12(
+    Typography11,
+    {
+      component: "pre",
+      variant: "body2",
+      sx: {
+        fontFamily: "monospace",
+        m: 0,
+        whiteSpace: "pre-wrap",
+        wordBreak: "break-all"
+      },
+      children: JSON.stringify(caveat.value, null, 2)
+    }
+  );
+};
+var renderPermission = (permission) => {
+  const caveats = permission.caveats ?? [];
+  return /* @__PURE__ */ jsxs12(Stack12, { sx: { gap: 1 }, children: [
+    /* @__PURE__ */ jsxs12(
+      Stack12,
+      {
+        direction: "row",
+        sx: {
+          alignItems: "center",
+          flexWrap: "wrap",
+          gap: 1
+        },
+        children: [
+          /* @__PURE__ */ jsx12(Typography11, { variant: "subtitle2", sx: { fontFamily: "monospace" }, children: permission.parentCapability }),
+          isDefined9(permission.date) ? /* @__PURE__ */ jsxs12(Typography11, { variant: "caption", sx: { color: "text.secondary" }, children: [
+            "granted",
+            " ",
+            new Date(permission.date).toLocaleString()
+          ] }) : null
+        ]
+      }
+    ),
+    caveats.length === 0 ? /* @__PURE__ */ jsx12(Typography11, { variant: "caption", sx: { color: "text.secondary" }, children: "(no caveats)" }) : /* @__PURE__ */ jsx12(Stack12, { sx: { gap: 1, pl: 1 }, children: caveats.map((caveat) => /* @__PURE__ */ jsxs12(Stack12, { sx: { gap: 0.5 }, children: [
+      /* @__PURE__ */ jsx12(Chip, { label: caveat.type, size: "small", sx: { alignSelf: "flex-start" } }),
+      /* @__PURE__ */ jsx12(Box, { sx: { pl: 1 }, children: renderCaveatValue(caveat) })
+    ] }, caveat.type)) })
+  ] });
+};
+var PermissionsReviewDialog = ({
+  granted,
+  onClose,
+  onReRequest,
+  open,
+  requesting,
+  error
+}) => {
+  return /* @__PURE__ */ jsxs12(Dialog, { open, onClose, fullWidth: true, maxWidth: "sm", children: [
+    /* @__PURE__ */ jsx12(DialogTitle, { children: "Granted permissions" }),
+    /* @__PURE__ */ jsx12(DialogContent, { dividers: true, children: /* @__PURE__ */ jsxs12(Stack12, { sx: { gap: 2 }, children: [
+      granted.length === 0 ? /* @__PURE__ */ jsx12(Alert8, { severity: "info", children: "No permissions are currently granted to this origin." }) : granted.map((permission, index) => /* @__PURE__ */ jsxs12(React10.Fragment, { children: [
+        index > 0 ? /* @__PURE__ */ jsx12(Divider2, {}) : null,
+        renderPermission(permission)
+      ] }, permission.parentCapability)),
+      /* @__PURE__ */ jsx12(ErrorRender7, { error, scope: "PermissionsReviewDialog" })
+    ] }) }),
+    /* @__PURE__ */ jsxs12(DialogActions, { children: [
+      /* @__PURE__ */ jsx12(ButtonEx7, { variant: "text", size: "small", onClick: onClose, children: "Close" }),
+      /* @__PURE__ */ jsx12(
+        ButtonEx7,
+        {
+          variant: "contained",
+          size: "small",
+          disabled: requesting,
+          busy: requesting,
+          onClick: onReRequest,
+          children: "Re-request permissions"
+        }
+      )
+    ] })
+  ] });
+};
+
+// src/client/components/connected/RequestPermissionsButton.tsx
+import { Alert as Alert9, Stack as Stack13 } from "@mui/material";
+import { ButtonEx as ButtonEx8 } from "@xylabs/react-button";
+import { ErrorRender as ErrorRender8 } from "@xylabs/react-error";
+import { isDefined as isDefined10, isDefinedNotNull as isDefinedNotNull7 } from "@xylabs/sdk-js";
+import {
+  useCallback as useCallback3,
+  useEffect as useEffect4,
+  useState as useState11
+} from "react";
+import { Fragment, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 var RequestPermissionsButton = ({
   permissions,
   timeout,
@@ -1011,25 +1235,51 @@ var RequestPermissionsButton = ({
     isLoading,
     timedout
   } = useClientFromWallet(timeout);
-  const [acks, setAcks] = useState10();
-  const [requestError, setRequestError] = useState10();
-  const [requesting, setRequesting] = useState10(false);
-  const handleClick = async () => {
-    if (!isDefinedNotNull7(client)) return;
+  const [granted, setGranted] = useState11();
+  const [fetchError, setFetchError] = useState11();
+  const [requestError, setRequestError] = useState11();
+  const [requesting, setRequesting] = useState11(false);
+  const [dialogOpen, setDialogOpen] = useState11(false);
+  const permissionsApi = client?.permissions;
+  const refreshGranted = useCallback3(async () => {
+    if (!isDefinedNotNull7(permissionsApi)) return;
+    setFetchError(void 0);
+    try {
+      const result = await permissionsApi.getPermissions();
+      setGranted(result ?? []);
+    } catch (e) {
+      setGranted([]);
+      setFetchError(e);
+    }
+  }, [permissionsApi]);
+  useEffect4(() => {
+    if (isDefinedNotNull7(permissionsApi) && granted === void 0) {
+      void refreshGranted();
+    }
+  }, [permissionsApi, granted, refreshGranted]);
+  const requestPermissions = useCallback3(async () => {
+    if (!isDefinedNotNull7(permissionsApi)) return;
     setRequestError(void 0);
-    setAcks(void 0);
     setRequesting(true);
     try {
-      const result = await client.permissions.requestPermissions(permissions);
-      setAcks(result);
+      await permissionsApi.requestPermissions(permissions);
+      void refreshGranted();
     } catch (e) {
       setRequestError(e);
     } finally {
       setRequesting(false);
     }
+  }, [permissionsApi, permissions, refreshGranted]);
+  const hasGranted = isDefined10(granted) && granted.length > 0;
+  const handleClick = () => {
+    if (hasGranted) {
+      setDialogOpen(true);
+      return;
+    }
+    void requestPermissions();
   };
-  return /* @__PURE__ */ jsxs11(
-    Stack11,
+  return /* @__PURE__ */ jsxs13(
+    Stack13,
     {
       ...props,
       sx: {
@@ -1038,46 +1288,37 @@ var RequestPermissionsButton = ({
         ...props.sx
       },
       children: [
-        timedout ? /* @__PURE__ */ jsx11(Alert8, { severity: "warning", children: "Wallet not detected." }) : null,
-        /* @__PURE__ */ jsxs11(
-          ButtonEx7,
+        timedout ? /* @__PURE__ */ jsx13(Alert9, { severity: "warning", children: "Wallet not detected." }) : null,
+        /* @__PURE__ */ jsx13(
+          ButtonEx8,
           {
             variant: "contained",
             size: "small",
-            disabled: !isDefinedNotNull7(client) || requesting,
+            disabled: !isDefinedNotNull7(permissionsApi) || requesting,
             busy: isLoading || requesting,
-            onClick: () => void handleClick(),
-            children: [
+            onClick: handleClick,
+            children: hasGranted ? "Review permissions" : /* @__PURE__ */ jsxs13(Fragment, { children: [
               "Request",
               " ",
               permissions.length,
               " ",
               "permission",
               permissions.length === 1 ? "" : "s"
-            ]
+            ] })
           }
         ),
-        isDefined9(acks) ? /* @__PURE__ */ jsxs11(Stack11, { sx: { gap: 0.5 }, children: [
-          /* @__PURE__ */ jsx11(Typography11, { variant: "subtitle2", children: "Granted:" }),
-          acks.map((ack) => /* @__PURE__ */ jsx11(
-            Typography11,
-            {
-              variant: "body2",
-              sx: { fontFamily: "monospace" },
-              children: ack.parentCapability
-            },
-            `${ack.parentCapability}`
-          )),
-          acks.length === 0 ? /* @__PURE__ */ jsx11(
-            Typography11,
-            {
-              variant: "body2",
-              sx: { color: "text.secondary" },
-              children: "(empty \u2014 wallet returned no acks)"
-            }
-          ) : null
-        ] }) : null,
-        /* @__PURE__ */ jsx11(ErrorRender7, { error: clientError ?? requestError, scope: "RequestPermissionsButton" })
+        /* @__PURE__ */ jsx13(ErrorRender8, { error: clientError ?? fetchError ?? requestError, scope: "RequestPermissionsButton" }),
+        /* @__PURE__ */ jsx13(
+          PermissionsReviewDialog,
+          {
+            open: dialogOpen,
+            onClose: () => setDialogOpen(false),
+            granted: granted ?? [],
+            onReRequest: () => void requestPermissions(),
+            requesting,
+            error: requestError
+          }
+        )
       ]
     }
   );
@@ -1095,14 +1336,14 @@ var InPageGatewaysContext = createContextEx2();
 import { DefaultNetworks as DefaultNetworks2 } from "@xyo-network/xl1-sdk";
 import {
   startTransition,
-  useCallback as useCallback3,
-  useEffect as useEffect4,
-  useMemo as useMemo3,
-  useState as useState11
+  useCallback as useCallback4,
+  useEffect as useEffect5,
+  useMemo as useMemo4,
+  useState as useState12
 } from "react";
 
 // src/client/context/in-page/lib/buildGateway.ts
-import { assertEx as assertEx2, isDefined as isDefined10 } from "@xylabs/sdk-js";
+import { assertEx as assertEx2, isDefined as isDefined11 } from "@xylabs/sdk-js";
 import {
   basicRemoteRunnerLocator,
   basicRemoteViewerLocator,
@@ -1118,17 +1359,17 @@ var buildGateway = async (gatewayName, signerTransport) => {
       url: `${resolvedNetwork.url}/rpc`
     }
   };
-  const locator = isDefined10(signerTransport) ? await basicRemoteRunnerLocator(gatewayName, remoteConfig, signerTransport) : await basicRemoteViewerLocator(gatewayName, remoteConfig);
+  const locator = isDefined11(signerTransport) ? await basicRemoteRunnerLocator(gatewayName, remoteConfig, signerTransport) : await basicRemoteViewerLocator(gatewayName, remoteConfig);
   return await locator.getInstance(XyoGatewayMoniker);
 };
 
 // src/client/context/in-page/Provider.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var InPageGatewaysProvider = ({ signerTransport, children }) => {
-  const [gateways, setGateways] = useState11({});
-  const [errors, setErrors] = useState11({});
-  const [previousSignerTransport, setPreviousSignerTransport] = useState11(signerTransport);
-  const clearAll = useCallback3(() => {
+  const [gateways, setGateways] = useState12({});
+  const [errors, setErrors] = useState12({});
+  const [previousSignerTransport, setPreviousSignerTransport] = useState12(signerTransport);
+  const clearAll = useCallback4(() => {
     setGateways({});
     setErrors({});
   }, []);
@@ -1136,7 +1377,7 @@ var InPageGatewaysProvider = ({ signerTransport, children }) => {
     clearAll();
     setPreviousSignerTransport(signerTransport);
   }
-  useEffect4(() => {
+  useEffect5(() => {
     let cancelled = false;
     const buildAll = async () => {
       const results = await Promise.allSettled(
@@ -1166,7 +1407,7 @@ var InPageGatewaysProvider = ({ signerTransport, children }) => {
       cancelled = true;
     };
   }, [signerTransport]);
-  const value = useMemo3(() => {
+  const value = useMemo4(() => {
     const value2 = {
       clearAll,
       errors,
@@ -1175,7 +1416,7 @@ var InPageGatewaysProvider = ({ signerTransport, children }) => {
     };
     return value2;
   }, [clearAll, errors, gateways]);
-  return /* @__PURE__ */ jsx12(InPageGatewaysContext, { value, children });
+  return /* @__PURE__ */ jsx14(InPageGatewaysContext, { value, children });
 };
 
 // src/client/context/in-page/useProvidedInPageGateways.ts
@@ -1183,10 +1424,10 @@ import { useContextEx } from "@xylabs/react-shared";
 var useProvidedInPageGateways = (required = true) => useContextEx(InPageGatewaysContext, "InPageGateways", required);
 
 // src/client/context/providers/GatewayProvider.tsx
-import { ErrorRender as ErrorRender8 } from "@xylabs/react-error";
+import { ErrorRender as ErrorRender9 } from "@xylabs/react-error";
 import { isDefinedNotNull as isDefinedNotNull8, isNull as isNull2 } from "@xylabs/sdk-js";
-import { useMemo as useMemo4 } from "react";
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useMemo as useMemo5 } from "react";
+import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 var GatewayProvider = ({ gatewayName, children }) => {
   const {
     gateway: gatewayFromWallet,
@@ -1199,7 +1440,7 @@ var GatewayProvider = ({ gatewayName, children }) => {
   } = useProvidedInPageGateways(true);
   const gatewayFromConfig = gatewayName ? allGateways[gatewayName] : void 0;
   const gatewayFromConfigError = gatewayName ? allGatewayErrors[gatewayName] : void 0;
-  const { defaultGateway, gateways } = useMemo4(() => {
+  const { defaultGateway, gateways } = useMemo5(() => {
     if (isNull2(gatewayFromWallet)) {
       return {
         defaultGateway: gatewayFromConfig,
@@ -1225,7 +1466,7 @@ var GatewayProvider = ({ gatewayName, children }) => {
       }
     };
   }, [gatewayFromConfig, gatewayFromWallet]);
-  const value = useMemo4(() => {
+  const value = useMemo5(() => {
     const value2 = {
       defaultGateway,
       error: gatewayFromWalletError ?? gatewayFromConfigError,
@@ -1241,22 +1482,22 @@ var GatewayProvider = ({ gatewayName, children }) => {
     gateways,
     clearAll
   ]);
-  return /* @__PURE__ */ jsxs12(GatewayContext, { value, children: [
-    /* @__PURE__ */ jsx13(ErrorRender8, { error: gatewayFromConfigError }),
+  return /* @__PURE__ */ jsxs14(GatewayContext, { value, children: [
+    /* @__PURE__ */ jsx15(ErrorRender9, { error: gatewayFromConfigError }),
     children
   ] });
 };
 
 // src/client/context/providers/WalletGatewayProvider.tsx
-import { ErrorRender as ErrorRender9 } from "@xylabs/react-error";
-import { useMemo as useMemo5 } from "react";
-import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { ErrorRender as ErrorRender10 } from "@xylabs/react-error";
+import { useMemo as useMemo6 } from "react";
+import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 var WalletGatewayProvider = ({ gatewayName, children }) => {
   const {
     gateway: gatewayFromWallet,
     error: gatewayFromWalletError
   } = useGatewayFromWallet(gatewayName);
-  const { defaultGateway, gateways } = useMemo5(() => {
+  const { defaultGateway, gateways } = useMemo6(() => {
     return {
       defaultGateway: gatewayFromWallet,
       gateways: {
@@ -1265,7 +1506,7 @@ var WalletGatewayProvider = ({ gatewayName, children }) => {
       }
     };
   }, [gatewayFromWallet]);
-  const value = useMemo5(() => {
+  const value = useMemo6(() => {
     const value2 = {
       defaultGateway,
       error: gatewayFromWalletError,
@@ -1278,8 +1519,8 @@ var WalletGatewayProvider = ({ gatewayName, children }) => {
     gatewayFromWalletError,
     gateways
   ]);
-  return /* @__PURE__ */ jsxs13(GatewayContext, { value, children: [
-    /* @__PURE__ */ jsx14(ErrorRender9, { error: gatewayFromWalletError }),
+  return /* @__PURE__ */ jsxs15(GatewayContext, { value, children: [
+    /* @__PURE__ */ jsx16(ErrorRender10, { error: gatewayFromWalletError }),
     children
   ] });
 };
@@ -1298,12 +1539,8 @@ var isUninitializedXyoGlobal = (obj) => {
 };
 
 // src/shared/components/menu-item/ActiveMenuItem.tsx
-import {
-  MenuItem as MenuItem2,
-  styled,
-  useTheme
-} from "@mui/material";
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { MenuItem as MenuItem3, useTheme } from "@mui/material";
+import { jsx as jsx17 } from "react/jsx-runtime";
 var ActiveMenuItem = ({
   active,
   children,
@@ -1311,11 +1548,17 @@ var ActiveMenuItem = ({
   ...props
 }) => {
   const theme = useTheme();
-  return /* @__PURE__ */ jsx15(
-    StyledMenuItem,
+  return /* @__PURE__ */ jsx17(
+    MenuItem3,
     {
       disableRipple: true,
       sx: {
+        "display": "flex-inline",
+        "flexDirection": "row",
+        "gap": 1,
+        "padding": 0,
+        "paddingLeft": 1,
+        "marginBottom": 1,
         // left border color and background color for active state
         "borderLeft": `5px solid ${active ? theme.vars.palette.secondary.light : "transparent"}`,
         "backgroundColor": active ? theme.vars.palette.secondary.dark : "transparent",
@@ -1334,26 +1577,17 @@ var ActiveMenuItem = ({
     }
   );
 };
-var StyledMenuItem = styled(MenuItem2, { name: "StyledMenuItem" })(({ theme }) => ({
-  display: "flex-inline",
-  flexDirection: "row",
-  gap: theme.spacing(1),
-  padding: 0,
-  paddingLeft: theme.spacing(1),
-  marginBottom: theme.spacing(1)
-}));
 
 // src/shared/components/stack/DetailsStack.tsx
 import {
-  Stack as Stack12,
-  styled as styled2,
+  Stack as Stack14,
   Tooltip as Tooltip2,
   Typography as Typography12,
   useTheme as useTheme2
 } from "@mui/material";
-import { isDefined as isDefined11 } from "@xylabs/sdk-js";
-import { useMemo as useMemo6 } from "react";
-import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
+import { isDefined as isDefined12 } from "@xylabs/sdk-js";
+import { useMemo as useMemo7 } from "react";
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 var isComponentType = (value) => typeof value === "function" || typeof value === "object" && value !== null && ("$$typeof" in value || "render" in value);
 var DetailsStack = ({
   IconComponent,
@@ -1363,9 +1597,9 @@ var DetailsStack = ({
   ...props
 }) => {
   const theme = useTheme2();
-  const hasTooltip = isDefined11(tooltipTitle);
-  const resolvedIconComponent = useMemo6(() => {
-    return isComponentType(IconComponent) ? /* @__PURE__ */ jsx16(
+  const hasTooltip = isDefined12(tooltipTitle);
+  const resolvedIconComponent = useMemo7(() => {
+    return isComponentType(IconComponent) ? /* @__PURE__ */ jsx18(
       IconComponent,
       {
         style: {
@@ -1377,8 +1611,8 @@ var DetailsStack = ({
       }
     ) : IconComponent ?? null;
   }, [IconComponent, theme]);
-  return /* @__PURE__ */ jsxs14(
-    Stack12,
+  return /* @__PURE__ */ jsxs16(
+    Stack14,
     {
       direction: "column",
       ...props,
@@ -1389,30 +1623,35 @@ var DetailsStack = ({
         ...props.sx
       },
       children: [
-        /* @__PURE__ */ jsxs14(SectionHeadingTypography, { children: [
-          heading,
-          hasTooltip ? /* @__PURE__ */ jsx16(Tooltip2, { title: tooltipTitle, children: /* @__PURE__ */ jsx16("span", { children: resolvedIconComponent }) }) : resolvedIconComponent
-        ] }),
+        /* @__PURE__ */ jsxs16(
+          Typography12,
+          {
+            sx: {
+              display: "flex",
+              fontFamily: "monospace",
+              lineHeight: 1,
+              marginBottom: 1.5
+            },
+            children: [
+              heading,
+              hasTooltip ? /* @__PURE__ */ jsx18(Tooltip2, { title: tooltipTitle, children: /* @__PURE__ */ jsx18("span", { children: resolvedIconComponent }) }) : resolvedIconComponent
+            ]
+          }
+        ),
         children
       ]
     }
   );
 };
-var SectionHeadingTypography = styled2(Typography12, { name: "SectionHeadingTypography" })(({ theme }) => ({
-  display: "flex",
-  fontFamily: "monospace",
-  lineHeight: 1,
-  marginBottom: theme.spacing(1.5)
-}));
 
 // src/shared/components/stack/LabelValueStack.tsx
 import {
-  Stack as Stack13,
+  Stack as Stack15,
   Typography as Typography13,
   useTheme as useTheme3
 } from "@mui/material";
 import { ellipsize, isAddress } from "@xylabs/sdk-js";
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
 var LabelValueStack = ({
   labels,
   values,
@@ -1425,8 +1664,8 @@ var LabelValueStack = ({
     }
     return value;
   };
-  return /* @__PURE__ */ jsxs15(
-    Stack13,
+  return /* @__PURE__ */ jsxs17(
+    Stack15,
     {
       ...props,
       sx: {
@@ -1435,7 +1674,7 @@ var LabelValueStack = ({
         ...props.sx
       },
       children: [
-        /* @__PURE__ */ jsx17(Stack13, { children: labels.map((label) => /* @__PURE__ */ jsxs15(
+        /* @__PURE__ */ jsx19(Stack15, { children: labels.map((label) => /* @__PURE__ */ jsxs17(
           Typography13,
           {
             variant: "body2",
@@ -1451,14 +1690,14 @@ var LabelValueStack = ({
           },
           label
         )) }),
-        /* @__PURE__ */ jsx17(
-          Stack13,
+        /* @__PURE__ */ jsx19(
+          Stack15,
           {
             sx: {
               alignItems: "end",
               flexGrow: 1
             },
-            children: values.map((value, index) => /* @__PURE__ */ jsx17(
+            children: values.map((value, index) => /* @__PURE__ */ jsx19(
               Typography13,
               {
                 title: value,
@@ -1482,15 +1721,15 @@ var LabelValueStack = ({
 };
 
 // src/shared/decorators/IframeWalletWarningDecorator.tsx
-import { Alert as Alert9, Stack as Stack14 } from "@mui/material";
-import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Alert as Alert10, Stack as Stack16 } from "@mui/material";
+import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
 var inIframe = globalThis.self !== window.top;
 var IframeWalletWarningDecorator = (Story, args) => {
   const hasXyoGlobal = isXyoGlobal(globalThis.xyo);
-  return /* @__PURE__ */ jsxs16(Stack14, { sx: { gap: 2 }, children: [
-    inIframe ? /* @__PURE__ */ jsx18(Alert9, { severity: "warning", children: "This story is running in an iframe. Please run it in a standalone browser window to test the wallet extension." }) : null,
-    hasXyoGlobal ? null : /* @__PURE__ */ jsx18(Alert9, { severity: "warning", children: "No wallet extension found. Please install the Xyo Wallet Chrome Extension." }),
-    /* @__PURE__ */ jsx18(Story, { ...args })
+  return /* @__PURE__ */ jsxs18(Stack16, { sx: { gap: 2 }, children: [
+    inIframe ? /* @__PURE__ */ jsx20(Alert10, { severity: "warning", children: "This story is running in an iframe. Please run it in a standalone browser window to test the wallet extension." }) : null,
+    hasXyoGlobal ? null : /* @__PURE__ */ jsx20(Alert10, { severity: "warning", children: "No wallet extension found. Please install the Xyo Wallet Chrome Extension." }),
+    /* @__PURE__ */ jsx20(Story, { ...args })
   ] });
 };
 export {
@@ -1505,6 +1744,7 @@ export {
   DataLakeListButton,
   DataLakeOperationsPanel,
   DataLakeRequestAccessButton,
+  DataLakeRequestAccessPanel,
   DetailsStack,
   GatewayContext,
   GatewayProvider,
@@ -1512,6 +1752,7 @@ export {
   InPageGatewaysContext,
   InPageGatewaysProvider,
   LabelValueStack,
+  PermissionsReviewDialog,
   RequestPermissionsButton,
   WalletGatewayProvider,
   findCaveat,