mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-31 11:59:10 +00:00
802521c706
The editor and cuesheet had three overlapping notions of which rundown they were showing: loaded-only data hooks, a prop-drilled RundownSource, and a selection store which read the loaded rundown out of the query cache. Rendering two rundowns at once was not possible. Introduce a rundown scope: a context carrying the rundown identity (id, isLoaded and a selection store) which the utility hooks read from. useRundown, useEntry and friends keep their signatures and call sites, they simply resolve their rundown from the enclosing scope. The app mounts a scope at the root which follows the loaded rundown, so runtime views are unaffected; the editor and cuesheet mount an editable scope which also binds entry actions to the same rundown. - useEventSelection becomes a per-scope store factory, so panels hold independent cursors and the store is handed its rundown instead of reaching for the loaded one - the cuesheet selection is generalised to useRundownSelection with a namespace, so each surface persists its own choice - the clipboard records the rundown an entry was copied from, leaving room for pasting across rundowns - removes useScopedRundown and the prop-drilled RundownSource Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_011a5cbVjNC5XXF88b2PkUCa
50 lines
2.0 KiB
TypeScript
50 lines
2.0 KiB
TypeScript
import { useDisclosure } from '@mantine/hooks';
|
|
import { IoApps } from 'react-icons/io5';
|
|
|
|
import IconButton from '../../common/components/buttons/IconButton';
|
|
import NavigationMenu from '../../common/components/navigation-menu/NavigationMenu';
|
|
import { EditableRundownScopeProvider } from '../../common/context/EditableRundownScopeProvider';
|
|
import { useRundownSelection } from '../../common/hooks/useRundownSelection';
|
|
import { useWindowTitle } from '../../common/hooks/useWindowTitle';
|
|
import { getIsNavigationLocked } from '../../externals';
|
|
import CuesheetOverview from '../../features/overview/CuesheetOverview';
|
|
import EntryEditModal from './cuesheet-edit-modal/EntryEditModal';
|
|
import CuesheetProgress from './cuesheet-progress/CuesheetProgress';
|
|
import CuesheetTableWrapper from './CuesheetTableWrapper';
|
|
|
|
import styles from './CuesheetPage.module.scss';
|
|
|
|
export default function CuesheetPage() {
|
|
'use memo';
|
|
const [isMenuOpen, menuHandler] = useDisclosure();
|
|
const { scopedRundownId, selectedRundownId, loadedRundownId, setSelectedRundownId, projectRundowns } =
|
|
useRundownSelection('cuesheet');
|
|
|
|
useWindowTitle('Cuesheet');
|
|
|
|
const isLocked = getIsNavigationLocked();
|
|
|
|
return (
|
|
<EditableRundownScopeProvider rundownId={scopedRundownId}>
|
|
<NavigationMenu isOpen={isMenuOpen} onClose={menuHandler.close} />
|
|
<EntryEditModal />
|
|
<div className={styles.tableWrapper} data-testid='cuesheet'>
|
|
<CuesheetOverview>
|
|
{!isLocked && (
|
|
<IconButton aria-label='Toggle navigation' variant='subtle-white' size='xlarge' onClick={menuHandler.open}>
|
|
<IoApps />
|
|
</IconButton>
|
|
)}
|
|
</CuesheetOverview>
|
|
<CuesheetProgress />
|
|
<CuesheetTableWrapper
|
|
selectedRundownId={selectedRundownId}
|
|
loadedRundownId={loadedRundownId}
|
|
setSelectedRundownId={setSelectedRundownId}
|
|
projectRundowns={projectRundowns}
|
|
/>
|
|
</div>
|
|
</EditableRundownScopeProvider>
|
|
);
|
|
}
|