40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import { Select } from 'antd';
|
|
import React, { useEffect, useState } from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { useLocation, useNavigate } from 'react-router-dom';
|
|
|
|
const SelectField = ({ selectBy, lebel, option }: any) => {
|
|
const [searchQuery, setSearchQuery] = useState<string>('');
|
|
const location = useLocation();
|
|
const navigate = useNavigate();
|
|
const [t] = useTranslation();
|
|
|
|
useEffect(() => {
|
|
const searchParams = new URLSearchParams(location.search);
|
|
setSearchQuery(searchParams.get('search') || '');
|
|
}, []);
|
|
|
|
|
|
const handleSelectChange = (value: any) => {
|
|
if (value) {
|
|
console.log(`${location.pathname}?${selectBy}=${value}`);
|
|
navigate(`${location.pathname}?${selectBy}=${value}`, { replace: true });
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className='SelectField'>
|
|
<Select
|
|
placeholder={t(`${lebel}`)}
|
|
options={option}
|
|
size="large"
|
|
className={`w-100`}
|
|
allowClear
|
|
onChange={handleSelectChange}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default React.memo(SelectField);
|