@muhgholy/next-drive 4.23.8 → 4.23.11

package/dist/client/index.js

@@ -5,6 +5,7 @@ import React3__default, { createContext, useContext, useState, useCallback, useR
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
+import * as ProgressPrimitive from '@radix-ui/react-progress';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import { X, ChevronRight, Check, Circle, Loader2, Folder, FolderPlus, Menu, RotateCcw, Trash2, Group, Search, ArrowUpDown, Calendar, ArrowDownAZ, ArrowUpAZ, ArrowDown01, ArrowUp01, LayoutGrid, List, RefreshCw, Upload, CheckCircle2, Cloud, AlertCircle, Pencil, FileText, HardDrive, Database, ChevronsUpDown, Plus, Settings2, Trash, FolderOpen, Clock } from 'lucide-react';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
@@ -12,7 +13,6 @@ import * as LabelPrimitive from '@radix-ui/react-label';
 import { useForm } from 'react-hook-form';
 import { useSensors, useSensor, PointerSensor, KeyboardSensor, DndContext, pointerWithin, closestCenter, useDroppable } from '@dnd-kit/core';
 import { sortableKeyboardCoordinates, arrayMove, SortableContext, rectSortingStrategy, useSortable } from '@dnd-kit/sortable';
-import * as ProgressPrimitive from '@radix-ui/react-progress';
 import { startOfWeek, subWeeks, isToday, isYesterday, isAfter } from 'date-fns';
 import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
 import { CSS } from '@dnd-kit/utilities';
@@ -296,7 +296,7 @@ var getChunkSize = (fileSize) => {
   if (fileSize < 1024 * 1024 * 1024) return 8 * 1024 * 1024;
   return 16 * 1024 * 1024;
 };
-var useUpload = (apiEndpoint, activeAccountId, withCredentials = false, onUploadComplete) => {
+var useUpload = (apiEndpoint, activeAccountId, withCredentials = false, onUploadComplete, unauthenticated = false) => {
   const [uploads, setUploads] = useState([]);
   const abortControllers = useRef(/* @__PURE__ */ new Map());
   const filesRef = useRef(/* @__PURE__ */ new Map());
@@ -380,6 +380,7 @@ var useUpload = (apiEndpoint, activeAccountId, withCredentials = false, onUpload
         formData.append("fileType", file.type);
         formData.append("folderId", folderId || "root");
         if (driveId) formData.append("driveId", driveId);
+        if (unauthenticated) formData.append("unauthenticated", "true");
         let attempts = 0;
         let success = false;
         while (!success && attempts < 3 && !controller.signal.aborted) {
@@ -539,6 +540,39 @@ function Button({
     }
   );
 }
+function Progress({
+  className,
+  value,
+  indicatorClassName,
+  indeterminate = false,
+  ...props
+}) {
+  const isIndeterminate = indeterminate || value === void 0;
+  return /* @__PURE__ */ jsx(
+    ProgressPrimitive.Root,
+    {
+      "data-slot": "progress",
+      className: cn(
+        "nd:bg-primary/20 nd:relative nd:h-2 nd:w-full nd:overflow-hidden nd:rounded-full",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        ProgressPrimitive.Indicator,
+        {
+          "data-slot": "progress-indicator",
+          className: cn(
+            "nd:bg-primary nd:h-full nd:flex-1 nd:transition-all",
+            isIndeterminate && "nd:w-1/3 nd:animate-[indeterminate_1.5s_ease-in-out_infinite]",
+            !isIndeterminate && "nd:w-full",
+            indicatorClassName
+          ),
+          style: isIndeterminate ? void 0 : { transform: `translateX(-${100 - (value || 0)}%)` }
+        }
+      )
+    }
+  );
+}
 function Dialog2({ ...props }) {
   return /* @__PURE__ */ jsx(SheetPrimitive.Root, { "data-slot": "dialog2", ...props });
 }
@@ -1362,39 +1396,6 @@ var DriveDndProvider = (props) => {
     }
   ) : children });
 };
