@bigbinary/neeto-image-uploader-frontend 3.0.2 → 3.0.4

package/dist/{index-CSoe203Z.js → index-DxJCT8T_.js}

@@ -8,9 +8,9 @@ import Tab from '@bigbinary/neetoui/Tab';
 import Spinner from '@bigbinary/neetoui/Spinner';
 import Toastr from '@bigbinary/neetoui/Toastr';
 import Typography from '@bigbinary/neetoui/Typography';
-import { mergeRight, identity, prop, equals } from 'ramda';
+import { mergeRight, identity, isEmpty, prop, equals } from 'ramda';
 import { useTranslation, Trans } from 'react-i18next';
-import { i as isNilOrEmpty, c as DEFAULT_CROP_CONFIG, g as getAspectRatio, d as getPixels, e as getHeightFromAspectRatio, f as getWidthFromAspectRatio, h as getInitialCropSize, j as getPercentage, k as isItemsCenter, l as getWrapperRefStyles, m as getCloudFlareCroppedURL, n as getImageKitCroppedURL, o as getCropValues, p as IMAGES_PER_PAGE, q as INFINITE_SCROLLER_SIZES, r as INFINITE_SCROLLER_STYLE, T as TABS, A as ASSETS_DESTROY_URL, s as ASSETS_FETCH_URL, U as UNSPLASH_DEFAULT_NAME, t as UNSPLASH_DEFAULT_REQUEST_CONFIG, D as DEFAULT_UPLOAD_CONFIG, u as useUploadDropzone, v as UNSPLASH_URL, b as ImageDirectUpload } from './utils-DIM-cAUF.js';
+import { i as isNilOrEmpty, c as DEFAULT_CROP_CONFIG, g as getAspectRatio, d as getPixels, e as getHeightFromAspectRatio, f as getWidthFromAspectRatio, h as getInitialCropSize, j as getPercentage, k as isItemsCenter, l as getWrapperRefStyles, m as getCloudFlareCroppedURL, n as getImageKitCroppedURL, o as getCropValues, p as IMAGES_PER_PAGE, q as INFINITE_SCROLLER_SIZES, r as INFINITE_SCROLLER_STYLE, T as TABS, A as ASSETS_DESTROY_URL, s as ASSETS_FETCH_URL, U as UNSPLASH_DEFAULT_NAME, t as UNSPLASH_DEFAULT_REQUEST_CONFIG, D as DEFAULT_UPLOAD_CONFIG, u as useUploadDropzone, v as UNSPLASH_URL, b as ImageDirectUpload } from './utils-BvsL7SjN.js';
 import { u as useImageUploader, a as useCreateBlob, i as isGif, g as generateASCIIFileName } from './useImageUploader-Dgah80e0.js';
 import { b as IMAGE_UPLOADER_BASE_URL, I as IS_DEVELOPMENT_OR_HEROKU_ENV, C as CLOUD_FLARE } from './imagekit.esm-Bhjn2yWQ.js';
 import classnames from 'classnames';
@@ -24,6 +24,7 @@ import Input from '@bigbinary/neetoui/Input';
 import Switch from '@bigbinary/neetoui/Switch';
 import Label from '@bigbinary/neetoui/Label';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import NoData from '@bigbinary/neetoui/NoData';
 import { Q as QUERY_KEYS, A as ASSETS_STALE_TIME, U as UNSPLASH_STALE_TIME } from './query-DMtOS6FM.js';
 import MenuHorizontal from '@bigbinary/neeto-icons/MenuHorizontal';
 import { VIEW_ROLES_PERMISSION } from '@bigbinary/neeto-team-members-frontend/constants';
