@jmruthers/pace-core 0.5.60 → 0.5.62

package/dist/components.js

@@ -52,9 +52,8 @@ import {
   uploadFile,
   useFileUpload,
   usePublicPageContext as usePublicPageContext2,
-  useStorage,
-  useToast
-} from "./chunk-SFMRBGGK.js";
+  useStorage
+} from "./chunk-2LPYEFXI.js";
 import {
   Alert,
   AlertDescription,
@@ -77,22 +76,23 @@ import {
   SelectSeparator,
   SelectTrigger,
   SelectValue
-} from "./chunk-XDXG6QVH.js";
+} from "./chunk-S66AJVI2.js";
 import {
   useRBAC
-} from "./chunk-ESXTFEE6.js";
+} from "./chunk-C7GUF747.js";
 import "./chunk-NHR52QAQ.js";
 import "./chunk-B2WTCLCV.js";
-import "./chunk-5MLDIGHB.js";
-import "./chunk-CGSYCF2W.js";
+import "./chunk-FVDOEGGG.js";
+import "./chunk-VTJ5HCZB.js";
 import {
   DefaultPublicErrorFallback,
   PublicErrorBoundary,
   PublicPageProvider,
   useErrorBoundary,
   useIsPublicPage,
-  usePublicPageContext
-} from "./chunk-ITPVFKDH.js";
+  usePublicPageContext,
+  useToast
+} from "./chunk-T6HVDA24.js";
 import "./chunk-YNUBMSMV.js";
 import {
   Button,
@@ -117,8 +117,11 @@ import {
   init_Tooltip2 as init_Tooltip,
   init_UnifiedAuthProvider,
   useUnifiedAuth
-} from "./chunk-E4FPK232.js";
-import "./chunk-STT7INZR.js";
+} from "./chunk-T2MQY57J.js";
+import {
+  FileCategory,
+  init_file_reference
+} from "./chunk-ULBI5JGB.js";
 import {
   LoadingSpinner
 } from "./chunk-CDQ3PX7L.js";
@@ -699,6 +702,67 @@ function useFileReference(supabase) {
     clearError
   };
 }
+function useFileReferenceForRecord(supabase, table_name, record_id, organisation_id) {
+  const {
+    isLoading,
+    error,
+    getFileUrl,
+    getFileReference,
+    updateFileReference,
+    deleteFileReference,
+    listFileReferences,
+    getFileCount,
+    clearError
+  } = useFileReference(supabase);
+  const [fileUrl, setFileUrl] = useState2(null);
+  const [fileReference, setFileReference] = useState2(null);
+  const [fileReferences, setFileReferences] = useState2([]);
+  const [fileCount, setFileCount] = useState2(0);
+  const loadFileReference = useCallback(async () => {
+    const reference = await getFileReference(table_name, record_id, organisation_id);
+    setFileReference(reference);
+    return reference;
+  }, [getFileReference, table_name, record_id, organisation_id]);
+  const loadFileUrl = useCallback(async () => {
+    const url = await getFileUrl(table_name, record_id, organisation_id);
+    setFileUrl(url);
+    return url;
+  }, [getFileUrl, table_name, record_id, organisation_id]);
+  const loadFileReferences = useCallback(async () => {
+    const references = await listFileReferences(table_name, record_id, organisation_id);
+    setFileReferences(references);
+    return references;
+  }, [listFileReferences, table_name, record_id, organisation_id]);
+  const loadFileCount = useCallback(async () => {
+    const count = await getFileCount(table_name, record_id, organisation_id);
+    setFileCount(count);
+    return count;
+  }, [getFileCount, table_name, record_id, organisation_id]);
+  const deleteFile2 = useCallback(async (delete_file) => {
+    const success = await deleteFileReference(table_name, record_id, organisation_id, delete_file);
+    if (success) {
+      setFileReference(null);
+      setFileUrl(null);
+      await loadFileCount();
+    }
+    return success;
+  }, [deleteFileReference, table_name, record_id, organisation_id, loadFileCount]);
+  return {
+    isLoading,
+    error,
+    fileUrl,
+    fileReference,
+    fileReferences,
+    fileCount,
+    loadFileReference,
+    loadFileUrl,
+    loadFileReferences,
+    loadFileCount,
+    deleteFile: deleteFile2,
+    updateFileReference,
+    clearError
+  };
+}
 
 // src/components/FileUpload.tsx
 import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
