ebanutsya

src/components/SearchBar/SearchBar.tsx

@@ -1,27 +1,41 @@
-import React, {FC, useRef, useState} from "react";
+import React, {FC, useEffect, useRef, useState} from "react";
 import {Image, StyleSheet, TextInput, TouchableOpacity, View} from "react-native";
 import {responsiveHeight, responsiveWidth} from "react-native-responsive-dimensions";
 import {RFPercentage} from "react-native-responsive-fontsize";
 import BasicButton from "../BasicButton/BasicButton";
-import ScanModal from "./ScanModal";
-import telegramAuthButton from "../TelegramAuthButton/TelegramAuthButton";
+import SelectProductModal from "../Modals/SelectProductModal/SelectProductModal";
+import {SupplierProduct} from "../../types/supplierProduct";
+import barcodeApi from "../../api/barcodeApi";
+import {useDispatch, useSelector} from "react-redux";
+import {openScanModal} from "../../features/scanModal/scanModalSlice";
+import {RootState} from "../../redux/store";
 
 type Props = {
     onSearch: (text: string) => void;
+    onSupplierProductSelected?: (supplierProduct: SupplierProduct) => void
 }
-const SearchBar: FC<Props> = ({onSearch}) => {
-    const [isScanModalVisible, setIsScanModalVisible] = useState<boolean>(false);
+const SearchBar: FC<Props> = ({onSearch, onSupplierProductSelected}) => {
+    // const [isScanModalVisible, setIsScanModalVisible] = useState<boolean>(false);
+    // const [, setSelectProductModalVisible] = useState(false);
+    const dispatch = useDispatch();
     const [searchInput, setSearchInput] = useState<string>("");
     const textInputRef = useRef<TextInput>(null);
+    const [products, setProducts] = useState<SupplierProduct[]>([]);
+
+    const scannedData = useSelector((state: RootState) => state.scanModal.scannedData);
+    useEffect(() => {
+        if (!scannedData) return;
+        barcodeApi.searchProducts(scannedData).then(setProducts);
+    }, [scannedData]);
+
+    const selectProductModalVisible = products.length > 0;
     return (
         <View style={styles.container}>
-            <ScanModal
-                onChanged={(text) => {
-                    setIsScanModalVisible(false);
-                    onSearch(text);
-                }}
-                onCancelButtonPress={() => setIsScanModalVisible(false)}
-                visible={isScanModalVisible}/>
+
+            <SelectProductModal visible={selectProductModalVisible} products={products} onSelected={(product) => {
+                if (onSupplierProductSelected) onSupplierProductSelected(product);
+                setProducts([]);
+            }}/>
             <BasicButton onPress={() => {
                 onSearch(searchInput);
                 if (textInputRef.current) {
@@ -29,7 +43,9 @@ const SearchBar: FC<Props> = ({onSearch}) => {
                 }
             }} style={styles.scanButton} label={"Поиск"}/>
             <View style={styles.scanImageWrapper}>
-                <TouchableOpacity onPress={() => setIsScanModalVisible(true)}>
+                <TouchableOpacity onPress={() => {
+                    dispatch(openScanModal());
+                }}>
                     <Image style={styles.scanImage} source={require('assets/icons/scan.png')}/>
                 </TouchableOpacity>
             </View>