@btst/stack 3.0.0-rc.2 → 3.0.0-rc.4

package/dist/packages/stack/src/plugins/media/client/components/media-picker/index.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState, useEffect } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
 import { Popover, PopoverTrigger, PopoverContent } from '../../../../../../../ui/src/components/popover.mjs';
 import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '../../../../../../../ui/src/components/tabs.mjs';
@@ -9,8 +9,29 @@ import { FolderTree } from './folder-tree.mjs';
 import { BrowseTab } from './browse-tab.mjs';
 import { UploadTab } from './upload-tab.mjs';
 import { UrlTab } from './url-tab.mjs';
-import { useTranslate, useCan, useStack } from '@btst/stack/context';
+import { useTranslate, useStack, PermissionAccess } from '@btst/stack/context';
+import { mediaPermissions } from '../../../../../../../../plugins/media/permissions.mjs';
+import { MEDIA_PLUGIN_ID } from '../../constants.mjs';
+import { MediaUploadPermissionCheck, MediaFinalizePermissionCheck } from '../upload-permission-check.mjs';
 
+function AssetSelectionAccess({
+  assets,
+  children
+}) {
+  const [asset, ...rest] = assets;
+  if (!asset) return children;
+  return /* @__PURE__ */ jsx(
+    PermissionAccess,
+    {
+      permission: mediaPermissions.asset.read({
+        assetId: asset.id,
+        ...asset.folderId ? { folderId: asset.folderId } : {},
+        mimeType: asset.mimeType
+      }),
+      children: /* @__PURE__ */ jsx(AssetSelectionAccess, { assets: rest, children })
+    }
+  );
+}
 function MediaPicker({
   trigger,
   onSelect,
@@ -18,21 +39,15 @@ function MediaPicker({
   accept
 }) {
   const t = useTranslate();
-  const { can: canCreate, isPending: isCreatePermissionPending } = useCan({
-    resource: "media:asset",
-    action: "create"
-  });
+  const { plugins } = useStack();
+  const providerConfig = plugins?.[MEDIA_PLUGIN_ID]?.config;
+  const uploadMode = providerConfig?.uploadMode ?? "direct";
   const [open, setOpen] = useState(false);
   const [selectedFolder, setSelectedFolder] = useState(null);
   const [selectedAssets, setSelectedAssets] = useState([]);
   const [activeTab, setActiveTab] = useState(
     "browse"
   );
-  useEffect(() => {
-    if (!isCreatePermissionPending && !canCreate && activeTab !== "browse") {
-      setActiveTab("browse");
-    }
-  }, [activeTab, canCreate, isCreatePermissionPending]);
   const handleClose = () => {
     setOpen(false);
     setSelectedAssets([]);
@@ -53,7 +68,6 @@ function MediaPicker({
     }
   };
   const handleUploaded = (asset) => {
-    if (!canCreate) return;
     if (multiple) {
       setSelectedAssets((prev) => [...prev, asset]);
     } else {
@@ -62,191 +76,222 @@ function MediaPicker({
     }
   };
   const handleUrlRegistered = (asset) => {
-    if (!canCreate) return;
-    const toSelect = asset;
-    handleClose();
-    setTimeout(() => onSelect([toSelect]), 0);
+    handleUploaded(asset);
+    setActiveTab("browse");
   };
-  return /* @__PURE__ */ jsxs(
-    Popover,
+  return /* @__PURE__ */ jsx(PermissionAccess, { permission: mediaPermissions.library.read(), children: /* @__PURE__ */ jsx(
+    MediaUploadPermissionCheck,
     {
-      open,
-      onOpenChange: (v) => {
-        if (!v) handleClose();
-        else setOpen(true);
-      },
-      children: [
-        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: trigger }),
-        /* @__PURE__ */ jsx(
-          PopoverContent,
+      mode: uploadMode,
+      folderId: selectedFolder ?? void 0,
+      children: ({ can: canUpload, isPending, error }) => {
+        if (error) throw error;
+        const uploadAllowed = canUpload && !isPending;
+        return /* @__PURE__ */ jsx(
+          MediaFinalizePermissionCheck,
           {
-            className: "w-[calc(100vw-1rem)] max-w-[calc(100vw-1rem)] overflow-hidden p-0 sm:w-[820px]",
-            align: "start",
-            sideOffset: 8,
-            collisionPadding: 8,
-            style: {
-              maxWidth: "min(820px, calc(100vw - 1rem))",
-              height: "min(640px, calc(100dvh - 2rem))"
-            },
-            children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden rounded-md", children: [
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [
-                /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: t("media.picker.title", "Media Library") }),
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    "aria-label": t("media.actions.close", "Close"),
-                    onClick: handleClose,
-                    className: "rounded p-0.5 hover:bg-muted",
-                    children: /* @__PURE__ */ jsx(X, { className: "size-4" })
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col md:flex-row", children: [
-                /* @__PURE__ */ jsx("div", { className: "max-h-40 w-full shrink-0 overflow-hidden border-b bg-muted/20 md:max-h-none md:w-44 md:border-b-0 md:border-r", children: /* @__PURE__ */ jsx(
-                  FolderTree,
-                  {
-                    selectedId: selectedFolder,
-                    onSelect: setSelectedFolder
-                  }
-                ) }),
-                /* @__PURE__ */ jsx("div", { className: "flex min-w-0 flex-1 flex-col p-3 overflow-y-hidden", children: /* @__PURE__ */ jsxs(
-                  Tabs,
-                  {
-                    value: activeTab,
-                    onValueChange: (v) => setActiveTab(v),
-                    className: "flex flex-1 flex-col min-h-0",
-                    children: [
-                      /* @__PURE__ */ jsxs(
-                        TabsList,
-                        {
-                          className: `grid h-auto w-full shrink-0 ${canCreate ? "grid-cols-3" : "grid-cols-1"} md:flex md:w-fit`,
-                          children: [
-                            /* @__PURE__ */ jsxs(
-                              TabsTrigger,
+            folderId: selectedFolder ?? void 0,
+            children: ({ can: canFinalize, isPending: finalizePending, error: error2 }) => {
+              if (error2) throw error2;
+              const finalizeAllowed = canFinalize && !finalizePending;
+              const visibleTab = activeTab === "upload" && !uploadAllowed || activeTab === "url" && !finalizeAllowed ? "browse" : activeTab;
+              return /* @__PURE__ */ jsxs(
+                Popover,
+                {
+                  open,
+                  onOpenChange: (v) => {
+                    if (!v) handleClose();
+                    else setOpen(true);
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: trigger }),
+                    /* @__PURE__ */ jsx(
+                      PopoverContent,
+                      {
+                        className: "w-[calc(100vw-1rem)] max-w-[calc(100vw-1rem)] overflow-hidden p-0 sm:w-[820px]",
+                        align: "start",
+                        sideOffset: 8,
+                        collisionPadding: 8,
+                        style: {
+                          maxWidth: "min(820px, calc(100vw - 1rem))",
+                          height: "min(640px, calc(100dvh - 2rem))"
+                        },
+                        children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden rounded-md", children: [
+                          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [
+                            /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: t("media.picker.title", "Media Library") }),
+                            /* @__PURE__ */ jsx(
+                              "button",
                               {
-                                value: "browse",
-                                className: "h-8 px-2 text-xs md:h-6 md:px-3",
-                                children: [
-                                  /* @__PURE__ */ jsx(Image, { className: "mr-1 size-3" }),
-                                  t("media.tabs.browse", "Browse")
-                                ]
+                                type: "button",
+                                "aria-label": t("media.actions.close", "Close"),
+                                onClick: handleClose,
+                                className: "rounded p-0.5 hover:bg-muted",
+                                children: /* @__PURE__ */ jsx(X, { className: "size-4" })
                               }
-                            ),
-                            canCreate ? /* @__PURE__ */ jsxs(
-                              TabsTrigger,
+                            )
+                          ] }),
+                          /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col md:flex-row", children: [
+                            /* @__PURE__ */ jsx("div", { className: "max-h-40 w-full shrink-0 overflow-hidden border-b bg-muted/20 md:max-h-none md:w-44 md:border-b-0 md:border-r", children: /* @__PURE__ */ jsx(
+                              FolderTree,
                               {
-                                value: "upload",
-                                className: "h-8 px-2 text-xs md:h-6 md:px-3",
-                                children: [
-                                  /* @__PURE__ */ jsx(Upload, { className: "mr-1 size-3" }),
-                                  t("media.tabs.upload", "Upload")
-                                ]
+                                selectedId: selectedFolder,
+                                onSelect: setSelectedFolder
                               }
-                            ) : null,
-                            canCreate ? /* @__PURE__ */ jsxs(
-                              TabsTrigger,
+                            ) }),
+                            /* @__PURE__ */ jsx("div", { className: "flex min-w-0 flex-1 flex-col p-3 overflow-y-hidden", children: /* @__PURE__ */ jsxs(
+                              Tabs,
                               {
-                                value: "url",
-                                className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                                value: visibleTab,
+                                onValueChange: (v) => setActiveTab(v),
+                                className: "flex flex-1 flex-col min-h-0",
                                 children: [
-                                  /* @__PURE__ */ jsx(Link, { className: "mr-1 size-3" }),
-                                  t("media.tabs.url", "URL")
+                                  /* @__PURE__ */ jsxs(
+                                    TabsList,
+                                    {
+                                      className: `grid h-auto w-full shrink-0 ${uploadAllowed && finalizeAllowed ? "grid-cols-3" : uploadAllowed || finalizeAllowed ? "grid-cols-2" : "grid-cols-1"} md:flex md:w-fit`,
+                                      children: [
+                                        /* @__PURE__ */ jsxs(
+                                          TabsTrigger,
+                                          {
+                                            value: "browse",
+                                            className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                                            children: [
+                                              /* @__PURE__ */ jsx(Image, { className: "mr-1 size-3" }),
+                                              t("media.tabs.browse", "Browse")
+                                            ]
+                                          }
+                                        ),
+                                        uploadAllowed ? /* @__PURE__ */ jsxs(
+                                          TabsTrigger,
+                                          {
+                                            value: "upload",
+                                            className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                                            children: [
+                                              /* @__PURE__ */ jsx(Upload, { className: "mr-1 size-3" }),
+                                              t("media.tabs.upload", "Upload")
+                                            ]
+                                          }
+                                        ) : null,
+                                        finalizeAllowed ? /* @__PURE__ */ jsxs(
+                                          TabsTrigger,
+                                          {
+                                            value: "url",
+                                            className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                                            children: [
+                                              /* @__PURE__ */ jsx(Link, { className: "mr-1 size-3" }),
+                                              t("media.tabs.url", "URL")
+                                            ]
+                                          }
+                                        ) : null
+                                      ]
+                                    }
+                                  ),
+                                  /* @__PURE__ */ jsxs("div", { className: "mt-2 min-h-0 flex-1", children: [
+                                    /* @__PURE__ */ jsx(
+                                      TabsContent,
+                                      {
+                                        value: "browse",
+                                        className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
+                                        children: /* @__PURE__ */ jsx(
+                                          BrowseTab,
+                                          {
+                                            folderId: selectedFolder,
+                                            selected: selectedAssets,
+                                            accept,
+                                            onToggle: handleToggleAsset
+                                          }
+                                        )
+                                      }
+                                    ),
+                                    uploadAllowed ? /* @__PURE__ */ jsx(
+                                      TabsContent,
+                                      {
+                                        value: "upload",
+                                        className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
+                                        children: /* @__PURE__ */ jsx(
+                                          UploadTab,
+                                          {
+                                            folderId: selectedFolder,
+                                            accept,
+                                            onUploaded: handleUploaded
+                                          }
+                                        )
+                                      }
+                                    ) : null,
+                                    finalizeAllowed ? /* @__PURE__ */ jsx(
+                                      TabsContent,
+                                      {
+                                        value: "url",
+                                        className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
+                                        children: /* @__PURE__ */ jsx(
+                                          UrlTab,
+                                          {
+                                            folderId: selectedFolder,
+                                            onRegistered: handleUrlRegistered
+                                          }
+                                        )
+                                      }
+                                    ) : null
+                                  ] })
                                 ]
                               }
-                            ) : null
-                          ]
-                        }
-                      ),
-                      /* @__PURE__ */ jsxs("div", { className: "mt-2 min-h-0 flex-1", children: [
-                        /* @__PURE__ */ jsx(
-                          TabsContent,
-                          {
-                            value: "browse",
-                            className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
-                            children: /* @__PURE__ */ jsx(
-                              BrowseTab,
-                              {
-                                folderId: selectedFolder,
-                                selected: selectedAssets,
-                                accept,
-                                onToggle: handleToggleAsset
-                              }
-                            )
-                          }
-                        ),
-                        canCreate ? /* @__PURE__ */ jsx(
-                          TabsContent,
-                          {
-                            value: "upload",
-                            className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
-                            children: /* @__PURE__ */ jsx(
-                              UploadTab,
-                              {
-                                folderId: selectedFolder,
-                                accept,
-                                onUploaded: handleUploaded
-                              }
-                            )
-                          }
-                        ) : null,
-                        canCreate ? /* @__PURE__ */ jsx(
-                          TabsContent,
-                          {
-                            value: "url",
-                            className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
-                            children: /* @__PURE__ */ jsx(
-                              UrlTab,
+                            ) })
+                          ] }),
+                          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-t px-3 py-2 sm:flex-row sm:items-center sm:justify-between", children: [
+                            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: selectedAssets.length > 0 ? t(
+                              "media.picker.selected",
+                              "{{count}} selected",
                               {
-                                folderId: selectedFolder,
-                                onRegistered: handleUrlRegistered
+                                count: selectedAssets.length
                               }
-                            )
-                          }
-                        ) : null
-                      ] })
-                    ]
-                  }
-                ) })
-              ] }),
-              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-t px-3 py-2 sm:flex-row sm:items-center sm:justify-between", children: [
-                /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: selectedAssets.length > 0 ? t("media.picker.selected", "{{count}} selected", {
-                  count: selectedAssets.length
-                }) : t("media.picker.selectHint", "Click a file to select it") }),
-                /* @__PURE__ */ jsxs("div", { className: "flex w-full gap-2 sm:w-auto", children: [
-                  /* @__PURE__ */ jsx(
-                    Button,
-                    {
-                      type: "button",
-                      variant: "ghost",
-                      size: "sm",
-                      onClick: handleClose,
-                      className: "flex-1 sm:flex-none",
-                      children: t("media.actions.cancel", "Cancel")
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Button,
-                    {
-                      type: "button",
-                      size: "sm",
-                      "data-testid": "media-select-button",
-                      onClick: handleConfirm,
-                      disabled: selectedAssets.length === 0,
-                      className: "flex-1 sm:flex-none",
-                      children: multiple ? t("media.actions.selectMany", "Select ({{count}})", {
-                        count: selectedAssets.length
-                      }) : t("media.actions.select", "Select")
-                    }
-                  )
-                ] })
-              ] })
-            ] })
+                            ) : t(
+                              "media.picker.selectHint",
+                              "Click a file to select it"
+                            ) }),
+                            /* @__PURE__ */ jsxs("div", { className: "flex w-full gap-2 sm:w-auto", children: [
+                              /* @__PURE__ */ jsx(
+                                Button,
+                                {
+                                  type: "button",
+                                  variant: "ghost",
+                                  size: "sm",
+                                  onClick: handleClose,
+                                  className: "flex-1 sm:flex-none",
+                                  children: t("media.actions.cancel", "Cancel")
+                                }
+                              ),
+                              /* @__PURE__ */ jsx(AssetSelectionAccess, { assets: selectedAssets, children: /* @__PURE__ */ jsx(
+                                Button,
+                                {
+                                  type: "button",
+                                  size: "sm",
+                                  "data-testid": "media-select-button",
+                                  onClick: handleConfirm,
+                                  disabled: selectedAssets.length === 0,
+                                  className: "flex-1 sm:flex-none",
+                                  children: multiple ? t(
+                                    "media.actions.selectMany",
+                                    "Select ({{count}})",
+                                    {
+                                      count: selectedAssets.length
+                                    }
+                                  ) : t("media.actions.select", "Select")
+                                }
+                              ) })
+                            ] })
+                          ] })
+                        ] })
+                      }
+                    )
+                  ]
+                }
+              );
+            }
           }