-function Progress({
-  className,
-  value,
-  indicatorClassName,
-  indeterminate = false,
-  ...props
-}) {
-  const isIndeterminate = indeterminate || value === void 0;
-  return /* @__PURE__ */ jsx(
-    ProgressPrimitive.Root,
-    {
-      "data-slot": "progress",
-      className: cn(
-        "nd:bg-primary/20 nd:relative nd:h-2 nd:w-full nd:overflow-hidden nd:rounded-full",
-        className
-      ),
-      ...props,
-      children: /* @__PURE__ */ jsx(
-        ProgressPrimitive.Indicator,
-        {
-          "data-slot": "progress-indicator",
-          className: cn(
-            "nd:bg-primary nd:h-full nd:flex-1 nd:transition-all",
-            isIndeterminate && "nd:w-1/3 nd:animate-[indeterminate_1.5s_ease-in-out_infinite]",
-            !isIndeterminate && "nd:w-full",
-            indicatorClassName
-          ),
-          style: isIndeterminate ? void 0 : { transform: `translateX(-${100 - (value || 0)}%)` }
-        }
-      )
-    }
-  );
-}
 var ContextMenu = ContextMenuPrimitive.Root;
 var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
 var ContextMenuSubTrigger = React3.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
@@ -3100,11 +3101,46 @@ var DriveFileChooser = (props) => {
     className,
     disabled = false,
     error,
-    helperText
+    helperText,
+    allowUnauthenticated = false
   } = props;
-  const { items, selectedFileIds, setSelectedFileIds, createUrl, triggerFetch } = useDrive();
+  const { items, selectedFileIds, setSelectedFileIds, createUrl, triggerFetch, apiEndpoint, activeAccountId, withCredentials, callAPI } = useDrive();
   useStyleInjector();
   const [isOpen, setIsOpen] = useState(false);
+  const fileInputRef = useRef(null);
+  const valueRef = useRef(value);
+  valueRef.current = value;
+  const [authed, setAuthed] = useState(allowUnauthenticated ? null : true);
+  useEffect(() => {
+    if (!allowUnauthenticated) return;
+    callAPI("information").then((res) => setAuthed(res.status === 200 ? !!res.data?.authenticated : false));
+  }, [allowUnauthenticated, callAPI]);
+  const unauthenticatedMode = allowUnauthenticated && authed === false;
+  const handleUploaded = useCallback((item) => {
+    const isFile = item?.information?.type === "FILE";
+    const uploaded = {
+      id: item.id,
+      file: { name: item.name, mime: isFile ? item.information.mime : "", size: isFile ? item.information.sizeInBytes : 0 }
+    };
+    const current = valueRef.current;
+    if (multiple) {
+      const arr = Array.isArray(current) ? current : current ? [current] : [];
+      onChange([...arr, uploaded]);
+    } else {
+      onChange(uploaded);
+    }
+  }, [multiple, onChange]);
+  const { uploads, uploadFiles } = useUpload(apiEndpoint, activeAccountId, withCredentials, handleUploaded, unauthenticatedMode);
+  const openPicker = useCallback(() => {
+    if (unauthenticatedMode) fileInputRef.current?.click();
+    else setIsOpen(true);
+  }, [unauthenticatedMode]);
+  const handleFilePick = useCallback((e) => {
+    const picked = Array.from(e.target.files ?? []);
+    if (picked.length) uploadFiles(multiple ? picked : [picked[0]], null);
+    e.target.value = "";
+  }, [uploadFiles, multiple]);
+  const activeUploads = unauthenticatedMode ? uploads.filter((u) => ["queued", "uploading", "error"].includes(u.status)) : [];
   useEffect(() => {
     if (isOpen) {
       triggerFetch();
@@ -3138,8 +3174,8 @@ var DriveFileChooser = (props) => {
       {
         type: "button",
         variant: "outline",
-        onClick: () => setIsOpen(true),
-        disabled,
+        onClick: openPicker,
+        disabled: disabled || allowUnauthenticated && authed === null,
         className: cn(
           "nd:w-full nd:h-auto nd:justify-start nd:gap-3 nd:px-3 nd:py-2.5 nd:border-dashed",
           error && "nd:border-destructive"
@@ -3168,7 +3204,7 @@ var DriveFileChooser = (props) => {
             ] })
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "nd:flex nd:items-center nd:gap-1 nd:shrink-0", children: [
-            /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setIsOpen(true), disabled, children: "Change" }),
+            /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: openPicker, disabled, children: "Change" }),
             !disabled && /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "nd:size-8", onClick: () => handleRemove(displayFiles[0].id), children: /* @__PURE__ */ jsx(X, { className: "nd:size-4" }) })
           ] })
         ] }),
