changed name of SearchBar to TextInputBar

components/common/SearchBar.tsx

@@ -1,82 +0,0 @@
-import { AntDesign } from '@expo/vector-icons';
-import React, { useState } from 'react';
-import { StyleSheet, TextInput, TouchableOpacity, View, ViewProps } from 'react-native';
-import { SIZES } from '../../constants/theme';
-import { useTheme } from '../../app/contexts/ThemeContext';
-
-interface SearchBarProps extends ViewProps {
-  placeholder? : string;
-  onChangeText? : (text: string) => void | undefined
-}
-
-export default function SearchBar(props: SearchBarProps) {
-  const [isActive, setIsactive] = React.useState(false);
-  const { colors } = useTheme();
-  const [text, setText] = useState<string>("");
-
-  const textColor = colors
-  const backgroundColor = colors.elementDefaultColor;
-
-  const handleChange = (text:string) : void  =>  {
-    if(text !== ""){
-      if(!isActive){
-        setIsactive(true)
-      }
-    }else {
-      if(isActive){
-        setIsactive(false)
-      }
-    }
-    if(props.onChangeText){
-      props.onChangeText(text)
-    }
-    setText(text)
-  }
-
-  // cant apply the background color otherwise
-  const containerStyle = {
-    ...styles.container,
-    backgroundColor: backgroundColor // apply dynamic background color
-  };
-
-  //TODO: Handle textCancel
-  // changed styles.container to containerStyle
-  return (
-    <View style={containerStyle}>
-        <TextInput onChangeText = {handleChange} style={[{fontSize: SIZES.normal, height: "100%"}, styles.TextInput]} autoCorrect={false} keyboardType='web-search' placeholder={props.placeholder} value={text}/>
-      
-        {isActive &&
-          <TouchableOpacity style={styles.cancel} onPress={()=>{handleChange("")}}>
-            <AntDesign size={15} name='closecircle'></AntDesign>
-          </TouchableOpacity>
-        }
-      </View>
-  )
-}
-
-const styles = StyleSheet.create({
-  container: {
-    marginHorizontal: 10,
-    marginBottom: 20,
-    flexDirection: 'row',
-    justifyContent: "center",
-    alignItems: "center",
-    height: 40,
-    borderRadius: 10,
-    paddingHorizontal: 10
-  },
-  TextInput: {
-    flex: 1,
-    height: "100%",
-    justifyContent: "space-between",
-    alignItems: "center",
-    flexDirection: "row",
-    width: "100%",
-  },
-  cancel:{
-    height: "100%", 
-    width: 30, 
-    justifyContent: "center", 
-    alignItems:"center",
-  }
-})