@nyris/nyris-webapp 0.3.31 → 0.3.33

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nyris/nyris-webapp",
-  "version": "0.3.31",
+  "version": "0.3.33",
   "homepage": "./",
   "dependencies": {
     "@algolia/autocomplete-js": "^1.7.1",
@@ -12,8 +12,8 @@
     "@material-ui/data-grid": "^4.0.0-alpha.37",
     "@material-ui/icons": "^4.4.1",
     "@material-ui/lab": "^4.0.0-alpha.60",
-    "@nyris/nyris-api": "^0.3.31",
-    "@nyris/nyris-react-components": "^0.3.31",
+    "@nyris/nyris-api": "^0.3.33",
+    "@nyris/nyris-react-components": "^0.3.33",
     "@reduxjs/toolkit": "^1.6.1",
     "@splidejs/react-splide": "^0.7.12",
     "@types/blueimp-load-image": "^2.23.4",
@@ -40,7 +40,7 @@
     "qs": "^6.10.3",
     "react": "^17.0.0",
     "react-dom": "^16.13.1",
-    "react-dropzone": "^10.1.8",
+    "react-dropzone": "^14.2.3",
     "react-hook-form": "^7.27.1",
     "react-hot-toast": "^2.4.0",
     "react-i18next": "^12.2.0",

package/src/components/DetailItem.tsx

@@ -114,7 +114,7 @@ function DetailItem(props: Props) {
               style={{ width: '300px', height: '300px', padding: '8px' }}
             />
           )}