@@ -3181,7 +3217,7 @@ var DriveFileChooser = (props) => {
               " selected"
             ] }),
             /* @__PURE__ */ jsxs("div", { className: "nd:flex nd:items-center nd:gap-1", children: [
-              /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "nd:h-7 nd:text-xs", onClick: () => setIsOpen(true), disabled, children: "Add more" }),
+              /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "nd:h-7 nd:text-xs", onClick: openPicker, disabled, children: "Add more" }),
               !disabled && /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "nd:h-7 nd:text-xs nd:text-muted-foreground", onClick: () => onChange([]), children: "Clear" })
             ] })
           ] }),
@@ -3200,6 +3236,16 @@ var DriveFileChooser = (props) => {
       ] })
     ),
     error && helperText && /* @__PURE__ */ jsx("p", { className: "nd:text-xs nd:text-destructive nd:mt-1.5", children: helperText }),
+    unauthenticatedMode && /* @__PURE__ */ jsx("input", { ref: fileInputRef, type: "file", accept, multiple, className: "nd:hidden", onChange: handleFilePick }),
+    activeUploads.length > 0 && /* @__PURE__ */ jsx("div", { className: "nd:mt-2 nd:space-y-2", children: activeUploads.map((u) => /* @__PURE__ */ jsxs("div", { className: "nd:rounded-lg nd:border nd:px-3 nd:py-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "nd:flex nd:items-center nd:gap-2", children: [
+        u.status === "error" ? /* @__PURE__ */ jsx(X, { className: "nd:size-4 nd:text-destructive nd:shrink-0" }) : /* @__PURE__ */ jsx(Loader2, { className: "nd:size-4 nd:animate-spin nd:text-muted-foreground nd:shrink-0" }),
+        /* @__PURE__ */ jsx("span", { className: "nd:text-sm nd:truncate nd:flex-1", children: u.name }),
+        /* @__PURE__ */ jsx("span", { className: "nd:text-xs nd:text-muted-foreground nd:shrink-0", children: u.status === "error" ? "Failed" : `${Math.round(u.currentChunk / Math.max(1, u.totalChunks) * 100)}%` })
+      ] }),
+      u.status !== "error" && /* @__PURE__ */ jsx(Progress, { value: Math.round(u.currentChunk / Math.max(1, u.totalChunks) * 100), className: "nd:mt-1.5" }),
+      u.status === "error" && u.error && /* @__PURE__ */ jsx("p", { className: "nd:text-xs nd:text-destructive nd:mt-1", children: u.error })
+    ] }, u.id)) }),
     /* @__PURE__ */ jsx(Dialog2, { open: isOpen, onOpenChange: setIsOpen, children: /* @__PURE__ */ jsxs(Dialog2Content, { showCloseButton: false, className: "nd-drive-root", children: [
       /* @__PURE__ */ jsxs(Dialog2Header, { className: "nd:gap-2", children: [
         /* @__PURE__ */ jsx(MobileSidebarSheet, {}),