@@ -1876,7 +1877,7 @@ var InfiniteScroller = function InfiniteScroller(_ref) {
     children: /*#__PURE__*/jsx(Spinner, {})
   });
   return /*#__PURE__*/jsxs("div", {
-    className: "niu-unsplash-container me-2 max-w-full overflow-x-hidden overflow-y-scroll",
+    className: "niu-unsplash-container grow max-w-full overflow-x-hidden overflow-y-scroll",
     children: [/*#__PURE__*/jsx(_default, {
       hasMore: hasMore,
       loadMore: loadMore,
@@ -1985,18 +1986,28 @@ var Images = function Images(_ref) {
     isLoading = _useFetchAssets.isLoading,
     isError = _useFetchAssets.isError;
   if (isError) {
-    return /*#__PURE__*/jsx(Typography, {
-      className: "mt-9 flex justify-center",
-      style: "body2",
-      children: t("neetoImageUploader.unsplash.errorMessage")
+    return /*#__PURE__*/jsx("div", {
+      className: "grow flex justify-center items-center",
+      children: /*#__PURE__*/jsx(Typography, {
+        style: "body2",
+        children: t("neetoImageUploader.unsplash.errorMessage")
+      })
     });
   }
   if (isLoading) {
     return /*#__PURE__*/jsx("div", {
-      className: "flex justify-around",
+      className: "grow flex justify-center items-center",
       children: /*#__PURE__*/jsx(Spinner, {})
     });
   }
+  if (isEmpty(results)) {
+    return /*#__PURE__*/jsx("div", {
+      className: "grow flex justify-center items-center",
+      children: /*#__PURE__*/jsx(NoData, {
+        title: t("neetoImageUploader.common.noImagesToShow")
+      })
+    });
+  }
   return /*#__PURE__*/createElement(InfiniteScroller, {
     setSelectedImage: setSelectedImage,
     hasMore: hasNextPage,
@@ -2119,18 +2130,28 @@ var UnsplashLibrary = function UnsplashLibrary(_ref) {
     isError = _useFetchUnsplashImag.isError,
     isLoading = _useFetchUnsplashImag.isLoading;
   if (isError) {
-    return /*#__PURE__*/jsx(Typography, {
-      className: "mt-9 flex justify-center",
-      style: "body2",
-      children: t("neetoImageUploader.unsplash.errorMessage")
+    return /*#__PURE__*/jsx("div", {
+      className: "grow flex justify-center items-center",
+      children: /*#__PURE__*/jsx(Typography, {
+        style: "body2",
+        children: t("neetoImageUploader.unsplash.errorMessage")
+      })
     });
   }
   if (isLoading) {
     return /*#__PURE__*/jsx("div", {
-      className: "flex justify-around",
+      className: "grow flex justify-center items-center",
       children: /*#__PURE__*/jsx(Spinner, {})
     });
   }
+  if (isEmpty(results)) {
+    return /*#__PURE__*/jsx("div", {
+      className: "grow flex justify-center items-center",
+      children: /*#__PURE__*/jsx(NoData, {
+        title: t("neetoImageUploader.common.noImagesToShow")
+      })
+    });
+  }
   return /*#__PURE__*/createElement(InfiniteScroller, {
     debouncedQuery: debouncedQuery,
     handleUnsplashImageSelect: handleUnsplashImageSelect,
@@ -2159,18 +2180,20 @@ var ImageLibrary = function ImageLibrary(_ref) {
     setQuery("");
   }, [tab]);
   return /*#__PURE__*/jsxs("div", {
-    className: "w-full px-6 pb-2 pt-1",
-    children: [/*#__PURE__*/jsx(Input, {
-      autoFocus: true,
-      className: "mb-4",
-      "data-testid": "niu-unsplash-image-picker-search-input",
-      name: "text",
-      placeholder: inputPlaceHolder,
-      value: query,
-      onChange: function onChange(_ref2) {
-        var value = _ref2.target.value;
-        return setQuery(value);
-      }
+    className: "w-full px-6 py-4 grow flex flex-col",
+    children: [/*#__PURE__*/jsx("div", {
+      className: "mb-4 shrink-0",
+      children: /*#__PURE__*/jsx(Input, {
+        autoFocus: true,
+        "data-testid": "niu-unsplash-image-picker-search-input",
+        name: "text",
+        placeholder: inputPlaceHolder,
+        value: query,
+        onChange: function onChange(_ref2) {
+          var value = _ref2.target.value;
+          return setQuery(value);
+        }
+      })
     }), tab === TABS[1].key ? /*#__PURE__*/jsx(Images, {
       debouncedQuery: debouncedQuery,
       query: query,
@@ -2295,7 +2318,7 @@ var Modal = function Modal(_ref) {
   var renderContent = function renderContent() {
     if (activeTab === "upload") {
       return /*#__PURE__*/jsx("div", {
-        className: "grow px-6 pb-6",
+        className: "grow px-6 pb-6 pt-4",
         children: /*#__PURE__*/jsx("div", {
           className: "h-full w-full overflow-y-auto",
           children: /*#__PURE__*/jsx(ImageDirectUpload, {
@@ -2348,7 +2371,7 @@ var Modal = function Modal(_ref) {
           children: t("neetoImageUploader.common.imageLibrary")
         })
       }), /*#__PURE__*/jsx("div", {
-        className: "flex gap-2 px-6 py-2",
+        className: "flex gap-2 px-6",
         children: /*#__PURE__*/jsx(Tab, {
           size: "small",
           children: TABS.map(function (tab) {
@@ -2365,6 +2388,7 @@ var Modal = function Modal(_ref) {
       }), renderContent(), equals(activeTab, TABS[2].key) && /*#__PURE__*/jsx(NeetoUIModal.Footer, {
         className: "flex items-center justify-center gap-2",
         children: /*#__PURE__*/jsx(Typography, {
+          lineHeight: "none",
           style: "body2",
           children: /*#__PURE__*/jsx(Trans, {
             i18nKey: "neetoImageUploader.unsplash.poweredByUnsplash",
@@ -2383,4 +2407,4 @@ var Modal = function Modal(_ref) {
 };
 
 export { Modal as M, constructCloudflareImageURL as c };
-//# sourceMappingURL=index-CSoe203Z.js.map
+//# sourceMappingURL=index-DxJCT8T_.js.map