dtable-ui-component 6.0.107-opl.2 → 6.0.107-opl.4

package/lib/ImagePreviewerLightbox/index.js

@@ -27,35 +27,44 @@ function ImagePreviewerLightbox(props) {
     onRotateImage
   } = props;
   const imageSrcList = imageItems.map(src => {
+    let name = '';
+    try {
+      name = src ? decodeURIComponent(src.slice(src.lastIndexOf('/') + 1)) : '';
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.log(error);
+    }
     if (server && dtableUuid && (0, _url.isCustomAssetUrl)(src)) {
       const assetUuid = src.slice(src.lastIndexOf('/') + 1, src.lastIndexOf('.'));
-      return server + '/dtable/' + dtableUuid + '/custom-asset/' + assetUuid;
+      return {
+        name,
+        thumbnail: server + '/dtable/' + dtableUuid + '/custom-asset/' + assetUuid
+      };
     }
     if (server && dtableUuid && workspaceID && (0, _url.isDigitalSignsUrl)(src)) {
-      return (0, _url.generateCurrentBaseImageUrl)({
-        server,
-        workspaceID,
-        dtableUuid,
-        partUrl: src
-      });
+      return {
+        name,
+        thumbnail: (0, _url.generateCurrentBaseImageUrl)({
+          server,
+          workspaceID,
+          dtableUuid,
+          partUrl: src
+        })
+      };
     }
-    return src;
+    return {
+      name: name || '',
+      thumbnail: src
+    };
   });
   const imagesLength = imageSrcList.length;
   const [currentImageIndex, setCurrentImageIndex] = _react.default.useState(imageIndex || 0);
-  const URL = imageSrcList[currentImageIndex];
+  const imageItem = imageSrcList[currentImageIndex];
+  const URL = imageItem ? imageItem.thumbnail : '';
+  const imageName = imageItem ? imageItem.name : '';
   _react.default.useEffect(() => {
     setCurrentImageIndex(imageIndex);
   }, [imageIndex]);
-
-  // Handle URL has special symbol %$
-  let imageName = '';
-  try {
-    imageName = URL ? decodeURI(URL.slice(URL.lastIndexOf('/') + 1)) : '';
-  } catch (error) {
-    // eslint-disable-next-line no-console
-    console.log(error);
-  }
   const canRotateImage = onRotateImage && !readOnly && !['gif', 'heic', 'heif'].includes((0, _url.getFileSuffix)(URL)) && (0, _url.isInternalImg)(URL, server);
   let mainSrc = URL;
   if ((0, _url.needUseThumbnailImage)(URL)) {
@@ -70,12 +79,13 @@ function ImagePreviewerLightbox(props) {
     className: "d-flex",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: "text-truncate",
-      children: imageName
+      children: imageName || ''
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
       className: "flex-shrink-0 pl-1",
       children: ["(", currentImageIndex + 1, "/", imagesLength, ")"]
     })]
   });
+  console.log('imageSrcList', imageSrcList);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactImageLightbox.default, {
     imageItems: imageSrcList,
     currentIndex: currentImageIndex,
@@ -83,8 +93,8 @@ function ImagePreviewerLightbox(props) {
     wrapperClassName: (0, _classnames.default)('dtable-ui-component', className),
     imageTitle: imageTitleDOM,
     mainSrc: mainSrc,
-    nextSrc: imageSrcList[(currentImageIndex + 1) % imagesLength],
-    prevSrc: imageSrcList[(currentImageIndex + imagesLength - 1) % imagesLength],
+    nextSrc: imageSrcList[(currentImageIndex + 1) % imagesLength] ? imageSrcList[(currentImageIndex + 1) % imagesLength].thumbnail : '',
+    prevSrc: imageSrcList[(currentImageIndex + imagesLength - 1) % imagesLength] ? imageSrcList[(currentImageIndex + imagesLength - 1) % imagesLength].thumbnail : '',
     imagePadding: 70,
     viewOriginalImageLabel: (0, _lang.getLocale)('View_original_image'),
     enableRotate: canRotateImage,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.107opl.2",
+  "version": "6.0.107opl.4",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "^5.0.4",