@@ -824,6 +888,185 @@ function FileUpload({
     }
   );
 }
+
+// src/components/FileDisplay.tsx
+import { useState as useState4, useEffect as useEffect2 } from "react";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function FileDisplay({
+  supabase,
+  table_name,
+  record_id,
+  organisation_id,
+  category,
+  showUpload = false,
+  showDelete = false,
+  className = "",
+  children
+}) {
+  const {
+    isLoading,
+    error,
+    fileUrl,
+    fileReference,
+    fileReferences,
+    fileCount,
+    loadFileReference,
+    loadFileUrl,
+    loadFileReferences,
+    loadFileCount,
+    deleteFile: deleteFile2,
+    clearError
+  } = useFileReferenceForRecord(supabase, table_name, record_id, organisation_id);
+  const [imageError, setImageError] = useState4(false);
+  useEffect2(() => {
+    loadFileCount();
+    if (category) {
+      loadFileReference();
+    } else {
+      loadFileReferences();
+    }
+  }, [loadFileCount, loadFileReference, loadFileReferences, category]);
+  useEffect2(() => {
+    if (fileReference) {
+      loadFileUrl();
+    }
+  }, [fileReference, loadFileUrl]);
+  const handleDelete = async () => {
+    if (window.confirm("Are you sure you want to delete this file?")) {
+      const success = await deleteFile2(true);
+      if (success) {
+        setImageError(false);
+      }
+    }
+  };
+  const handleImageError = () => {
+    setImageError(true);
+  };
+  const getFileIcon = (fileType) => {
+    if (fileType.startsWith("image/")) return "\u{1F5BC}\uFE0F";
+    if (fileType.startsWith("video/")) return "\u{1F3A5}";
+    if (fileType.startsWith("audio/")) return "\u{1F3B5}";
+    if (fileType.includes("pdf")) return "\u{1F4C4}";
+    if (fileType.includes("word")) return "\u{1F4DD}";
+    if (fileType.includes("excel") || fileType.includes("spreadsheet")) return "\u{1F4CA}";
+    if (fileType.includes("powerpoint") || fileType.includes("presentation")) return "\u{1F4CA}";
+    return "\u{1F4C1}";
+  };
+  const formatFileSize = (bytes) => {
+    if (bytes === 0) return "0 Bytes";
+    const k = 1024;
+    const sizes = ["Bytes", "KB", "MB", "GB"];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsx7("div", { className: `flex items-center justify-center p-4 ${className}`, children: /* @__PURE__ */ jsx7("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-main-500" }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs6("div", { className: `p-4 bg-acc-50 border border-acc-200 rounded-lg ${className}`, children: [
+      /* @__PURE__ */ jsxs6("div", { className: "text-acc-600", children: [
+        "Error loading file: ",
+        error
+      ] }),
+      /* @__PURE__ */ jsx7(
+        "button",
+        {
+          onClick: clearError,
+          className: "mt-2 text-sm text-acc-700 hover:text-acc-800 underline",
+          children: "Try again"
+        }
+      )
+    ] });
+  }
+  if (fileCount === 0) {
+    return /* @__PURE__ */ jsxs6("div", { className: `text-sec-500 text-center p-4 ${className}`, children: [
+      "No files found",
+      children
+    ] });
+  }
+  if (category && fileReference) {
+    const isImage = fileReference.file_metadata.fileType?.startsWith("image/");
+    return /* @__PURE__ */ jsxs6("div", { className: `space-y-2 ${className}`, children: [
+      isImage && fileUrl && !imageError ? /* @__PURE__ */ jsxs6("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx7(
+          "img",
+          {
+            src: fileUrl,
+            alt: fileReference.file_metadata.fileName || "File",
+            className: "max-w-full h-auto rounded-lg border border-sec-200",
+            onError: handleImageError
+          }
+        ),
+        showDelete && /* @__PURE__ */ jsx7(
+          "button",
+          {
+            onClick: handleDelete,
+            className: "absolute top-2 right-2 bg-acc-500 text-white rounded-full w-6 h-6 flex items-center justify-center text-sm hover:bg-acc-600",
+            title: "Delete file",
+            children: "\xD7"
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-3 p-3 bg-sec-50 rounded-lg border border-sec-200", children: [
+        /* @__PURE__ */ jsx7("span", { className: "text-2xl", children: getFileIcon(fileReference.file_metadata.fileType || "") }),
+        /* @__PURE__ */ jsxs6("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsx7("div", { className: "font-medium text-sec-900 truncate", children: fileReference.file_metadata.fileName || "Unknown file" }),
+          /* @__PURE__ */ jsxs6("div", { className: "text-sm text-sec-500", children: [
+            fileReference.file_metadata.fileSize && formatFileSize(fileReference.file_metadata.fileSize),
+            fileReference.file_metadata.fileType && ` \u2022 ${fileReference.file_metadata.fileType}`
+          ] })
+        ] }),
+        showDelete && /* @__PURE__ */ jsx7(
+          "button",
+          {
+            onClick: handleDelete,
+            className: "text-acc-500 hover:text-acc-700 p-1",
+            title: "Delete file",
+            children: "\xD7"
+          }
+        )
+      ] }),
+      children
+    ] });
+  }
+  return /* @__PURE__ */ jsxs6("div", { className: `space-y-2 ${className}`, children: [
+    fileReferences.map((fileRef) => {
+      const isImage = fileRef.file_metadata.fileType?.startsWith("image/");
+      const fileUrl2 = fileRef.is_public ? `https://your-supabase-url.supabase.co/storage/v1/object/public/files/${fileRef.file_path}` : null;
+      return /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-3 p-3 bg-sec-50 rounded-lg border border-sec-200", children: [
+        isImage && fileUrl2 ? /* @__PURE__ */ jsx7(
+          "img",
+          {
+            src: fileUrl2,
+            alt: fileRef.file_metadata.fileName || "File",
+            className: "w-12 h-12 object-cover rounded",
+            onError: handleImageError
+          }
+        ) : /* @__PURE__ */ jsx7("span", { className: "text-2xl", children: getFileIcon(fileRef.file_metadata.fileType || "") }),
+        /* @__PURE__ */ jsxs6("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsx7("div", { className: "font-medium text-sec-900 truncate", children: fileRef.file_metadata.fileName || "Unknown file" }),
+          /* @__PURE__ */ jsxs6("div", { className: "text-sm text-sec-500", children: [
+            fileRef.file_metadata.fileSize && formatFileSize(fileRef.file_metadata.fileSize),
+            fileRef.file_metadata.fileType && ` \u2022 ${fileRef.file_metadata.fileType}`,
+            fileRef.file_metadata.category && ` \u2022 ${fileRef.file_metadata.category}`
+          ] })
+        ] }),
+        showDelete && /* @__PURE__ */ jsx7(
+          "button",
+          {
+            onClick: () => deleteFile2(true),
+            className: "text-acc-500 hover:text-acc-700 p-1",
+            title: "Delete file",
+            children: "\xD7"
+          }
+        )
+      ] }, fileRef.id);
+    }),
+    children
+  ] });
+}
+
+// src/components/index.ts
+init_file_reference();
 export {
   Alert,
   AlertDescription,
@@ -858,6 +1101,8 @@ export {
   EventLogoCompact,
   EventLogoLarge,
   EventSelector,
+  FileCategory,
+  FileDisplay,
   FileUpload,
   Footer,
   Form,
@@ -922,6 +1167,8 @@ export {
   UnifiedAuthProvider,
   UserMenu,
   useErrorBoundary,
+  useFileReference,
+  useFileReferenceForRecord,
   useFileUpload,
   useIsPublicPage,
   usePublicPageContext2 as usePublicPageContext,