-        )
-      ]
+        );
+      }
     }
-  );
+  ) });
 }
 function ImageInputField({
   value,

package/dist/packages/stack/src/plugins/media/client/components/media-picker/upload-tab.cjs

@@ -16,10 +16,6 @@ function UploadTab({
 }) {
   const t = context.useTranslate();
   const notify = context.useNotify();
-  const { can: canCreate } = context.useCan({
-    resource: "media:asset",
-    action: "create"
-  });
   const [dragging, setDragging] = React.useState(false);
   const [uploading, setUploading] = React.useState(false);
   const [error, setError] = React.useState(null);
@@ -28,7 +24,6 @@ function UploadTab({
   const acceptAttr = accept?.join(",") ?? void 0;
   const handleFiles = React.useCallback(
     async (files) => {
-      if (!canCreate) return;
       const fileArr = Array.from(files);
       if (fileArr.length === 0) return;
       setError(null);
@@ -66,15 +61,13 @@ function UploadTab({
         setUploading(false);
       }
     },
-    [accept, canCreate, folderId, notify, onUploaded, t, uploadAsset]
+    [accept, folderId, notify, onUploaded, t, uploadAsset]
   );
-  if (!canCreate) return null;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col gap-3", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         onDragOver: (e) => {
-          if (!canCreate) return;
           e.preventDefault();
           setDragging(true);
         },

package/dist/packages/stack/src/plugins/media/client/components/media-picker/upload-tab.mjs

@@ -5,7 +5,7 @@ import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { Loader2, Upload } from 'lucide-react';
 import { cn } from '../../../../../../../ui/src/lib/utils.mjs';
 import { matchesAccept } from './utils.mjs';
-import { useTranslate, useNotify, useCan } from '@btst/stack/context';
+import { useTranslate, useNotify } from '@btst/stack/context';
 
 function UploadTab({
   folderId,
@@ -14,10 +14,6 @@ function UploadTab({
 }) {
   const t = useTranslate();
   const notify = useNotify();
-  const { can: canCreate } = useCan({
-    resource: "media:asset",
-    action: "create"
-  });
   const [dragging, setDragging] = useState(false);
   const [uploading, setUploading] = useState(false);
   const [error, setError] = useState(null);
@@ -26,7 +22,6 @@ function UploadTab({
   const acceptAttr = accept?.join(",") ?? void 0;
   const handleFiles = useCallback(
     async (files) => {
-      if (!canCreate) return;
       const fileArr = Array.from(files);
       if (fileArr.length === 0) return;
       setError(null);
@@ -64,15 +59,13 @@ function UploadTab({
         setUploading(false);
       }
     },
-    [accept, canCreate, folderId, notify, onUploaded, t, uploadAsset]
+    [accept, folderId, notify, onUploaded, t, uploadAsset]
   );
-  if (!canCreate) return null;
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-3", children: [
     /* @__PURE__ */ jsx(
       "div",
       {
         onDragOver: (e) => {
-          if (!canCreate) return;
           e.preventDefault();
           setDragging(true);
         },

package/dist/packages/stack/src/plugins/media/client/components/media-picker/url-tab.cjs

@@ -13,10 +13,6 @@ function UrlTab({
   onRegistered
 }) {
   const t = context.useTranslate();
-  const { can: canCreate } = context.useCan({
-    resource: "media:asset",
-    action: "create"
-  });
   const [url, setUrl] = React.useState("");
   const form = useMedia.useRegisterAssetForm({
     folderId: folderId ?? void 0,
@@ -25,7 +21,6 @@ function UrlTab({
   const handleSubmit = async (e) => {
     e.preventDefault();
     e.stopPropagation();
-    if (!canCreate) return;
     form.clearErrors();
     const trimmed = url.trim();
     if (!trimmed) return;
@@ -34,7 +29,6 @@ function UrlTab({
       setUrl("");
     }
   };
-  if (!canCreate) return null;
   const urlError = form.fieldErrors.url;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col gap-3 pt-2", children: [
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: t(

package/dist/packages/stack/src/plugins/media/client/components/media-picker/url-tab.mjs

@@ -4,17 +4,13 @@ import { useRegisterAssetForm } from '../../hooks/use-media.mjs';
 import { Input } from '../../../../../../../ui/src/components/input.mjs';
 import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { Loader2, Check } from 'lucide-react';
-import { useTranslate, useCan } from '@btst/stack/context';
+import { useTranslate } from '@btst/stack/context';
 
 function UrlTab({
   folderId,
   onRegistered
 }) {
   const t = useTranslate();
-  const { can: canCreate } = useCan({
-    resource: "media:asset",
-    action: "create"
-  });
   const [url, setUrl] = useState("");
   const form = useRegisterAssetForm({
     folderId: folderId ?? void 0,
@@ -23,7 +19,6 @@ function UrlTab({
   const handleSubmit = async (e) => {
     e.preventDefault();
     e.stopPropagation();
-    if (!canCreate) return;
     form.clearErrors();
     const trimmed = url.trim();
     if (!trimmed) return;
@@ -32,7 +27,6 @@ function UrlTab({
       setUrl("");
     }
   };
-  if (!canCreate) return null;
   const urlError = form.fieldErrors.url;
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-3 pt-2", children: [
     /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t(

package/dist/packages/stack/src/plugins/media/client/components/pages/library-page.cjs

@@ -5,7 +5,9 @@ const jsxRuntime = require('react/jsx-runtime');
 const React = require('react');
 const context = require('@btst/stack/context');
 const components = require('@btst/stack/client/components');
+const constants = require('../../constants.cjs');
 const LucideIcons = require('lucide-react');
+const plugins_media_permissions = require('../../../../../../../../plugins/media/permissions.cjs');
 
 const LibraryPage = React.lazy(
   () => import('./library-page.internal.cjs').then((m) => ({ default: m.LibraryPage }))
@@ -18,12 +20,12 @@ function LibraryError({ error }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-96 items-center justify-center p-8 text-destructive", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: message }) });
 }
 function LibraryPageComponent() {
-  context.usePluginOverrides("media");
+  context.usePluginOverrides(constants.MEDIA_PLUGIN_ID);
   return /* @__PURE__ */ jsxRuntime.jsx(
     components.ComposedRoute,
     {
       path: "/media",
-      permission: { resource: "media:asset", action: "read" },
+      permission: plugins_media_permissions.mediaPermissions.library.read(),
       PageComponent: LibraryPage,
       ErrorComponent: LibraryError,
       LoadingComponent: LibraryLoading,