@flozy/editor 9.9.2 → 9.9.4

package/dist/Editor/Elements/Search/SearchAttachment.js

@@ -1,5 +1,10 @@
-import React from "react";
-import { Box, Card, CardMedia, CardContent, Typography } from "@mui/material";
+import React, { useEffect, useState } from "react";
+import Box from "@mui/material/Box";
+import Card from "@mui/material/Card";
+import CardMedia from "@mui/material/CardMedia";
+import CardContent from "@mui/material/CardContent";
+import Typography from "@mui/material/Typography";
+import Skeleton from "@mui/material/Skeleton";
 import Icon from "../../common/Icon";
 import { useEditorContext } from "../../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -15,13 +20,26 @@ const SearchAttachment = props => {
     metadata
   } = customProps;
   const {
-    title,
-    type
+    type,
+    id
   } = element;
   const {
     theme
   } = useEditorContext();
+  const [title, setTitle] = useState("");
+  const [showSkeleton, setShowSkeleton] = useState(false);
   const label = Boolean(title?.trim()) ? title : 'Untitled';
+  useEffect(() => {
+    const fetchTitle = async id => {
+      setShowSkeleton(true);
+      const title = await customProps?.services('getDocTitle', id);
+      setTitle(title?.data);
+      setShowSkeleton(false);
+    };
+    if (id) {
+      fetchTitle(id);
+    }
+  }, []);
   const handleClick = () => {
     if (metadata && metadata?.actionHandler) {
       metadata?.actionHandler(type, element);
@@ -38,15 +56,15 @@ const SearchAttachment = props => {
     children: /*#__PURE__*/_jsxs(Card, {
       sx: {
         display: "flex",
-        justifyContent: "flex-start",
-        alignItems: "flex-end",
+        justifyContent: showSkeleton ? "center" : "flex-start",
+        alignItems: showSkeleton ? "center" : "flex-end",
         width: "fit-content",
         maxWidth: '250px',
         padding: "0px 10px",
         boxShadow: "none",
         border: `1px solid ${theme?.palette?.primary?.slashBrainBorder} !important`,
         borderRadius: "7px !important",
-        background: `${theme?.palette?.containers?.slashBrainCardBg} !important`,
+        background: showSkeleton ? `${theme?.palette?.editor?.menuOptionHoverBackground} !important` : `${theme?.palette?.containers?.slashBrainCardBg} !important`,
         cursor: 'pointer',
         margin: '4px 0px',
         lineHeight: 1.43,
@@ -76,7 +94,12 @@ const SearchAttachment = props => {
             width: "unset !important"
           }
         },
-        children: /*#__PURE__*/_jsx(Icon, {
+        children: showSkeleton ? /*#__PURE__*/_jsx(Skeleton, {
+          variant: "circular",
+          width: 14,
+          height: 14,
+          animation: "wave"
+        }) : /*#__PURE__*/_jsx(Icon, {
           icon: "docsIcon"
         })
       }), /*#__PURE__*/_jsx(CardContent, {
@@ -94,7 +117,15 @@ const SearchAttachment = props => {
             width: "unset !important"
           }
         },
-        children: /*#__PURE__*/_jsxs(Typography, {
+        children: showSkeleton ? /*#__PURE__*/_jsx(Skeleton, {
+          variant: "text",
+          width: 140,
+          height: 20,
+          animation: "wave",
+          sx: {
+            borderRadius: "4px"
+          }
+        }) : /*#__PURE__*/_jsxs(Typography, {
           sx: {
             fontWeight: "500",
             background: theme?.palette?.text?.slashBrainText,

package/dist/Editor/Elements/Search/SearchButton.js

@@ -30,6 +30,7 @@ const SearchButton = /*#__PURE__*/forwardRef((props, ref) => {
   const [skip, setSkip] = useState(0);
   const [search, setSearch] = useState("");
   const [isLoading, setIsLoading] = useState(false);
+  const [total, setTotal] = useState(0);
   const [debouncedSearch] = useDebounce(search, 300);
   const limit = 20;
   const observer = useRef();
@@ -63,24 +64,24 @@ const SearchButton = /*#__PURE__*/forwardRef((props, ref) => {
     }
   };
   useEffect(() => {
-    getDocs({
-      debouncedSearch,
-      skip,
-      limit,
-      current_doc_id: currentId
-    });
+    getDocs();
   }, [skip, debouncedSearch]);
   const getDocs = async () => {
+    if (isLoading) return;
+    if (total > 0 && mapData?.length >= total) return;
     setIsLoading(true);
     try {
       if (otherProps?.services) {
         const result = await otherProps?.services("getDocs", {
           skip,
           limit,
-          search,
+          search: debouncedSearch,
           current_doc_id: currentId
         });
-        setMapData(prev => skip === 0 ? result.data : [...prev, ...result.data]);
+        const docs = result?.data?.docs || [];
+        const totalCount = result?.data?.total || 0;
+        setMapData(prev => skip === 0 ? docs : [...prev, ...docs]);
+        setTotal(totalCount);
       }
     } catch (error) {
       console.error("Error fetching documents:", error);

package/dist/Editor/Elements/Search/SearchList.js

@@ -259,7 +259,7 @@ const SearchAndDocList = ({
         xs: 12,
         children: /*#__PURE__*/_jsx(Typography, {
           sx: {
-            display: mapData?.length === 0 ? 'flex' : 'none',
+            display: mapData?.length === 0 && !isLoading ? 'flex' : 'none',
             alignItems: "center",
             justifyContent: "center",
             color: theme?.palette?.text?.secondary,
@@ -269,15 +269,17 @@ const SearchAndDocList = ({
           },
           children: "No docs"
         })
-      }), isLoading && /*#__PURE__*/_jsx(Grid, {
+      }), /*#__PURE__*/_jsx(Grid, {
         item: true,
+        xs: 12,
         sx: {
-          display: "flex",
+          display: isLoading ? 'flex' : 'none',
+          alignItems: "center",
           justifyContent: "center",
-          alignItems: 'center',
-          minHeight: '400px',
-          padding: '0px 16px 8px',
-          position: 'absolute'
+          color: theme?.palette?.text?.secondary,
+          fontSize: '12px',
+          padding: '20px',
+          fontWeight: 700
         },
         children: /*#__PURE__*/_jsx(CircularProgress, {})
       })]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flozy/editor",
-  "version": "9.9.2",
+  "version": "9.9.4",
   "description": "An Editor for flozy app brain",
   "files": [
     "dist"