-          {!isMobile && dataImageCarousel.length > 0 && (
+          {dataImageCarousel.length > 0 && (
             <Button
               className="icon-style"
               onClick={() => {
@@ -314,36 +314,42 @@ function DetailItem(props: Props) {
               style={{ color: '#2B2C46', marginTop: 12 }}
               gridGap={20}
             >
-              <Box
-                style={{
-                  backgroundColor: `${settings.theme?.secondaryColor}26`,
-                  padding: '5px 10px',
-                  borderRadius: 4,
-                  width: '100%',
-                }}
-              >
-                <div style={{ fontSize: 15, fontWeight: 500 }}>
-                  {dataItem[settings.field.warehouseNumber]}
-                </div>
-                <div style={{ fontSize: 17, fontWeight: 700 }}>
-                  {dataItem[settings.field.warehouseNumberValue] || 'N/A'}
-                </div>
-              </Box>
-              <Box
-                style={{
-                  backgroundColor: `${settings.theme?.secondaryColor}26`,
-                  padding: '5px 10px',
-                  borderRadius: 4,
-                  width: '100%',
-                }}
-              >
-                <div style={{ fontSize: 15, fontWeight: 500 }}>
-                  {dataItem[settings.field.warehouseShelfNumber]}
-                </div>
-                <div style={{ fontSize: 17, fontWeight: 700 }}>
-                  {dataItem[settings.field.warehouseShelfNumberValue] || 'N/A'}
-                </div>
-              </Box>
+              {settings.field.warehouseNumber && (
+                <Box
+                  style={{
+                    backgroundColor: `${settings.theme?.secondaryColor}26`,
+                    padding: '5px 10px',
+                    borderRadius: 4,
+                    width: '100%',
+                  }}
+                >
+                  <div style={{ fontSize: 15, fontWeight: 500 }}>
+                    {dataItem[settings.field.warehouseNumber]}
+                  </div>
+                  <div style={{ fontSize: 17, fontWeight: 700 }}>
+                    {dataItem[settings.field.warehouseNumberValue] || 'N/A'}
+                  </div>
+                </Box>
+              )}
+
+              {settings.field.warehouseShelfNumber && (
+                <Box
+                  style={{
+                    backgroundColor: `${settings.theme?.secondaryColor}26`,
+                    padding: '5px 10px',
+                    borderRadius: 4,
+                    width: '100%',
+                  }}
+                >
+                  <div style={{ fontSize: 15, fontWeight: 500 }}>
+                    {dataItem[settings.field.warehouseShelfNumber]}
+                  </div>
+                  <div style={{ fontSize: 17, fontWeight: 700 }}>
+                    {dataItem[settings.field.warehouseShelfNumberValue] ||
+                      'N/A'}
+                  </div>
+                </Box>
+              )}
             </Box>
           )}
 

package/src/components/ProductList/index.tsx

@@ -1,6 +1,6 @@
 import { Box } from '@material-ui/core';
 import ItemResult from 'components/results/ItemResult';
-import { groupBy } from 'lodash';
+import { groupBy, uniqueId } from 'lodash';
 import React, { memo, useEffect, useMemo, useState } from 'react';
 import { connectStateResults } from 'react-instantsearch-dom';
 import { useAppSelector } from 'Store/Store';
@@ -52,9 +52,13 @@ function ProductListComponent({
     let newArrayShowGroup: any = [];
     let newArrayShowItem: any = [];
 
-    const groupHits = hits.filter(
-      (hit: { group_id: string }) => hit.group_id && hit.group_id !== '',
-    );
+    const groupHits = hits.map((hit: { group_id: string }) => {
+      if (!hit.group_id) {
+        return { ...hit, group_id: uniqueId('random-group-id') };
+      }
+      return hit;
+    });
+
     const groups = groupBy(groupHits, 'group_id');
     setHitGroups(groups);
     newArrayShowGroup = Object.values(groups);
@@ -79,6 +83,7 @@ function ProductListComponent({
         newArrayShowItem.push(payload);
       }
     });
+
     return newArrayShowItem;
   };
 

package/src/components/results/ItemResult.tsx

@@ -2,9 +2,9 @@ import { Box, Button, Grid, Tooltip, Typography } from '@material-ui/core';
 import ChevronRightOutlinedIcon from '@material-ui/icons/ChevronRightOutlined';
 import IconOpenLink from 'common/assets/icons/Union.svg';
 import { ReactComponent as IconShare } from 'common/assets/icons/Fill.svg';
-import { ReactComponent as Expand } from 'common/assets/icons/expand.svg';
 import { ReactComponent as IconDisLike } from 'common/assets/icons/icon_dislike.svg';
 import { ReactComponent as IconLike } from 'common/assets/icons/icon_like.svg';
+import { ReactComponent as IconSearchImage } from 'common/assets/icons/icon_search_image2.svg';
 import React, { memo, useEffect, useState } from 'react';
 import NoImage from 'common/assets/images/unnamed.png';
 import { AppState } from 'types';
@@ -143,13 +143,17 @@ function ItemResult(props: Props) {
             </Button>
           </Box>
         )}
-        {!isHover && (
+        {!isHover && main_image_link && (
           <Box className="box-icon-modal">
             <Button
               style={{ width: '100%', height: '100%', padding: 0, zIndex: 9 }}
-              onClick={() => handlerToggleModal(dataItem)}
+              onClick={() => {
+                if (urlImage.length > 1) {
+                  onSearchImage(main_image_link);
+                }
+              }}
             >
-              <Expand color={settings.theme?.secondaryColor} />
+              <IconSearchImage color={settings.theme?.secondaryColor} />
             </Button>
           </Box>
         )}
@@ -158,9 +162,7 @@ function ItemResult(props: Props) {
             style={{ width: '100%', height: '100%' }}
             onClick={(e: any) => {
               e.preventDefault();
-              if (urlImage.length > 1) {
-                onSearchImage(main_image_link);
-              }
+              handlerToggleModal(dataItem);
             }}
           >
             {main_image_link ? (
@@ -367,53 +369,58 @@ function ItemResult(props: Props) {
               style={{ color: '#2B2C46', marginTop: '12px' }}
               gridGap={10}
             >
-              <Box
-                style={{
-                  backgroundColor: `${settings.theme?.secondaryColor}26`,
-                  padding: '5px 10px',
-                  borderRadius: 4,
-                  width: '100%',
-                }}
-              >
-                <div style={{ fontSize: 10, fontWeight: 500 }}>
-                  {dataItem.custom_id_key_2}
-                </div>
-                <div
+              {settings.field.warehouseNumber && (
+                <Box
                   style={{
-                    fontSize: 13,
-                    fontWeight: 700,
-                    whiteSpace: 'nowrap',
-                    overflow: 'hidden',
-                    textOverflow: 'ellipsis',
+                    backgroundColor: `${settings.theme?.secondaryColor}26`,
+                    padding: '5px 10px',
+                    borderRadius: 4,
+                    width: '100%',
                   }}
                 >
-                  {dataItem.custom_id_value_2 || 'N/A'}
-                </div>
-              </Box>
+                  <div style={{ fontSize: 10, fontWeight: 500 }}>
+                    {dataItem[settings.field.warehouseNumber]}
+                  </div>
+                  <div
+                    style={{
+                      fontSize: 13,
+                      fontWeight: 700,
+                      whiteSpace: 'nowrap',
+                      overflow: 'hidden',
+                      textOverflow: 'ellipsis',
+                    }}
+                  >
+                    {dataItem[settings.field.warehouseNumberValue] || 'N/A'}
+                  </div>
+                </Box>
+              )}
 
-              <Box
-                style={{
-                  backgroundColor: `${settings.theme?.secondaryColor}26`,
-                  padding: '5px 10px',
-                  borderRadius: 4,
-                  width: '100%',
-                }}
-              >
-                <div style={{ fontSize: 10, fontWeight: 500 }}>
-                  {dataItem.custom_id_key_1}
-                </div>
-                <div
+              {settings.field.warehouseShelfNumber && (
+                <Box
                   style={{
-                    fontSize: 13,
-                    fontWeight: 700,
-                    whiteSpace: 'nowrap',
-                    overflow: 'hidden',
-                    textOverflow: 'ellipsis',
+                    backgroundColor: `${settings.theme?.secondaryColor}26`,
+                    padding: '5px 10px',
+                    borderRadius: 4,
+                    width: '100%',
                   }}
                 >
-                  {dataItem.custom_id_value_1 || 'N/A'}
-                </div>
-              </Box>
+                  <div style={{ fontSize: 10, fontWeight: 500 }}>
+                    {dataItem[settings.field.warehouseShelfNumber]}
+                  </div>
+                  <div
+                    style={{
+                      fontSize: 13,
+                      fontWeight: 700,
+                      whiteSpace: 'nowrap',
+                      overflow: 'hidden',
+                      textOverflow: 'ellipsis',
+                    }}
+                  >
+                    {dataItem[settings.field.warehouseShelfNumberValue] ||
+                      'N/A'}
+                  </div>
+                </Box>
+              )}
             </Box>
           )}
 
@@ -478,25 +485,6 @@ function ItemResult(props: Props) {
                     </Box>
                   </Grid>
                 )}
-                {/* <Grid item>
-              <Box display={'flex'} alignItems={'center'}>
-                <Button className="btn-item">
-                  <Box
-                    className=""
-                    display={'flex'}
-                    justifyContent={'center'}
-                    alignItems={'center'}
-                  >
-                    <img
-                      src={IconShare}
-                      alt="image_item"
-                      className="icon_support"
-                      style={{ width: '1rem' }}
-                    />
-                  </Box>
-                </Button>
-              </Box>
-            </Grid> */}
               </Grid>
             </Box>
           )}