58 lines
1.8 KiB
TypeScript
58 lines
1.8 KiB
TypeScript
import { type ComponentProps, useCallback } from 'react';
|
|
|
|
import { DropdownRecoilScopeContext } from '@/ui/dropdown/states/recoil-scope-contexts/DropdownRecoilScopeContext';
|
|
import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
|
|
import { ViewBar, type ViewBarProps } from '@/ui/view-bar/components/ViewBar';
|
|
|
|
import type { BoardColumnDefinition } from '../types/BoardColumnDefinition';
|
|
import { BoardOptionsDropdownKey } from '../types/BoardOptionsDropdownKey';
|
|
import { BoardOptionsHotkeyScope } from '../types/BoardOptionsHotkeyScope';
|
|
|
|
import { BoardOptionsDropdown } from './BoardOptionsDropdown';
|
|
|
|
export type BoardHeaderProps<SortField> = ComponentProps<'div'> & {
|
|
onStageAdd?: (boardColumn: BoardColumnDefinition) => void;
|
|
} & Pick<
|
|
ViewBarProps<SortField>,
|
|
| 'availableSorts'
|
|
| 'defaultViewName'
|
|
| 'onViewsChange'
|
|
| 'onViewSubmit'
|
|
| 'scopeContext'
|
|
>;
|
|
|
|
export function BoardHeader<SortField>({
|
|
onStageAdd,
|
|
onViewsChange,
|
|
onViewSubmit,
|
|
scopeContext,
|
|
availableSorts,
|
|
defaultViewName,
|
|
}: BoardHeaderProps<SortField>) {
|
|
const OptionsDropdownButton = useCallback(
|
|
() => (
|
|
<BoardOptionsDropdown
|
|
customHotkeyScope={{ scope: BoardOptionsHotkeyScope.Dropdown }}
|
|
onStageAdd={onStageAdd}
|
|
onViewsChange={onViewsChange}
|
|
scopeContext={scopeContext}
|
|
/>
|
|
),
|
|
[onStageAdd, onViewsChange, scopeContext],
|
|
);
|
|
|
|
return (
|
|
<RecoilScope SpecificContext={DropdownRecoilScopeContext}>
|
|
<ViewBar
|
|
availableSorts={availableSorts}
|
|
defaultViewName={defaultViewName}
|
|
onViewsChange={onViewsChange}
|
|
onViewSubmit={onViewSubmit}
|
|
optionsDropdownKey={BoardOptionsDropdownKey}
|
|
OptionsDropdownButton={OptionsDropdownButton}
|
|
scopeContext={scopeContext}
|
|
/>
|
|
</RecoilScope>
|
|
);
|
|
}
|