inital commit

2023-10-12 23:45:46 +03:00
parent 9b16b14a4c
commit 6bcc0fd3cc
86 changed files with 13784 additions and 34 deletions
--- a/src/components/SearchBar/SearchBar.tsx
+++ b/src/components/SearchBar/SearchBar.tsx
@@ -0,0 +1,84 @@
+import React, {FC, 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";
+
+type Props = {
+    onSearch: (text: string) => void;
+}
+const SearchBar: FC<Props> = ({onSearch}) => {
+    const [isScanModalVisible, setIsScanModalVisible] = useState<boolean>(false);
+    const [searchInput, setSearchInput] = useState<string>("");
+    const textInputRef = useRef<TextInput>(null);
+    return (
+        <View style={styles.container}>
+            <ScanModal
+                onChanged={(text) => {
+                    setIsScanModalVisible(false);
+                    onSearch(text);
+                }}
+                onCancelButtonPress={() => setIsScanModalVisible(false)}
+                visible={isScanModalVisible}/>
+            <BasicButton onPress={() => {
+                onSearch(searchInput);
+                if (textInputRef.current) {
+                    textInputRef.current.clear();
+                }
+            }} style={styles.scanButton} label={"Поиск"}/>
+            <View style={styles.scanImageWrapper}>
+                <TouchableOpacity onPress={() => setIsScanModalVisible(true)}>
+                    <Image style={styles.scanImage} source={require('assets/icons/scan.png')}/>
+                </TouchableOpacity>
+            </View>
+            <TextInput ref={textInputRef} onChangeText={(text) => {
+                setSearchInput(text);
+            }} style={styles.textInput} placeholder={"Введите запрос"}/>
+        </View>
+    )
+}
+
+const height = 6;
+const styles = StyleSheet.create({
+    container: {
+        display: "flex",
+        marginHorizontal: responsiveWidth(5),
+        flexDirection: "row-reverse",
+        height: responsiveHeight(height),
+        alignItems: "flex-end"
+    },
+    scanImage: {
+        height: responsiveHeight(5),
+        width: responsiveHeight(5),
+
+    },
+    scanButton: {
+        borderRadius: 0,
+        borderTopRightRadius: responsiveWidth(1),
+        borderBottomRightRadius: responsiveWidth(1),
+        width: responsiveWidth(25)
+    },
+    scanImageWrapper: {
+        paddingHorizontal: responsiveWidth(1),
+        height: responsiveHeight(height),
+        display: "flex",
+        justifyContent: "center",
+        borderWidth: 1,
+        borderColor: "#A5A5A5",
+    },
+    textInput: {
+        height: responsiveHeight(height),
+        flex: 1,
+        borderWidth: 1,
+        borderColor: "#A5A5A5",
+        borderTopLeftRadius: responsiveWidth(1),
+        borderBottomLeftRadius: responsiveWidth(1),
+        paddingLeft: responsiveHeight(2),
+        fontSize: RFPercentage(2),
+        fontFamily: 'SF Pro Text'
+    }
+})
+
+export default SearchBar