1import {Icon, InputAdornment, TextField} from '@mui/material';
 2import {useTranslation} from 'react-i18next';
 3import PlaceInput from '../PlaceInput';
 4import useTravelsStore from '../../stores/travelsStore';
 5
 6type Props = {};
 7
 8const SearchField = (props: Props) => {
 9  const {t} = useTranslation();
10  const meetingFilter = useTravelsStore(s => s.meetingFilter);
11  const setMeetingFilter = useTravelsStore(s => s.setMeetingFilter);
12
13  const onSelect = (location: {
14    latitude?: number;
15    longitude?: number;
16    place: string;
17  }) => {
18    setMeetingFilter(location);
19  };
20
21  return (
22    <PlaceInput
23      place={meetingFilter.place}
24      onSelect={onSelect}
25      textFieldProps={{
26        variant: 'outlined',
27        placeholder: t`travel.fields.meeting_point`,
28        size: 'small',
29        slotProps: {
30          input: {
31            size: 'small',
32            startAdornment: (
33              <InputAdornment position="start">
34                <Icon>search</Icon>
35              </InputAdornment>
36            ),
37          },
38        },
39      }}
40    />
41  );
42};
43
44export default SearchField;