import { Input, InputField, InputIcon, InputSlot } from "@/components/ui/input"
import { SearchIcon } from "@/components/ui/icon"
import { Box } from "@/components/ui/box"
import { useRouter } from "expo-router";
import { View } from "react-native";

export function SearchSection({ searchQuery, setSearchQuery }) {
    const router = useRouter();

  const handleSubmit = (e) => {
    const value = e.nativeEvent.text;
    router.push({
      pathname: "/notices",
      params: { search: value }
    });
  };
  return (
    <Box className="mb-2 bg-white p-2 rounded-md">
      <Input className="p-2">
        <InputSlot>
          <InputIcon as={SearchIcon} />
        </InputSlot>
        <InputField placeholder="Wyszukaj..."
          value={searchQuery}
          onChangeText={setSearchQuery}
          onSubmitEditing={handleSubmit}
          returnKeyType="search" />
      </Input>
    </Box>
  )
}