ReportHeader.tsx32 lines · main

1	import { useParams } from 'common'
2	import { useRouter } from 'next/router'
3
4	import { DatabaseSelector } from '@/components/ui/DatabaseSelector'
5
6	interface ReportHeaderProps {
7	title: string
8	showDatabaseSelector?: boolean
9	}
10
11	const ReportHeader = ({ title, showDatabaseSelector }: ReportHeaderProps) => {
12	const router = useRouter()
13	const { ref } = useParams()
14	const { db, chart, ...params } = router.query
15
16	return (
17	<div className="flex flex-row justify-between gap-4 items-center">
18	<h1>{title}</h1>
19	{showDatabaseSelector && (
20	<DatabaseSelector
21	onSelectId={(db) => {
22	router.push({
23	pathname: router.pathname,
24	query: db !== ref ? { ...params, db } : params,
25	})
26	}}
27	/>
28	)}
29	</div>
30	)
31	}
32	export default ReportHeader