Files
revenue-fe/src/pages/master/profession/blocks/ListToolbar.tsx
2025-03-21 13:29:56 +07:00

58 lines
2.1 KiB
TypeScript

import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
import { useManageProfessionContext } from '../hooks/useManageProfessionContext';
import { Button } from '@/components/ui/button';
const ListToolbar = () => {
const { reload, table } = useDataGrid();
const { handleAddDialog } = useManageProfessionContext();
return (
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
<div className="flex flex-wrap gap-2 lg:gap-5 w-full">
<div className="flex justify-between w-full items-center">
<div className="flex w-[50%] gap-3 items-center">
<label className="input input-sm w-1/3">
<KeenIcon icon="magnifier" />
<input
type="text"
placeholder="Search Profession"
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
onChange={(event) =>
table.getColumn('name')?.setFilterValue(event.target.value)
}
/>
</label>
{/* <DefaultTooltip title={'Filter'} placement={'top'}>
<Button
variant="outline"
className="h-7.5 disabled:bg-gray-400"
// disabled={isLoading}
// onClick={handleFilterData}
>
{loadingButton === 'filter' ? <ContentLoader /> : <KeenIcon icon="filter" />}
<KeenIcon icon="filter" />
</Button>
</DefaultTooltip> */}
</div>
<div className="flex gap-3 items-center">
<Button
variant="outline"
className="h-7.5 text-[0.8rem]"
onClick={() => handleAddDialog(true)}
>
Add Data
</Button>
<DefaultTooltip title={'Refresh'} placement={'top'}>
<Button variant="outline" className="h-7.5" onClick={() => reload()}>
<KeenIcon icon="arrows-circle" />
</Button>
</DefaultTooltip>
</div>
</div>
</div>
</div>
);
};
export default ListToolbar;