@nyris/nyris-webapp 0.3.27 → 0.3.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nyris/nyris-webapp",
-  "version": "0.3.27",
+  "version": "0.3.29",
   "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.27",
-    "@nyris/nyris-react-components": "^0.3.27",
+    "@nyris/nyris-api": "^0.3.29",
+    "@nyris/nyris-react-components": "^0.3.29",
     "@reduxjs/toolkit": "^1.6.1",
     "@splidejs/react-splide": "^0.7.12",
     "@types/blueimp-load-image": "^2.23.4",

package/src/components/DetailItem.tsx

@@ -35,7 +35,7 @@ function DetailItem(props: Props) {
     handlerFeedback,
   } = props;
   const [collapDescription, setCollapDescription] = useState(false);
-  const { title, sku, main_offer_link, brand } = dataItem;
+  const { title, sku, main_offer_link, product_link, brand } = dataItem;
   const [dataImageCarousel, setDataImageCarouSel] = useState<any[]>([]);
   const isMobile = useMediaQuery({ query: '(max-width: 776px)' });
   const { settings } = useAppSelector<AppState>((state: any) => state);
@@ -272,7 +272,10 @@ function DetailItem(props: Props) {
                         minHeight: !settings.warehouseVariant ? 48 : 64,
                       }}
                       onClick={() =>
-                        window.open(`${main_offer_link}`, '_blank')
+                        window.open(
+                          `${product_link || main_offer_link}`,
+                          '_blank',
+                        )
                       }
                     >
                       <Typography

package/src/components/drawer/cameraCustom.tsx

@@ -35,9 +35,10 @@ function CameraCustom(props: Props) {
   const [facingMode, setFacingMode] = useState(FACING_MODE_USER);
   const [scaleCamera, setScaleCamera] = useState<number>(1);
   const stateGlobal = useAppSelector(state => state);
-  const { settings } = stateGlobal;
+  const { search, settings } = stateGlobal;
   const history = useHistory();
   const dispatch = useAppDispatch();
+  const { keyFilter } = search;
 
   const videoConstraints = {
     width: 1080,
@@ -55,23 +56,55 @@ function CameraCustom(props: Props) {
   const handlerFindImage = async (image: any) => {
     dispatch(updateStatusLoading(true));
     dispatch(loadingActionResults());
-
+    if (history.location.pathname !== '/result') {
+      history.push('/result');
+    }
     let region: RectCoords | undefined;
     let imageConvert = await createImage(image);
     dispatch(setRequestImage(imageConvert));
     dispatch(setImageSearchInput(image));
     dispatch(onToggleModalItemDetail(false));
+    handlerCloseModal();
+
     if (settings.regions) {
       let res = await findRegions(imageConvert, settings);
       dispatch(setRegions(res.regions));
       region = res.selectedRegion;
       dispatch(setSelectedRegion(region));
     }
-    setTimeout(() => {
-      dispatch(updateStatusLoading(false));
-      handlerCloseModal();
-      history.push('/result');
-    }, 500);
+
+    const preFilter = [
+      {
+        key: settings.visualSearchFilterKey,
+        values: [`${keyFilter}`],
+      },
+    ];
+    let filters: any[] = [];
+
+    findByImage({
+      image: imageConvert,
+      settings,
+      filters: keyFilter ? preFilter : undefined,
+      region,
+    })
+      .then((res: any) => {
+        res?.results.map((item: any) => {
+          filters.push({
+            sku: item.sku,
+            score: item.score,
+          });
+        });
+        const payload = {
+          ...res,
+          filters,
+        };
+        dispatch(setSearchResults(payload));
+        dispatch(updateStatusLoading(false));
+      })
+      .catch((e: any) => {
+        console.log('error input search', e);
+        dispatch(updateStatusLoading(false));
+      });
   };
 
   const handlerCloseModal = () => {

package/src/components/results/ItemResult.tsx

@@ -53,7 +53,7 @@ function ItemResult(props: Props) {
   const [isOpenModalShare, setOpenModalShare] = useState<boolean>(false);
   const [feedback, setFeedback] = useState('none');
   const { t } = useTranslation();
-  const { sku, title, brand, main_offer_link, collap } = dataItem;
+  const { sku, title, brand, main_offer_link, product_link, collap } = dataItem;
   useEffect(() => {
     if (main_image_link) {
       handlerCheckUrlImage(main_image_link);
@@ -323,7 +323,10 @@ function ItemResult(props: Props) {
                         padding: 0,
                       }}
                       onClick={() =>
-                        window.open(`${main_offer_link}`, '_blank')
+                        window.open(
+                          `${product_link || main_offer_link}`,
+                          '_blank',
+                        )
                       }
                     >
                       <Typography

package/src/page/result/index.tsx

@@ -172,7 +172,7 @@ function ResultComponent(props: Props) {
     ? search?.results
         .slice()
         .reverse()
-        .map((f: any, i: number) => `sku:'${f.sku}'<score=${i}>`)
+        .map((f: any, i: number) => `sku:'${f.sku}'<score=${i}> `)
     : '';
   const filterSkusString = [...nonEmptyFilter, ...filterSkus].join(' OR ');