Spaces:
Sleeping
Sleeping
'use client'; | |
import { usePathname, useRouter, useSearchParams } from 'next/navigation'; | |
import React from 'react'; | |
import { DatePicker } from '../DatePicker'; | |
import { MessageFilterParams } from '@/lib/types'; | |
import { Checkbox } from '../ui/checkbox'; | |
export interface MessageFilterProps { | |
messageFilter: MessageFilterParams; | |
} | |
const MessageFilter: React.FC<MessageFilterProps> = ({ messageFilter }) => { | |
const searchParams = useSearchParams(); | |
const pathname = usePathname(); | |
const { push, refresh } = useRouter(); | |
return ( | |
<div className="flex flex-row space-x-4"> | |
<DatePicker | |
date={messageFilter.date} | |
setDate={newDate => { | |
const params = new URLSearchParams(searchParams); | |
params.set('date', newDate); | |
push(`${pathname}?${params.toString()}`); | |
}} | |
/> | |
<div className="flex items-center space-x-2"> | |
<Checkbox | |
id="include-example" | |
checked={messageFilter.includeExamples} | |
onCheckedChange={checked => { | |
const params = new URLSearchParams(searchParams); | |
params.set('includeExamples', String(checked)); | |
push(`${pathname}?${params.toString()}`); | |
}} | |
/> | |
<label | |
htmlFor="terms" | |
className="include-example font-medium leading-none" | |
> | |
Include examples | |
</label> | |
</div> | |
</div> | |
); | |
}; | |
export default MessageFilter; | |