import { RefreshIcon } from '@/icons'
import { Filters } from './Filters'

type Props = {
	onNewBox: () => void
	onRefresh: () => void
}

export const DashboardHeader = ({ onNewBox, onRefresh }: Props) => {
	return (
		<div className="dashboard-head">
			<div className="inner">
				<button onClick={onNewBox}>Add box</button>
				<div className="spacer" />
				<Filters />
				<div className="spacer" />
				<button onClick={onRefresh}>
					<RefreshIcon /> Refresh all
				</button>
			</div>
			<div className="shadow"></div>
		</div>
	)
}
