Compare commits

...

31 Commits

Author SHA1 Message Date
Claude fe96941737 refactor: limit runtimeState core exports to consumed seams
Only the cores exercised by tests remain exported (startCore,
addTimeCore, updateCore, getExpectedTimesCore,
loadGroupFlagAndEndCore). The rest stay parameterized but module
private until a consumer needs them.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PVTnCfesGNGwPQJwJ9FwoD
2026-07-04 14:54:56 +00:00
Claude ee9ac492c3 test: cover hot reload and add direct calculation tests for runtimeState cores
- characterisation scenarios for the hot-reload path (updateAll and
  updateLoaded), which was previously untested: editing the running
  event, removing the running event, and re-arming the loaded event
- direct tests for the parameterized cores against plain state objects
  with no module mocks: the update tick arithmetic and finish trigger
  window, added-time edge cases, and a documented matrix of the
  expected-times projection (offset sign, gap absorption, linked
  events, relative mode, delays and day offsets)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PVTnCfesGNGwPQJwJ9FwoD
2026-07-04 14:53:01 +00:00
Claude 4a0a174eb9 refactor: extract broadcast diffing into a testable function
The state diffing and gating logic moves verbatim from the
broadcastResult decorator into collectRuntimeStateChanges in
runtime.utils.ts. The decorator becomes a thin shell: snapshot, diff,
batch the changed keys, save the restore point, send.

The entire gating matrix is now unit tested against plain state
objects (see runtime.utils.test.ts), including the characterised
entry-diffing short-circuit, without sockets or module mocking. The
broadcast-contract tests remain the end-to-end lock and are unchanged.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PVTnCfesGNGwPQJwJ9FwoD
2026-07-04 10:01:02 +00:00
Claude 56257adcbd perf: hoist update() inner functions out of the tick path
updateIfIdle and updateIfWaitingToRoll were declared inside update(),
allocating two closures on every 32ms tick. They are now module-level
functions receiving the state explicitly. Behaviour is unchanged, as
proven by the characterisation suite.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PVTnCfesGNGwPQJwJ9FwoD
2026-07-04 09:57:06 +00:00
Claude b10c38514f refactor: parameterize runtimeState mutators on an explicit state
Every mutator in runtimeState.ts now has a *Core function that receives
the state it operates on and touches nothing else. The module keeps the
singleton and exports thin wrappers with the existing names and
signatures, so all call sites (EventTimer, runtime service, rundown
service) are unchanged and the hot path gains no allocations.

This also removes the partial-injection hazards of the previous seams:
start(state) wrote timer.phase, offset and expected times to the module
singleton rather than the received state, and stop(state) cleared the
singleton. Production behaviour is identical since production always
operated on the singleton; the characterisation harness and snapshots
are untouched and prove it.

The cores can now be unit tested against a plain state object without
the singleton, module resets or the rundown cache.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PVTnCfesGNGwPQJwJ9FwoD
2026-07-04 09:55:56 +00:00
Claude 80cb1f96e7 test: add characterisation harness for the runtimeState machinery
Locks down the current behaviour of the runtime state hot path before
any refactoring work:

- scenario driver and fixtures that script playback sequences against
  the real runtimeState singleton with fake timers, mirroring the
  EventTimer tick loop
- characterisation catalogue covering absolute/relative offsets,
  expected group/flag/rundown times, gap compensation, delays,
  countToEnd, addTime edge cases, pause accounting, roll modes and
  playback across midnight
- broadcast-contract tests locking which top-level store keys are
  emitted per action and tick, including the per-second gating and
  integration throttling
- unit tests for the previously untested change-detection predicates
  in runtime.utils.ts

The tests characterise current behaviour, including quirks (documented
inline): the entry diffing short-circuit that drips changed entries one
per broadcast, the sticky forceFinish flag after negative addTime, and
roll-continuation overwriting actualStart.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PVTnCfesGNGwPQJwJ9FwoD
2026-07-03 17:05:30 +00:00
Carlos Valente 42147d4d5b allow editing cuesheet link permissions 2026-07-01 13:24:47 +02:00
Carlos Valente 7850358039 bump ontime to version 4.10.0 2026-07-01 13:20:04 +02:00
Claude 52cae1e22f feat(timeline): add group reference
Co-authored-by: Carlos Valente <carlosvalente@pm.me>
2026-07-01 12:48:58 +02:00
Carlos Valente 48f9fb2609 expose mcp server in ontime 2026-07-01 12:48:40 +02:00
Carlos Valente ce8a4d230b refactor(translations): allow resetting to default values 2026-07-01 09:02:13 +02:00
Carlos Valente 1553573b94 feat(url-presets): allow presets to appear as nav menu items (#2110) 2026-06-28 18:07:02 +02:00
Alex Christoffer Rasmussen 41a09bf5c3 fix: send refetch on all rundown edits (#2098)
* fix(server): send refetch on all rundown edits

* fix(test): cuesheet tabing

* chore: remove unneeded async

* refactor: small cleanups

* chore: spelling

Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com>

* chore: remove unneded async/await

---------

Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com>
2026-06-20 12:21:11 +02:00
Claude 5dbe7afae8 feat(client): add rundown default to inherit parent group colour 2026-06-20 10:46:34 +02:00
Carlos Valente 6633cfc869 chore: minor server package upgrades 2026-06-20 09:15:23 +02:00
Carlos Valente d127367df9 chore: minor client package upgrades 2026-06-20 09:15:23 +02:00
Carlos Valente b21ec41ffd chore: upgrade base-ui 2026-06-20 09:15:23 +02:00
Carlos Valente 66292bc0cf chore: upgrade react packages 2026-06-20 09:15:23 +02:00
Alex Christoffer Rasmussen b946b245c2 feat: create the first event from the cuesheet (#2105)
* feat: create the first event from the cuesheet

* chore: cleanup css

* test: cuesheet beckground edit from empty state

* feat: only show +event button when user is in edit mode and have full write perms
2026-06-17 22:31:13 +02:00
Carlos Valente c238147b75 chore: bump node version 2026-06-11 18:58:00 +02:00
Alex Christoffer Rasmussen 5f33c993f6 bump: v4.9.0 (#2095) 2026-06-07 13:53:25 +02:00
Carlos Valente 0e6d6cd416 refactor: allow secondary rundowns (#2086)
* refactor: allow secondary rundowns

* ui: move dropdown

* feat: follow loaded

* ui: background edit warning

ui: fix disable radio button

* feat(ui): add loaded sufix in the rundown list

* feat(ui): add direct link to background edit from rundown manager

* fix: better fallback

* fix: default to is isCurrentRundown for nav bar colour

* chore: rename navigate to cuesheet

---------

Co-authored-by: alex-arc <ac@omnivox.dk>
2026-06-07 13:33:38 +02:00
Carlos Valente 199dea5df6 fix(cuesheet): prevent timer cells from submitting on tab-out or escape (#2083) 2026-06-07 12:59:18 +02:00
Alex Christoffer Rasmussen 5a3ea9f7d0 fix: playwright ci test (#2094) 2026-05-28 09:50:20 +02:00
Alex Christoffer Rasmussen 9ae49a7175 chore: pnpm 11 + dependency cleanup (#2089)
* core: upgrade to pnpm 11 and nodejs to 22.22.2

* chore: allow builds

* chore: remove unused

* chore: update actions

* chore: add stub for vitest

* reafactor: small optimization
2026-05-17 21:01:16 +02:00
Carlos Valente d30d9cfd4e refactor: account for tick size on translate 2026-05-13 20:26:15 +02:00
Carlos Valente a0e7b9b665 refactor: simplify spacing between help menu items 2026-05-13 20:26:15 +02:00
Carlos Valente 1dcb7fb08d refactor: fix Info text flow 2026-05-13 20:26:15 +02:00
Carlos Valente a7e84b9903 refactor: fixed css editor size 2026-05-13 20:26:15 +02:00
Carlos Valente 3bebbf9ce9 refactor: invalidate changed rundown 2026-05-11 21:25:15 +02:00
Carlos Valente ab8da07518 refactor: improve memoisation on table rows 2026-05-11 21:25:15 +02:00
131 changed files with 7298 additions and 2219 deletions
+2 -2
View File
@@ -20,13 +20,13 @@ jobs:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Get pnpm store directory
run: echo "PNPM_STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- name: Setup pnpm cache
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: ${{ env.PNPM_STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('pnpm-lock.yaml') }}
+2 -2
View File
@@ -15,13 +15,13 @@ jobs:
- uses: actions/checkout@v6
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Get pnpm store directory
run: echo "PNPM_STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- name: Setup pnpm cache
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: ${{ env.PNPM_STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('pnpm-lock.yaml') }}
+4 -4
View File
@@ -17,13 +17,13 @@ jobs:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Get pnpm store directory
run: echo "PNPM_STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- name: Setup pnpm cache
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: ${{ env.PNPM_STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('pnpm-lock.yaml') }}
@@ -74,7 +74,7 @@ jobs:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Install dependencies
run: pnpm install --frozen-lockfile
@@ -111,7 +111,7 @@ jobs:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Install dependencies
run: pnpm install --frozen-lockfile
+2 -2
View File
@@ -18,13 +18,13 @@ jobs:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Get pnpm store directory
run: echo "PNPM_STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- name: Setup pnpm cache
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: ${{ env.PNPM_STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('pnpm-lock.yaml') }}
+15 -7
View File
@@ -15,14 +15,18 @@ jobs:
steps:
- uses: actions/checkout@v6
- uses: actions/setup-node@v6
with:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Get pnpm store directory
run: echo "PNPM_STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- name: Setup pnpm cache
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: ${{ env.PNPM_STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('pnpm-lock.yaml') }}
@@ -54,14 +58,18 @@ jobs:
steps:
- uses: actions/checkout@v6
- uses: actions/setup-node@v6
with:
node-version-file: '.nvmrc'
- name: Setup pnpm
uses: pnpm/action-setup@v4
uses: pnpm/action-setup@v6
- name: Get pnpm store directory
run: echo "PNPM_STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- name: Setup pnpm cache
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: ${{ env.PNPM_STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('pnpm-lock.yaml') }}
@@ -74,18 +82,18 @@ jobs:
- name: Get installed Playwright version
run: echo "PLAYWRIGHT_VERSION=$(pnpm ls @playwright/test --parseable | cut -s -d '@' -f3 | cut -d '/' -f1)" >> $GITHUB_ENV
- name: Cache playwright binaries
uses: actions/cache@v4
uses: actions/cache@v5
with:
path: |
~/.cache/ms-playwright
key: ${{ runner.os }}-playwright-${{ env.PLAYWRIGHT_VERSION }}
restore-keys: |
${{ runner.os }}-playwright-
- run: npx playwright install --with-deps
- run: pnpm playwright install --with-deps
if: steps.playwright-cache.outputs.cache-hit != 'true'
- name: Install Playwright Browsers
run: npx playwright install --with-deps
run: pnpm playwright install --with-deps
- name: Run Playwright tests
run: pnpm e2e
+3
View File
@@ -54,3 +54,6 @@ ontime-data/
# temporary write files
**.tmp
# Claude Code metadata
.claude/
+1 -1
View File
@@ -1 +1 @@
v22.15.1
v22.22.3
+1 -1
View File
@@ -1,4 +1,4 @@
ARG NODE_VERSION=22.15.1
ARG NODE_VERSION=22.22.2
FROM node:${NODE_VERSION}-alpine
# Set environment variables
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@getontime/cli",
"version": "4.8.0",
"version": "4.10.0",
"author": "Carlos Valente",
"description": "Time keeping for live events",
"repository": "https://github.com/cpvalente/ontime",
+17 -18
View File
@@ -1,10 +1,10 @@
{
"name": "ontime-ui",
"version": "4.8.0",
"version": "4.10.0",
"private": true,
"type": "module",
"dependencies": {
"@base-ui/react": "1.3.0",
"@base-ui/react": "1.6.0",
"@codemirror/commands": "^6.0.0",
"@codemirror/lang-css": "^6.0.0",
"@codemirror/state": "^6.0.0",
@@ -12,28 +12,27 @@
"@dnd-kit/core": "^6.3.1",
"@dnd-kit/sortable": "^10.0.0",
"@dnd-kit/utilities": "^3.2.2",
"@fontsource/open-sans": "^5.2.6",
"@fontsource/open-sans": "^5.2.7",
"@mantine/hooks": "^8.3.7",
"@sentry/react": "^10.2.0",
"@sentry/react": "^10.59.0",
"@table-nav/react": "^0.0.7",
"@tanstack/react-query": "^5.85.9",
"@tanstack/react-query-devtools": "^5.85.9",
"@tanstack/react-query": "^5.101.0",
"@tanstack/react-query-devtools": "^5.101.0",
"@tanstack/react-table": "^8.21.3",
"@uiw/codemirror-theme-vscode": "^4.25.9",
"@uiw/codemirror-theme-vscode": "^4.25.10",
"autosize": "^6.0.1",
"axios": "^1.12.2",
"axios": "^1.18.0",
"csv-stringify": "^6.6.0",
"qrcode": "^1.5.4",
"react": "^19.2.3",
"react-colorful": "^5.6.1",
"react-dom": "^19.2.3",
"react": "^19.2.7",
"react-colorful": "^5.7.0",
"react-dom": "^19.2.7",
"react-fast-compare": "^3.2.2",
"react-hook-form": "^7.72.0",
"react-icons": "5.5.0",
"react-router": "^7.11.0",
"react-virtuoso": "^4.17.0",
"web-vitals": "^5.1.0",
"zustand": "^5.0.9"
"react-hook-form": "^7.80.0",
"react-icons": "5.6.0",
"react-router": "^8.0.1",
"react-virtuoso": "^4.18.7",
"zustand": "^5.0.14"
},
"scripts": {
"addversion": "node -p \"'export const ONTIME_VERSION = ' + JSON.stringify(require('../../package.json').version) + ';'\" > src/ONTIME_VERSION.js",
@@ -68,6 +67,7 @@
"@vitejs/plugin-legacy": "^8.0.1",
"@vitejs/plugin-react": "5.2.0",
"babel-plugin-react-compiler": "1.0.0",
"happy-dom": "^20.9.0",
"ontime-types": "workspace:*",
"ontime-utils": "workspace:*",
"sass": "^1.57.1",
@@ -75,7 +75,6 @@
"vite": "8.0.1",
"vite-plugin-compression2": "2.5.1",
"vite-plugin-svgr": "4.5.0",
"vite-tsconfig-paths": "6.1.1",
"vitest": "catalog:"
}
}
+22 -11
View File
@@ -34,19 +34,17 @@ export async function fetchCurrentRundown(options?: RequestOptions): Promise<Run
throw new Error('Invalid rundown payload');
}
return res.data;
}
function isValidRundown(x: any): x is Rundown {
return (
x &&
typeof x === 'object' &&
typeof x.id === 'string' &&
Array.isArray(x.order) &&
Array.isArray(x.flatOrder) &&
x.entries &&
typeof x.entries === 'object' &&
typeof x.revision === 'number'
);
/**
* HTTP request to fetch all entries in the given rundown
*/
export async function fetchRundown(rundownId: RundownId, options?: RequestOptions): Promise<Rundown> {
const res = await axios.get(`${rundownPath}/${rundownId}`, { signal: options?.signal });
if (!isValidRundown(res.data)) {
throw new Error('Invalid rundown payload');
}
return res.data;
}
/**
@@ -197,3 +195,16 @@ export async function requestDeleteAll(rundownId: RundownId): Promise<AxiosRespo
}
// #endregion operations on rundown entries =======================
function isValidRundown(x: any): x is Rundown {
return (
x &&
typeof x === 'object' &&
typeof x.id === 'string' &&
Array.isArray(x.order) &&
Array.isArray(x.flatOrder) &&
x.entries &&
typeof x.entries === 'object' &&
typeof x.revision === 'number'
);
}
@@ -3,8 +3,8 @@ import { ChangeEvent, KeyboardEvent, RefObject, useCallback, useEffect, useMemo,
interface UseReactiveTextInputReturn {
value: string;
onChange: (event: ChangeEvent) => void;
onBlur: (event: ChangeEvent) => void;
onChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
onBlur: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
}
@@ -15,7 +15,9 @@ export default function useReactiveTextInput(
options?: {
submitOnEnter?: boolean;
submitOnCtrlEnter?: boolean;
submitOnTab?: boolean;
onCancelUpdate?: () => void;
onTabCancel?: () => void;
allowSubmitSameValue?: boolean;
allowKeyboardNavigation?: boolean;
},
@@ -23,6 +25,10 @@ export default function useReactiveTextInput(
const [text, setText] = useState<string>(initialText);
// track whether we are submitting via a submit key (eg enter) and avoid submitting again on blur
const isKeyboardSubmitting = useRef(false);
// track escape to prevent the subsequent blur from submitting
const isEscaping = useRef(false);
// track tab-out to prevent blur from submitting (used by timer cells)
const isTabbing = useRef(false);
useEffect(() => {
if (typeof initialText === 'undefined') {
@@ -78,6 +84,7 @@ export default function useReactiveTextInput(
* @param {string} valueToSubmit
*/
const handleEscape = useCallback(() => {
isEscaping.current = true;
// No need to update if it hasn't changed
setText(initialText);
// force the text to be the initial value
@@ -141,16 +148,30 @@ export default function useReactiveTextInput(
event.stopPropagation();
}
// for cells that opt out of tab-submit, track tab-out without preventing navigation
if (event.key === 'Tab' && options?.submitOnTab === false) {
isTabbing.current = true;
}
hotKeyHandler(event);
};
}, [handleEscape, handleSubmit, options?.submitOnCtrlEnter, options?.submitOnEnter, text]);
}, [handleEscape, handleSubmit, options?.submitOnCtrlEnter, options?.submitOnEnter, options?.submitOnTab, text]);
return {
value: text,
onChange: (event: ChangeEvent) => handleChange((event.target as HTMLInputElement).value),
onBlur: (event: ChangeEvent) => {
onChange: (event) => handleChange(event.target.value),
onBlur: (event) => {
if (isTabbing.current) {
isTabbing.current = false;
(options?.onTabCancel ?? options?.onCancelUpdate)?.();
return;
}
if (isEscaping.current) {
isEscaping.current = false;
return;
}
if (!isKeyboardSubmitting.current) {
handleSubmit((event.target as HTMLInputElement).value);
handleSubmit(event.target.value);
}
},
onKeyDown: keyHandler,
@@ -8,6 +8,7 @@ import { useLocation } from 'react-router';
import { isLocalhost, supportsFullscreen } from '../../../externals';
import { canUseWakeLock, useKeepAwakeOptions } from '../../../features/keep-awake/useWakeLock';
import { navigatorConstants } from '../../../viewerConfig';
import useUrlPresets from '../../hooks-query/useUrlPresets';
import { useIsSmallScreen } from '../../hooks/useIsSmallScreen';
import { useClientStore } from '../../stores/clientStore';
import { useViewOptionsStore } from '../../stores/viewOptions';
@@ -105,6 +106,8 @@ function NavigationMenu({ isOpen, onClose }: NavigationMenuProps) {
{route.label}
</ClientLink>
))}
<PresetNavigation isSmallScreen={isSmallScreen} onClose={onClose} />
</div>
{isLocalhost && (
@@ -117,3 +120,27 @@ function NavigationMenu({ isOpen, onClose }: NavigationMenuProps) {
</Dialog.Root>
);
}
function PresetNavigation({ isSmallScreen, onClose }: { isSmallScreen: boolean; onClose: () => void }) {
const location = useLocation();
const { data: urlPresets } = useUrlPresets();
const navPresets = urlPresets.filter((preset) => preset.enabled && preset.displayInNav);
if (navPresets.length === 0) return null;
return (
<>
<hr className={style.separator} />
{navPresets.map((preset) => (
<ClientLink
key={preset.alias}
to={`preset/${preset.alias}`}
current={location.pathname === `/preset/${preset.alias}`}
postAction={isSmallScreen ? onClose : undefined}
>
{preset.alias}
</ClientLink>
))}
</>
);
}
@@ -8,9 +8,12 @@
padding-top: 10vh;
}
.empty {
width: 100%;
opacity: 0.8;
.inline {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
margin-top: 1em;
}
.text {
@@ -1,18 +1,33 @@
import EmptyImage from '../../../assets/images/empty.svg?react';
import { SupportedEntry } from 'ontime-types';
import { IoAdd } from 'react-icons/io5';
import { useTranslation } from '../../../translation/TranslationProvider';
import Button from '../buttons/Button';
import Empty from './Empty';
import style from './EmptyTableBody.module.scss';
interface EmptyTableBodyProps {
text: string;
handleAddNew?: (type: SupportedEntry) => void;
}
export default function EmptyTableBody({ text }: EmptyTableBodyProps) {
export default function EmptyTableBody({ handleAddNew }: EmptyTableBodyProps) {
const { getLocalizedString } = useTranslation();
const text = getLocalizedString('common.no_data');
return (
<tbody className={style.emptyContainer}>
<tr>
<td colSpan={99} className={style.emptyCell}>
<EmptyImage className={style.empty} />
{text && <span className={style.text}>{text}</span>}
<Empty injectedStyles={{ marginTop: '5vh' }} />
<span className={style.text}>{text}</span>
{handleAddNew && (
<div className={style.inline}>
<Button onClick={() => handleAddNew(SupportedEntry.Event)} variant='primary' size='large'>
<IoAdd />
Create Event
</Button>
</div>
)}
</td>
</tr>
</tbody>
@@ -12,6 +12,7 @@ import {
renameRundown,
} from '../api/rundown';
//TODO: make suspends so we don't have to deal with no value all over
/**
* Project rundowns
*/
@@ -4,7 +4,7 @@ import { useEffect, useMemo } from 'react';
import { queryRefetchIntervalSlow } from '../../ontimeConfig';
import { CURRENT_RUNDOWN_QUERY_KEY, getRundownQueryKey } from '../api/constants';
import { fetchCurrentRundown } from '../api/rundown';
import { fetchCurrentRundown, fetchRundown } from '../api/rundown';
import { useSelectedEventId } from '../hooks/useSocket';
import { ExtendedEntry, getFlatRundownMetadata, getRundownMetadata } from '../utils/rundownMetadata';
import { useProjectRundowns } from './useProjectRundowns';
@@ -20,7 +20,11 @@ const cachedRundownPlaceholder: Rundown = {
};
/**
* Normalised rundown data
* Normalised rundown data for the currently loaded rundown.
*
* Bootstraps via the `/current` alias so the first paint is a single round-trip,
* independent of the project rundown list. Once the loaded id is known, the
* query key swaps to the id-keyed cache that is shared with `useRundownById`.
*/
export default function useRundown() {
const queryClient = useQueryClient();
@@ -34,12 +38,13 @@ export default function useRundown() {
refetchInterval: queryRefetchIntervalSlow,
});
// Seed the ID-based cache when fetching via the 'current' alias (bootstrap)
// Seed the id-keyed cache when fetching via the bootstrap alias
useEffect(() => {
if (!data || loadedRundownId) return;
queryClient.setQueryData(getRundownQueryKey(data.id), data);
}, [data, loadedRundownId, queryClient]);
// Once we have the ID, drop the temporary current cache
useEffect(() => {
if (!loadedRundownId) return;
queryClient.removeQueries({ queryKey: CURRENT_RUNDOWN_QUERY_KEY, exact: true });
@@ -114,3 +119,21 @@ export function useRundownAuxData() {
}, [data]);
return { data: filteredData, status };
}
/**
* Provides access to a specific rundown by ID.
* When rundownId is null/undefined the query is disabled and returns the placeholder.
*/
export function useRundownById(rundownId: string | null | undefined) {
const enabled = Boolean(rundownId);
const { data, status, isError, refetch, isFetching } = useQuery<Rundown>({
queryKey: getRundownQueryKey(rundownId ?? ''),
queryFn: ({ signal }) => fetchRundown(rundownId!, { signal }),
enabled,
placeholderData: (previousData, _previousQuery) => previousData,
refetchInterval: queryRefetchIntervalSlow,
});
return { data: data ?? cachedRundownPlaceholder, status, isError, refetch, isFetching };
}
@@ -0,0 +1,54 @@
import { EntryId, Rundown } from 'ontime-types';
import { useMemo } from 'react';
import { useSelectedEventId } from '../hooks/useSocket';
import { getFlatRundownMetadata, type ExtendedEntry } from '../utils/rundownMetadata';
import { useProjectRundowns } from './useProjectRundowns';
import { useRundownById } from './useRundown';
export type RundownSource = {
rundownId: string | null;
rundown: Rundown;
flatRundown: ExtendedEntry[];
status: string;
selectedEventId: EntryId | null;
};
/**
* Explicitly scoped rundown data for views that may operate on a non-loaded rundown.
*/
export function useScopedRundown(rundownId: string | null): RundownSource {
const { data: projectRundowns } = useProjectRundowns();
return useRundownSource(rundownId, projectRundowns.loaded || null);
}
/**
* Loaded-rundown source for views that must follow the active runtime rundown.
*/
export function useLoadedRundownSource(): RundownSource {
const { data: projectRundowns } = useProjectRundowns();
const loadedRundownId = projectRundowns.loaded || null;
return useRundownSource(loadedRundownId, loadedRundownId);
}
function useRundownSource(rundownId: string | null, loadedRundownId: string | null): RundownSource {
const isLoadedTarget = rundownId !== null && rundownId === loadedRundownId;
const runtimeSelectedEventId = useSelectedEventId();
const effectiveSelectedEventId = isLoadedTarget ? runtimeSelectedEventId : null;
const { data: rundown, status } = useRundownById(rundownId);
const flatRundown = useMemo(
() => getFlatRundownMetadata(rundown, effectiveSelectedEventId),
[effectiveSelectedEventId, rundown],
);
return useMemo(
() => ({
rundownId,
rundown,
flatRundown,
status,
selectedEventId: effectiveSelectedEventId,
}),
[effectiveSelectedEventId, flatRundown, rundown, rundownId, status],
);
}
+26 -8
View File
@@ -16,6 +16,7 @@ import {
TimeStrategy,
isOntimeEvent,
isOntimeGroup,
isOntimeMilestone,
} from 'ontime-types';
import {
MILLIS_PER_SECOND,
@@ -63,9 +64,16 @@ export type EventOptions = Partial<{
}>;
/**
* Gather utilities for actions on entries
* Gather utilities for actions on entries in the loaded rundown.
*/
export const useEntryActions = () => {
export const useEntryActions = () => useEntryActionsForRundown(undefined);
/**
* Gather utilities for actions on entries in an explicitly selected rundown.
*/
export const useScopedEntryActions = (rundownId: string | null) => useEntryActionsForRundown(rundownId ?? '');
function useEntryActionsForRundown(scopedRundownId: string | undefined) {
const queryClient = useQueryClient();
const {
linkPrevious,
@@ -75,15 +83,16 @@ export const useEntryActions = () => {
defaultDangerTime,
defaultTimerType,
defaultEndAction,
inheritGroupColour,
} = useEditorSettings();
const resolveCurrentRundownQueryKey = useCallback(() => {
const loadedRundownId = queryClient.getQueryData<ProjectRundownsList>(PROJECT_RUNDOWNS)?.loaded;
if (loadedRundownId) {
return getRundownQueryKey(loadedRundownId);
if (scopedRundownId !== undefined) {
return getRundownQueryKey(scopedRundownId);
}
return CURRENT_RUNDOWN_QUERY_KEY;
}, [queryClient]);
const loadedRundownId = queryClient.getQueryData<ProjectRundownsList>(PROJECT_RUNDOWNS)?.loaded;
return loadedRundownId ? getRundownQueryKey(loadedRundownId) : CURRENT_RUNDOWN_QUERY_KEY;
}, [queryClient, scopedRundownId]);
/**
* Returns the currently loaded rundown
@@ -232,6 +241,14 @@ export const useEntryActions = () => {
}
}
if (inheritGroupColour && (isOntimeEvent(newEntry) || isOntimeMilestone(newEntry)) && !newEntry.colour) {
const parentId = resolveInsertParent(rundownData, newEntry);
const maybeParent = parentId ? rundownData.entries[parentId] : null;
if (maybeParent && isOntimeGroup(maybeParent)) {
newEntry.colour = maybeParent.colour;
}
}
try {
await addEntryMutation([rundownId, newEntry]);
} catch (error) {
@@ -247,6 +264,7 @@ export const useEntryActions = () => {
defaultTimerType,
defaultEndAction,
defaultTimeStrategy,
inheritGroupColour,
addEntryMutation,
],
);
@@ -1004,7 +1022,7 @@ export const useEntryActions = () => {
updateTimer,
],
);
};
}
/**
* Utility to optimistically delete entries from client cache
@@ -12,8 +12,10 @@ type EditorSettingsStore = {
defaultDangerTime: string;
defaultTimerType: TimerType;
defaultEndAction: EndAction;
inheritGroupColour: boolean;
setDefaultDuration: (defaultDuration: string) => void;
setLinkPrevious: (linkPrevious: boolean) => void;
setInheritGroupColour: (inheritGroupColour: boolean) => void;
setTimeStrategy: (timeStrategy: TimeStrategy) => void;
setWarnTime: (warnTime: string) => void;
setDangerTime: (dangerTime: string) => void;
@@ -29,6 +31,7 @@ export const editorSettingsDefaults = {
dangerTime: '00:01:00', // 60000 same as backend
timerType: TimerType.CountDown,
endAction: EndAction.None,
inheritGroupColour: false,
};
enum EditorSettingsKeys {
@@ -39,6 +42,7 @@ enum EditorSettingsKeys {
DefaultDangerTime = 'ontime-default-danger-time',
DefaultTimerType = 'ontime-default-timer-type',
DefaultEndAction = 'ontime-default-end-action',
InheritGroupColour = 'ontime-inherit-group-colour',
}
export const useEditorSettings = create<EditorSettingsStore>((set) => {
@@ -59,6 +63,10 @@ export const useEditorSettings = create<EditorSettingsStore>((set) => {
localStorage.getItem(EditorSettingsKeys.DefaultEndAction),
editorSettingsDefaults.endAction,
),
inheritGroupColour: booleanFromLocalStorage(
EditorSettingsKeys.InheritGroupColour,
editorSettingsDefaults.inheritGroupColour,
),
setDefaultDuration: (defaultDuration) =>
set(() => {
@@ -97,5 +105,10 @@ export const useEditorSettings = create<EditorSettingsStore>((set) => {
localStorage.setItem(EditorSettingsKeys.DefaultEndAction, String(defaultEndAction));
return { defaultEndAction };
}),
setInheritGroupColour: (inheritGroupColour) =>
set(() => {
localStorage.setItem(EditorSettingsKeys.InheritGroupColour, String(inheritGroupColour));
return { inheritGroupColour };
}),
};
});
@@ -37,6 +37,16 @@ describe('getRouteFromPreset()', () => {
alias: 'demopage',
target: OntimeView.Timer,
search: 'user=guest',
displayInNav: false,
options: {},
},
];
const disabledPresets: URLPreset[] = [
{
enabled: false,
alias: 'demopage',
target: OntimeView.Timer,
search: 'user=guest',
options: {},
},
];
@@ -47,6 +57,21 @@ describe('getRouteFromPreset()', () => {
expect(getRouteFromPreset(location, presets)).toStrictEqual('timer?user=guest&alias=demopage');
});
it('checks if the current location matches an enabled preset target', () => {
const location = resolvePath('/timer');
expect(getRouteFromPreset(location, presets)).toStrictEqual('timer?user=guest&alias=demopage');
});
it('does not redirect disabled presets', () => {
const location = resolvePath('/demopage');
expect(getRouteFromPreset(location, disabledPresets)).toBeNull();
});
it('returns null when already on a preset path', () => {
const location = resolvePath('/preset/demopage');
expect(getRouteFromPreset(location, presets)).toBeNull();
});
it('returns null if the current location is the exact match of an unwrapped alias', () => {
// we make the current location be the alias
const location = resolvePath('/timer?user=guest&alias=demopage');
@@ -81,6 +106,11 @@ describe('getRouteFromPreset()', () => {
const location = resolvePath('/demopage?n=1&token=123');
expect(getRouteFromPreset(location, presets)).toBe('timer?user=guest&alias=demopage&n=1&token=123');
});
it('redirects stale unwrapped params back to the saved preset params while preserving feature params', () => {
const location = resolvePath('/timer?user=admin&alias=demopage&n=1&token=123');
expect(getRouteFromPreset(location, presets)).toBe('timer?user=guest&alias=demopage&n=1&token=123');
});
});
describe('cuesheet presets', () => {
@@ -90,6 +120,7 @@ describe('getRouteFromPreset()', () => {
alias: 'cuesheet-4685d6',
target: OntimeView.Cuesheet,
search: '',
displayInNav: false,
options: {
read: 'full',
write: '-',
@@ -102,6 +133,7 @@ describe('getRouteFromPreset()', () => {
alias: 'cuesheet-basic',
target: OntimeView.Cuesheet,
search: '',
displayInNav: false,
},
];
const cuesheetPresetWithNavLock: URLPreset[] = [
@@ -110,6 +142,7 @@ describe('getRouteFromPreset()', () => {
alias: 'cuesheet-locked',
target: OntimeView.Cuesheet,
search: 'n=1',
displayInNav: false,
},
];
@@ -191,6 +224,7 @@ describe('generateUrlPresetOptions', () => {
target: 'timer',
search: 'param1=value1&param2=value2',
enabled: true,
displayInNav: false,
},
],
[
@@ -202,6 +236,7 @@ describe('generateUrlPresetOptions', () => {
target: 'timer',
search: 'param1=value1&param2=value2',
enabled: true,
displayInNav: false,
},
],
[
@@ -213,6 +248,7 @@ describe('generateUrlPresetOptions', () => {
target: 'timer',
search: 'param1=value1&param2=value2',
enabled: true,
displayInNav: false,
},
],
[
@@ -224,6 +260,7 @@ describe('generateUrlPresetOptions', () => {
target: 'timer',
search: 'param1=value1&param2=value2',
enabled: true,
displayInNav: false,
},
],
])('should generate URL preset options for %s', (_description, alias, url, expected) => {
+26 -28
View File
@@ -3,9 +3,7 @@ import {
Log,
MaybeNumber,
MessageTag,
ProjectRundownsList,
RefetchKey,
Rundown,
RuntimeStore,
WsPacketToClient,
WsPacketToServer,
@@ -16,16 +14,17 @@ import {
APP_SETTINGS,
CLIENT_LIST,
CSS_OVERRIDE,
CURRENT_RUNDOWN_QUERY_KEY,
CUSTOM_FIELDS,
PROJECT_DATA,
CURRENT_RUNDOWN_QUERY_KEY,
PROJECT_RUNDOWNS,
REPORT,
RUNDOWN,
RUNTIME,
TRANSLATION,
URL_PRESETS,
VIEW_SETTINGS,
getRundownQueryKey,
PROJECT_RUNDOWNS,
} from '../api/constants';
import { invalidateAllCaches } from '../api/utils';
import { ontimeQueryClient } from '../queryClient';
@@ -181,7 +180,7 @@ export const connectSocket = () => {
}
case MessageTag.Refetch: {
// the refetch message signals that the rundown has changed in the server side
const { target, revision } = payload;
const { target, revision, rundownId } = payload;
switch (target) {
case RefetchKey.All:
invalidateAllCaches();
@@ -196,7 +195,7 @@ export const connectSocket = () => {
ontimeQueryClient.invalidateQueries({ queryKey: REPORT });
break;
case RefetchKey.Rundown: {
maybeInvalidateRundownCache(revision);
maybeInvalidateRundownCache(revision, rundownId);
break;
}
case RefetchKey.UrlPresets:
@@ -214,6 +213,9 @@ export const connectSocket = () => {
case RefetchKey.Settings:
ontimeQueryClient.invalidateQueries({ queryKey: APP_SETTINGS });
break;
case RefetchKey.ProjectRundowns:
ontimeQueryClient.invalidateQueries({ queryKey: PROJECT_RUNDOWNS });
break;
default: {
target satisfies never;
break;
@@ -232,34 +234,30 @@ export const connectSocket = () => {
};
};
/**
* When we receive a refetch message for the rundown
* check which rundown needs to be invalidated
*/
export function maybeInvalidateRundownCache(revision: MaybeNumber) {
const loadedRundownId: string | undefined = (ontimeQueryClient.getQueryData(PROJECT_RUNDOWNS) as ProjectRundownsList)
?.loaded;
const activeRundownQueryKey = loadedRundownId ? getRundownQueryKey(loadedRundownId) : CURRENT_RUNDOWN_QUERY_KEY;
const cachedRundown = ontimeQueryClient.getQueryData<Rundown>(activeRundownQueryKey);
if (revision === cachedRundown?.revision) {
export function maybeInvalidateRundownCache(revision: MaybeNumber, rundownId?: string) {
if (!rundownId) {
// we omit rundownId to signify invalidate all rundowns
ontimeQueryClient.invalidateQueries({ queryKey: RUNDOWN });
ontimeQueryClient.invalidateQueries({ queryKey: CURRENT_RUNDOWN_QUERY_KEY, exact: true });
return;
}
ontimeQueryClient.invalidateQueries({ queryKey: activeRundownQueryKey, exact: true });
// skip if we dont recognise the ID the revision is lower
const queryKey = getRundownQueryKey(rundownId);
const cachedRundown = ontimeQueryClient.getQueryData<{ revision: number }>(queryKey);
if (loadedRundownId) {
// Keep bootstrap alias in sync with the ID-based cache
ontimeQueryClient.invalidateQueries({ queryKey: CURRENT_RUNDOWN_QUERY_KEY, exact: true });
} else {
// During bootstrap, loadedRundownId is not yet known.
// Invalidate any ID-based rundown caches that may have been seeded early.
ontimeQueryClient.invalidateQueries({
predicate: (query) => query.queryKey[0] === 'rundown' && query.queryKey[1] !== 'current',
});
if (revision === cachedRundown?.revision) {
// we already have the latest change
return;
}
ontimeQueryClient.invalidateQueries({ queryKey: CUSTOM_FIELDS });
ontimeQueryClient.invalidateQueries({ queryKey, exact: true });
// keep current alias in sync with the ID-based cache
const loadedRundownId = ontimeQueryClient.getQueryData<{ loaded: string }>(PROJECT_RUNDOWNS)?.loaded;
if (!loadedRundownId || loadedRundownId === rundownId) {
ontimeQueryClient.invalidateQueries({ queryKey: CURRENT_RUNDOWN_QUERY_KEY, exact: true });
}
}
export function sendSocket<T extends MessageTag | ApiActionTag>(
+4 -3
View File
@@ -194,6 +194,7 @@ export function generateUrlPresetOptions(alias: string, userUrl: string): URLPre
target: path,
search: url.searchParams.toString(),
enabled: true,
displayInNav: false,
};
}
@@ -204,7 +205,7 @@ function isPresettableView(view: string): view is OntimeViewPresettable {
/**
* Check if current location is a preset path
*/
export function isPresetPath(location: Path): boolean {
const segments = location.pathname.split('/').filter(Boolean);
return segments[0] === 'preset';
function isPresetPath(location: Path): boolean {
const firstSegment = location.pathname.split('/').find(Boolean);
return firstSegment === 'preset';
}
@@ -53,10 +53,6 @@ ul {
background-color: $red-400;
}
}
&.split {
margin-top: 1rem;
}
}
.secondary {
@@ -42,16 +42,9 @@ interface PanelListItemProps {
location?: string;
}
function PanelListItem(props: PanelListItemProps) {
const { panel, isSelected, location } = props;
function PanelListItem({ panel, isSelected, location }: PanelListItemProps) {
const { setLocation } = useAppSettingsNavigation();
const classes = cx([
style.primary,
isSelected && style.active,
panel.split && style.split,
panel.highlight && style.highlight,
]);
const classes = cx([style.primary, isSelected && style.active, panel.highlight && style.highlight]);
return (
<Fragment key={panel.id}>
@@ -89,10 +89,9 @@ export default function AutomationSettingsForm({
<Panel.Section>
<Info>
<p>Control Ontime and share its data with external systems in your workflow.</p>
<p>- Automations allow Ontime to send its data on lifecycle triggers.</p>
<p>- OSC Input tells Ontime to listen to messages on the specific port.</p>
<br />
<span>Control Ontime and share its data with external systems in your workflow.</span>
<span>- Automations allow Ontime to send its data on lifecycle triggers.</span>
<span>- OSC Input tells Ontime to listen to messages on the specific port.</span>
<ExternalLink href={oscApiDocsUrl}>See the docs</ExternalLink>
</Info>
</Panel.Section>
@@ -1,7 +1,8 @@
import { URLPreset } from 'ontime-types';
import { OntimeView, URLPreset } from 'ontime-types';
import { useState } from 'react';
import { IoAdd, IoOpenOutline, IoPencil, IoTrash } from 'react-icons/io5';
import { maybeAxiosError } from '../../../../common/api/utils';
import Button from '../../../../common/components/buttons/Button';
import IconButton from '../../../../common/components/buttons/IconButton';
import Info from '../../../../common/components/info/Info';
@@ -22,13 +23,23 @@ const urlPresetsDocs = 'https://docs.getontime.no/features/url-presets/';
export default function URLPresets() {
const [formState, setFormState] = useState<FormState>({ isOpen: false, preset: undefined });
const [actionError, setActionError] = useState<string | null>(null);
const { data, status } = useUrlPresets();
const { deletePreset, isMutating } = useUpdateUrlPreset();
const { updatePreset, deletePreset, isMutating } = useUpdateUrlPreset();
const openNewForm = () => setFormState({ isOpen: true });
const openEditForm = (preset: URLPreset) => setFormState({ isOpen: true, preset });
const closeForm = () => setFormState({ isOpen: false, preset: undefined });
const persistPreset = async (preset: URLPreset) => {
setActionError(null);
try {
await updatePreset(preset.alias, preset);
} catch (error) {
setActionError(maybeAxiosError(error));
}
};
return (
<Panel.Section>
<Panel.Card>
@@ -53,10 +64,12 @@ export default function URLPresets() {
<Panel.Section>
<Panel.Loader isLoading={status === 'pending'} />
{formState.isOpen && <URLPresetForm urlPreset={formState.preset} onClose={closeForm} />}
{actionError && <Panel.Error>{actionError}</Panel.Error>}
<Panel.Table>
<thead>
<tr>
<th>Enabled</th>
<th>Show in nav</th>
<th>Target view</th>
<th>Alias</th>
<th />
@@ -65,10 +78,23 @@ export default function URLPresets() {
<tbody>
{data.length === 0 && <Panel.TableEmpty handleClick={openNewForm} />}
{data.map((preset, index) => {
const isCuesheet = preset.target === OntimeView.Cuesheet;
return (
<tr key={preset.alias}>
<td>
<Switch defaultChecked={preset.enabled} onCheckedChange={() => {}} />
<Switch
checked={preset.enabled}
onCheckedChange={(enabled) => persistPreset({ ...preset, enabled })}
disabled={isMutating}
aria-label='Toggle preset enabled'
/>
</td>
<td>
<Switch
checked={preset.displayInNav}
onCheckedChange={(checked) => persistPreset({ ...preset, displayInNav: checked })}
disabled={isMutating || isCuesheet}
/>
</td>
<td>
<Tag>{preset.target}</Tag>
@@ -1,5 +1,5 @@
import { OntimeView, OntimeViewPresettable, URLPreset } from 'ontime-types';
import { useEffect, useRef } from 'react';
import { useEffect, useRef, useState } from 'react';
import { useForm } from 'react-hook-form';
import { maybeAxiosError, unwrapError } from '../../../../../common/api/utils';
@@ -12,6 +12,7 @@ import { preventEscape } from '../../../../../common/utils/keyEvent';
import { isUrlSafe } from '../../../../../common/utils/regex';
import { enDash } from '../../../../../common/utils/styleUtils';
import { generateUrlPresetOptions } from '../../../../../common/utils/urlPresets';
import CuesheetLinkOptions, { CuesheetPermissionValues } from '../../../../sharing/composite/CuesheetLinkOptions';
import * as Panel from '../../../panel-utils/PanelUtils';
import style from './URLPresetForm.module.scss';
@@ -32,6 +33,7 @@ const defaultValues: URLPreset = {
target: OntimeView.Timer,
search: '',
enabled: true,
displayInNav: false,
};
interface URLPresetFormProps {
@@ -61,12 +63,42 @@ export default function URLPresetForm({ urlPreset, onClose }: URLPresetFormProps
});
const urlRef = useRef<HTMLInputElement>(null);
// Cuesheet read/write permissions live outside react-hook-form
const initialPermissions = useRef<CuesheetPermissionValues>({
read: urlPreset?.options?.read ?? 'full',
write: urlPreset?.options?.write ?? 'full',
});
const [cuesheetPermissions, setCuesheetPermissions] = useState<CuesheetPermissionValues>(initialPermissions.current);
// update initial permissions on mount
useEffect(() => {
initialPermissions.current = {
read: urlPreset?.options?.read ?? 'full',
write: urlPreset?.options?.write ?? 'full',
};
setCuesheetPermissions(initialPermissions.current);
// oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps -- run on mount
}, []);
const isEditingCuesheet = urlPreset && urlPreset.target === OntimeView.Cuesheet;
const isCuesheet = watch('target') === OntimeView.Cuesheet;
const permissionsDirty =
isCuesheet &&
(cuesheetPermissions.read !== initialPermissions.current.read ||
cuesheetPermissions.write !== initialPermissions.current.write);
const noReadAccess = isCuesheet && cuesheetPermissions.read === '-';
const setupSubmit = async (data: URLPreset) => {
try {
// Preserve / apply cuesheet permissions, which are not part of the form fields
const payload: URLPreset =
data.target === OntimeView.Cuesheet
? { ...data, target: OntimeView.Cuesheet, options: cuesheetPermissions }
: data;
if (urlPreset) {
await updatePreset(urlPreset.alias, data);
await updatePreset(urlPreset.alias, payload);
} else {
await addPreset(data);
await addPreset(payload);
}
onClose();
} catch (error) {
@@ -74,6 +106,7 @@ export default function URLPresetForm({ urlPreset, onClose }: URLPresetFormProps
}
};
// focus on alias when the form opens
useEffect(() => {
setFocus('alias');
}, [setFocus]);
@@ -126,44 +159,66 @@ export default function URLPresetForm({ urlPreset, onClose }: URLPresetFormProps
<div className={style.expand}>
<Panel.Description>Generate options (paste URL to generate options)</Panel.Description>
<Panel.InlineElements>
<Input placeholder='Paste URL' fluid ref={urlRef} />
<Button onClick={generateOptions}>Generate</Button>
<Input placeholder='Paste URL' fluid ref={urlRef} disabled={isEditingCuesheet} />
<Button onClick={generateOptions} disabled={isEditingCuesheet}>
Generate
</Button>
</Panel.InlineElements>
</div>
</Panel.InlineElements>
{errors.alias?.message && <Panel.Error>{errors.alias.message}</Panel.Error>}
<div>
{enDash} or {enDash}
</div>
<div>2. Choose a view and its parameters</div>
<div>
<Panel.Description>Target</Panel.Description>
<Select
options={targetOptions}
{...register('target', { required: 'Target is required' })}
value={watch('target')}
onValueChange={(value: OntimeViewPresettable | null) => {
if (value === null) return;
setValue('target', value, { shouldDirty: true });
}}
/>
</div>
<div>
<Panel.Description>Parameters</Panel.Description>
<Textarea
fluid
rows={3}
{...register('search', {
validate: validateParams,
})}
/>
<Panel.Error>{errors.search?.message}</Panel.Error>
</div>
{!isEditingCuesheet && (
<>
<div>
{enDash} or {enDash}
</div>
<div>2. Choose a view and its parameters</div>
<div>
<Panel.Description>Target</Panel.Description>
<Select
options={targetOptions}
{...register('target', { required: 'Target is required' })}
value={watch('target')}
onValueChange={(value: OntimeViewPresettable | null) => {
if (value === null) return;
setValue('target', value, { shouldDirty: true });
}}
/>
</div>
<div>
<Panel.Description>Parameters</Panel.Description>
<Textarea
fluid
rows={3}
{...register('search', {
validate: validateParams,
})}
/>
<Panel.Error>{errors.search?.message}</Panel.Error>
</div>
</>
)}
{isCuesheet && (
<div>
<Panel.Description>Permissions</Panel.Description>
<CuesheetLinkOptions
initialRead={initialPermissions.current.read}
initialWrite={initialPermissions.current.write}
onChange={setCuesheetPermissions}
/>
</div>
)}
<div>
<Panel.Error>{errors.root?.message}</Panel.Error>
<Panel.InlineElements align='end'>
<Button onClick={onClose}>Cancel</Button>
<Button variant='primary' type='submit' disabled={!isValid || !isDirty} loading={isSubmitting || isMutating}>
<Button
variant='primary'
type='submit'
disabled={!isValid || (!isDirty && !permissionsDirty) || noReadAccess}
loading={isSubmitting || isMutating}
>
Save
</Button>
</Panel.InlineElements>
@@ -57,11 +57,11 @@ export default function CustomFieldSettings() {
<Panel.Divider />
<Panel.Section>
<Info>
Custom fields allow for additional information to be added to an event.
<br />
<br />
To use custom fields as a data source in an{' '}
<AppLink search='settings=automation__automations'>Automation</AppLink>, please note the generated key.
<span>Custom fields allow for additional information to be added to an event.</span>
<span>
To use custom fields as a data source in an{' '}
<AppLink search='settings=automation__automations'>Automation</AppLink>, please note the generated key.
</span>
<ExternalLink href={customFieldsDocsUrl}>See the docs</ExternalLink>
</Info>
</Panel.Section>
@@ -52,8 +52,9 @@ export default function CustomViews() {
<Panel.Section>
<Info>
Upload one <strong>index.html</strong> per view to <strong>/external/&lt;name&gt;/</strong>.
<br />
<span>
Upload one <strong>index.html</strong> per view to <strong>/external/&lt;name&gt;/</strong>.
</span>
External imports are not allowed, include all assets inside the html file.
<ExternalLink href={customViewsDocs}>See the docs</ExternalLink>
</Info>
@@ -9,6 +9,7 @@ import {
IoPencilOutline,
IoTrash,
} from 'react-icons/io5';
import { TbGhost3 } from 'react-icons/tb';
import { downloadAsExcel } from '../../../../common/api/excel';
import { maybeAxiosError } from '../../../../common/api/utils';
@@ -19,6 +20,7 @@ import { DropdownMenu } from '../../../../common/components/dropdown-menu/Dropdo
import Tag from '../../../../common/components/tag/Tag';
import { useMutateProjectRundowns, useProjectRundowns } from '../../../../common/hooks-query/useProjectRundowns';
import { cx } from '../../../../common/utils/styleUtils';
import { useDirectLinkToBackgroundEdit } from '../../../../views/cuesheet/useCuesheetRundownSelection';
import * as Panel from '../../panel-utils/PanelUtils';
import RundownRenameForm from './composite/RundownRenameForm';
import { ManageRundownForm } from './ManageRundownForm';
@@ -97,6 +99,8 @@ export default function ManageRundowns() {
await downloadAsExcel(rundownId, title);
};
const navigateToCuesheet = useDirectLinkToBackgroundEdit();
return (
<>
<Panel.Section>
@@ -153,7 +157,7 @@ export default function ManageRundowns() {
</td>
<td>
<DropdownMenu
render={<IconButton variant='ghosted-white' />}
render={<IconButton variant='ghosted-white' data-testId='rundown_menu' />}
items={[
{
type: 'item',
@@ -180,6 +184,12 @@ export default function ManageRundowns() {
label: 'Duplicate',
onClick: () => submitRundownDuplicate(id),
},
{
type: 'item',
icon: TbGhost3,
label: 'Edit in cuesheet',
onClick: () => navigateToCuesheet(id),
},
{ type: 'divider' },
{
type: 'destructive',
@@ -16,6 +16,7 @@ export default function RundownDefaultSettings() {
defaultDangerTime,
defaultTimerType,
defaultEndAction,
inheritGroupColour,
setDefaultDuration,
setLinkPrevious,
setTimeStrategy,
@@ -23,6 +24,7 @@ export default function RundownDefaultSettings() {
setDangerTime,
setDefaultTimerType,
setDefaultEndAction,
setInheritGroupColour,
} = useEditorSettings((state) => state);
const durationInMs = parseUserTime(defaultDuration);
@@ -44,6 +46,13 @@ export default function RundownDefaultSettings() {
/>
<Switch size='large' checked={linkPrevious} onCheckedChange={setLinkPrevious} />
</Panel.ListItem>
<Panel.ListItem>
<Panel.Field
title='Inherit group colour'
description='Whether new events and milestones inherit the colour of their parent group'
/>
<Switch size='large' checked={inheritGroupColour} onCheckedChange={setInheritGroupColour} />
</Panel.ListItem>
<Panel.ListItem>
<Panel.Field
title='Timer strategy'
@@ -0,0 +1,54 @@
import { useEffect, useState } from 'react';
import { generateUrl } from '../../../../common/api/session';
import CopyTag from '../../../../common/components/copy-tag/CopyTag';
import useInfo from '../../../../common/hooks-query/useInfo';
import { isOntimeCloud, serverURL } from '../../../../externals';
import * as Panel from '../../panel-utils/PanelUtils';
export default function McpSection() {
const { data: infoData } = useInfo();
const [mcpEndpointUrl, setMcpEndpointUrl] = useState('');
// generate url
useEffect(() => {
const baseUrl = (() => {
if (isOntimeCloud) return serverURL;
// for local setups we prefer the localhost IP to avoid remote access
if (infoData.networkInterfaces.length > 0) {
return `http://${infoData.networkInterfaces[0].address}:${infoData.serverPort}`;
}
return serverURL;
})();
// we are reusing the endpoint, so locking config and nav have no effect
generateUrl({ baseUrl, path: 'mcp', authenticate: true, lockConfig: false, lockNav: false })
.then(setMcpEndpointUrl)
.catch(() => {
setMcpEndpointUrl('');
});
}, [infoData]);
const mcpClientConfig = mcpEndpointUrl
? JSON.stringify({ mcpServers: { ontime: { url: mcpEndpointUrl } } }, null, 2)
: '';
return (
<Panel.Section>
<Panel.Card>
<Panel.SubHeader>MCP Server</Panel.SubHeader>
<Panel.Paragraph>Connect any MCP-compatible AI agent to Ontime using the endpoint below.</Panel.Paragraph>
<Panel.Divider />
<Panel.Field title='Endpoint URL' description='Add this URL to your MCP client settings' />
{mcpEndpointUrl && <CopyTag copyValue={mcpEndpointUrl}>{mcpEndpointUrl}</CopyTag>}
<Panel.Divider />
<Panel.Field
title='Client configuration snippet'
description='Paste this into your AI agent settings under "mcpServers"'
/>
{mcpEndpointUrl && <CopyTag copyValue={mcpClientConfig}>{mcpClientConfig}</CopyTag>}
</Panel.Card>
</Panel.Section>
);
}
@@ -4,6 +4,7 @@ import type { PanelBaseProps } from '../../panel-list/PanelList';
import * as Panel from '../../panel-utils/PanelUtils';
import CustomViews from '../manage-panel/CustomViews';
import GeneralSettings from './GeneralSettings';
import McpSection from './McpSection';
import ProjectData from './ProjectData';
import ServerPortSettings from './ServerPortSettings';
import ViewSettings from './ViewSettings';
@@ -13,6 +14,7 @@ export default function SettingsPanel({ location }: PanelBaseProps) {
const generalRef = useScrollIntoView<HTMLDivElement>('general', location);
const viewRef = useScrollIntoView<HTMLDivElement>('view', location);
const customViewsRef = useScrollIntoView<HTMLDivElement>('custom-views', location);
const mcpRef = useScrollIntoView<HTMLDivElement>('mcp', location);
const portRef = useScrollIntoView<HTMLDivElement>('port', location);
return (
@@ -30,6 +32,9 @@ export default function SettingsPanel({ location }: PanelBaseProps) {
<div ref={customViewsRef}>
<CustomViews />
</div>
<div ref={mcpRef}>
<McpSection />
</div>
{!isDocker && (
<div ref={portRef}>
<ServerPortSettings />
@@ -1,5 +1,5 @@
import { TranslationObject, langEn } from 'ontime-types';
import { useMemo } from 'react';
import { useEffect, useMemo } from 'react';
import { useForm } from 'react-hook-form';
import { maybeAxiosError } from '../../../../../common/api/utils';
@@ -10,6 +10,8 @@ import Modal from '../../../../../common/components/modal/Modal';
import { useTranslation } from '../../../../../translation/TranslationProvider';
import * as Panel from '../../../panel-utils/PanelUtils';
import style from './CustomTranslationModal.module.scss';
interface CustomTranslationModalProps {
isOpen: boolean;
onClose: () => void;
@@ -17,14 +19,7 @@ interface CustomTranslationModalProps {
export default function CustomTranslationModal({ isOpen, onClose }: CustomTranslationModalProps) {
const { userTranslation, postUserTranslation } = useTranslation();
const defaultValues = useMemo(() => {
const values: Record<string, string> = {};
Object.keys(langEn).forEach((key) => {
values[toFormKey(key)] = userTranslation[key as keyof TranslationObject] || '';
});
return values;
}, [userTranslation]);
const customTranslationFormValues = useMemo(() => toFormValues(userTranslation), [userTranslation]);
const {
handleSubmit,
@@ -33,13 +28,17 @@ export default function CustomTranslationModal({ isOpen, onClose }: CustomTransl
formState: { isSubmitting, isDirty, errors, isValid },
setError,
} = useForm({
defaultValues,
resetOptions: {
keepDirtyValues: true,
},
defaultValues: customTranslationFormValues,
mode: 'onChange',
});
// keep data up to date
useEffect(() => {
if (isOpen) {
reset(customTranslationFormValues);
}
}, [customTranslationFormValues, isOpen, reset]);
const onSubmit = async (formData: Record<string, string>) => {
try {
const translationData: Record<string, string> = {};
@@ -54,6 +53,10 @@ export default function CustomTranslationModal({ isOpen, onClose }: CustomTransl
}
};
const resetToEnglish = () => {
reset(toFormValues(langEn), { keepDefaultValues: true });
};
return (
<Modal
title='Edit custom translations'
@@ -84,9 +87,12 @@ export default function CustomTranslationModal({ isOpen, onClose }: CustomTransl
</Panel.Section>
}
footerElements={
<div>
<div className={style.footer}>
{errors?.root && <Panel.Error>{errors.root.message}</Panel.Error>}
<Panel.InlineElements align='apart'>
<Button variant='ghosted' size='large' onClick={resetToEnglish} disabled={isSubmitting}>
Reset to English
</Button>
<Panel.InlineElements>
<Button size='large' onClick={onClose}>
Cancel
@@ -109,6 +115,14 @@ export default function CustomTranslationModal({ isOpen, onClose }: CustomTransl
);
}
function toFormValues(translation: Partial<TranslationObject>) {
const values: Record<string, string> = {};
Object.keys(langEn).forEach((key) => {
values[toFormKey(key)] = translation[key as keyof TranslationObject] || '';
});
return values;
}
function toFormKey(key: string) {
return key.replace('.', '_');
}
@@ -20,4 +20,5 @@
border: 1px solid $gray-1100;
border-radius: 3px;
overflow: hidden;
height: 100%;
}
@@ -7,7 +7,6 @@ export type SettingsOption = {
id: string;
label: string;
secondary?: Readonly<SettingsOption[]>;
split?: boolean;
highlight?: string;
};
@@ -20,13 +19,13 @@ const staticOptions = [
{ id: 'settings__general', label: 'General settings' },
{ id: 'settings__view', label: 'View settings' },
{ id: 'settings__custom-views', label: 'Custom views' },
{ id: 'settings__port', label: 'Server port' },
{ id: 'settings__mcp', label: 'MCP Server' },
...(isDocker ? [] : [{ id: 'settings__port', label: 'Server port' }]),
],
},
{
id: 'project',
label: 'Project',
split: true,
secondary: [
{ id: 'project__create', label: 'Create...' },
{ id: 'project__list', label: 'Manage projects' },
@@ -46,7 +45,6 @@ const staticOptions = [
{
id: 'automation',
label: 'Automation',
split: true,
secondary: [
{ id: 'automation__settings', label: 'Automation settings' },
{ id: 'automation__automations', label: 'Manage automations' },
@@ -56,7 +54,6 @@ const staticOptions = [
{
id: 'sharing',
label: 'Sharing and reporting',
split: true,
secondary: [
{ id: 'sharing__presets', label: 'URL Presets' },
{
@@ -69,7 +66,6 @@ const staticOptions = [
{
id: 'network',
label: 'Network',
split: true,
secondary: [
{
id: 'network__log',
@@ -84,12 +80,10 @@ const staticOptions = [
{
id: 'about',
label: 'About',
split: true,
},
{
id: 'shutdown',
label: 'Shutdown',
split: true,
},
] as const;
@@ -103,18 +97,12 @@ export function useAppSettingsMenu() {
const options: Readonly<SettingsOption[]> = useMemo(
() =>
staticOptions.map((option) => ({
...option,
// if we are in docker don't show the port option
secondary:
'secondary' in option
? isDocker && option.id === 'settings'
? [...option.secondary.filter(({ id }) => id !== 'settings__port')]
: [...option.secondary]
: undefined,
staticOptions.map((option) =>
// if there is an update then highlight the about setting
highlight: option.id === 'about' && data.hasUpdates ? 'New version available' : undefined,
})),
option.id === 'about' && data.hasUpdates
? Object.assign({}, option, { highlight: 'New version available' })
: option,
),
[data],
);
@@ -6,6 +6,7 @@ import ErrorBoundary from '../../common/components/error-boundary/ErrorBoundary'
import ViewNavigationMenu from '../../common/components/navigation-menu/ViewNavigationMenu';
import ProtectRoute from '../../common/components/protect-route/ProtectRoute';
import { EntryActionsProvider } from '../../common/context/EntryActionsContext';
import { useLoadedRundownSource } from '../../common/hooks-query/useScopedRundown';
import { useEntryActions } from '../../common/hooks/useEntryAction';
import { useIsSmallDevice } from '../../common/hooks/useIsSmallDevice';
import { handleLinks } from '../../common/utils/linkUtils';
@@ -104,6 +105,8 @@ interface RundownRootProps {
}
function RundownRoot({ isSmallDevice, isExtracted, viewMode, setViewMode }: RundownRootProps) {
const source = useLoadedRundownSource();
return (
<div className={style.rundownRoot}>
{isSmallDevice ? (
@@ -112,7 +115,7 @@ function RundownRoot({ isSmallDevice, isExtracted, viewMode, setViewMode }: Rund
<RundownHeader isExtracted={isExtracted} viewMode={viewMode} setViewMode={setViewMode} />
)}
{viewMode === RundownViewMode.List ? <RundownList /> : <RundownTable />}
{viewMode === RundownViewMode.Table && <EntryEditModal />}
{viewMode === RundownViewMode.Table && <EntryEditModal rundown={source.rundown} />}
<RenumberCuesDialog />
</div>
);
@@ -1,7 +1,6 @@
import { OntimeEntry, isOntimeEvent, isOntimeGroup, isOntimeMilestone } from 'ontime-types';
import { OntimeEntry, Rundown, isOntimeEvent, isOntimeGroup, isOntimeMilestone } from 'ontime-types';
import { useMemo } from 'react';
import useRundown from '../../../common/hooks-query/useRundown';
import EventEditor from './EventEditor';
import GroupEditor from './GroupEditor';
import MilestoneEditor from './MilestoneEditor';
@@ -10,19 +9,18 @@ import style from './EntryEditor.module.scss';
interface CuesheetEntryEditorProps {
entryId: string;
rundown: Rundown;
}
export default function CuesheetEntryEditor({ entryId }: CuesheetEntryEditorProps) {
const { data } = useRundown();
export default function CuesheetEntryEditor({ entryId, rundown }: CuesheetEntryEditorProps) {
const entry = useMemo<OntimeEntry | null>(() => {
if (data.order.length === 0) {
if (rundown.order.length === 0) {
return null;
}
const event = data.entries[entryId];
const event = rundown.entries[entryId];
return event ?? null;
}, [entryId, data.order, data.entries]);
}, [entryId, rundown.entries, rundown.order.length]);
if (isOntimeEvent(entry)) {
return (
@@ -1,39 +0,0 @@
import { Toolbar } from '@base-ui/react/toolbar';
import type { Column } from '@tanstack/react-table';
import type { ExtendedEntry } from '../../../common/utils/rundownMetadata';
import {
ColumnSettings,
ViewSettings,
} from '../../../views/cuesheet/cuesheet-table/cuesheet-table-settings/CuesheetTableSettings';
import { usePersistedRundownOptions } from '../rundown.options';
import style from '../../../views/cuesheet/cuesheet-table/cuesheet-table-settings/CuesheetTableSettings.module.scss';
interface EditorTableSettingsProps {
columns: Column<ExtendedEntry, unknown>[];
handleResetResizing: () => void;
handleResetReordering: () => void;
handleClearToggles: () => void;
}
export default function EditorTableSettings({
columns,
handleResetResizing,
handleResetReordering,
handleClearToggles,
}: EditorTableSettingsProps) {
const options = usePersistedRundownOptions();
return (
<Toolbar.Root className={style.tableSettings}>
<ViewSettings optionsStore={options} />
<ColumnSettings
columns={columns}
handleResetResizing={handleResetResizing}
handleResetReordering={handleResetReordering}
handleClearToggles={handleClearToggles}
/>
</Toolbar.Root>
);
}
@@ -1,7 +1,10 @@
import { memo, useEffect, useMemo } from 'react';
import EmptyPage from '../../../common/components/state/EmptyPage';
import { EntryActionsProvider } from '../../../common/context/EntryActionsContext';
import useCustomFields from '../../../common/hooks-query/useCustomFields';
import { useLoadedRundownSource } from '../../../common/hooks-query/useScopedRundown';
import { useEntryActions } from '../../../common/hooks/useEntryAction';
import CuesheetDnd from '../../../views/cuesheet/cuesheet-dnd/CuesheetDnd';
import CuesheetTable from '../../../views/cuesheet/cuesheet-table/CuesheetTable';
import { useCuesheetPermissions } from '../../../views/cuesheet/useTablePermissions';
@@ -13,6 +16,8 @@ function RundownTable() {
const { data: customFields, status: customFieldStatus } = useCustomFields();
const setPermissions = useCuesheetPermissions((state) => state.setPermissions);
const { editorMode } = useEditorFollowMode();
const source = useLoadedRundownSource();
const actions = useEntryActions();
// Editor always has full permissions
useEffect(() => {
@@ -30,12 +35,14 @@ function RundownTable() {
const isLoading = !customFields || customFieldStatus === 'pending';
return (
<CuesheetDnd columns={columns} tableRoot='editor'>
{isLoading ? (
<EmptyPage text='Loading...' />
) : (
<CuesheetTable columns={columns} cuesheetMode={editorMode} tableRoot='editor' />
)}
</CuesheetDnd>
<EntryActionsProvider actions={actions}>
<CuesheetDnd columns={columns} tableRoot='editor'>
{isLoading ? (
<EmptyPage text='Loading...' />
) : (
<CuesheetTable columns={columns} source={source} cuesheetMode={editorMode} tableRoot='editor' />
)}
</CuesheetDnd>
</EntryActionsProvider>
);
}
@@ -2,7 +2,7 @@ import { EntryId, MaybeNumber, ProjectRundownsList, Rundown, isOntimeEvent } fro
import { MouseEvent } from 'react';
import { create } from 'zustand';
import { CURRENT_RUNDOWN_QUERY_KEY, PROJECT_RUNDOWNS, getRundownQueryKey } from '../../common/api/constants';
import { PROJECT_RUNDOWNS, getRundownQueryKey } from '../../common/api/constants';
import { ontimeQueryClient } from '../../common/queryClient';
import { isMacOS } from '../../common/utils/deviceUtils';
@@ -137,12 +137,9 @@ export const useEventSelection = create<EventSelectionStore>()((set, get) => ({
}));
function getLoadedRundownData() {
const loadedRundownId = ontimeQueryClient.getQueryData<ProjectRundownsList>(PROJECT_RUNDOWNS)?.loaded;
if (loadedRundownId) {
return ontimeQueryClient.getQueryData<Rundown>(getRundownQueryKey(loadedRundownId));
}
return ontimeQueryClient.getQueryData<Rundown>(CURRENT_RUNDOWN_QUERY_KEY);
const rundownId = ontimeQueryClient.getQueryData<ProjectRundownsList>(PROJECT_RUNDOWNS)?.loaded;
if (!rundownId) return undefined;
return ontimeQueryClient.getQueryData<Rundown>(getRundownQueryKey(rundownId));
}
export function getSelectionMode(event: MouseEvent): SelectionMode {
@@ -1,6 +1,6 @@
import { OntimeView, URLPreset } from 'ontime-types';
import { generateId } from 'ontime-utils';
import { useRef, useState } from 'react';
import { useCallback, useRef, useState } from 'react';
import { FieldErrors, useForm } from 'react-hook-form';
import { generateUrl } from '../../common/api/session';
@@ -18,7 +18,7 @@ import { preventEscape } from '../../common/utils/keyEvent';
import { isUrlSafe } from '../../common/utils/regex';
import { isOntimeCloud, serverURL } from '../../externals';
import * as Panel from '../app-settings/panel-utils/PanelUtils';
import CuesheetLinkOptions from './composite/CuesheetLinkOptions';
import CuesheetLinkOptions, { CuesheetPermissionValues } from './composite/CuesheetLinkOptions';
import style from './GenerateLinkForm.module.scss';
@@ -53,12 +53,26 @@ type GenerateLinkState = 'pending' | 'loading' | 'success' | 'error';
export default function GenerateLinkForm({ hostOptions, pathOptions, presets, isLockedToView }: GenerateLinkFormProps) {
const [formState, setFormState] = useState<GenerateLinkState>('pending');
const [url, setUrl] = useState(serverURL);
const cuesheetReadRef = useRef<HTMLInputElement>(null);
const cuesheetWriteRef = useRef<HTMLInputElement>(null);
const [url, setUrl] = useState('');
const [cuesheetPermissions, setCuesheetPermissions] = useState<CuesheetPermissionValues>({
read: 'full',
write: 'full',
});
const generatedAlias = useRef<string>(`cuesheet-${generateId()}`);
const { addPreset } = useUpdateUrlPreset();
const { addPreset, updatePreset } = useUpdateUrlPreset();
// Tracks the alias we already created this session so re-generating updates rather than duplicates it
const createdAlias = useRef<string | null>(null);
/**
* Permissions live outside react-hook-form, so we reset a successful state manually
* whenever they change - this re-arms the "Create share link" button as the previous
* link no longer reflects the selected permissions.
*/
const handlePermissionsChange = useCallback((permissions: CuesheetPermissionValues) => {
setCuesheetPermissions(permissions);
setFormState((current) => (current === 'success' ? 'pending' : current));
}, []);
const {
handleSubmit,
@@ -90,16 +104,20 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is
if (options.read === '-') {
throw new Error('Cannot create a share with no read permissions');
}
const presets = await addPreset({
const payload = {
target: OntimeView.Cuesheet,
enabled: true,
alias,
search: '',
displayInNav: false,
options: {
read: options.read,
write: options.write,
},
});
} as const;
// Re-generating with the same name updates the existing preset instead of failing on a duplicate alias
const presets = createdAlias.current === alias ? await updatePreset(alias, payload) : await addPreset(payload);
createdAlias.current = alias;
return presets.find((preset) => preset.alias === alias);
};
@@ -108,8 +126,8 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is
setFormState('loading');
if (options.path === OntimeView.Cuesheet) {
const urlPreset = await createPresetFromOptions((options as CuesheetLinkOptions).alias, {
read: cuesheetReadRef.current?.value ?? 'full',
write: cuesheetWriteRef.current?.value ?? 'full',
read: cuesheetPermissions.read,
write: cuesheetPermissions.write,
});
if (!urlPreset) {
@@ -157,6 +175,7 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is
}
};
const noReadAccess = watch('path') === OntimeView.Cuesheet && cuesheetPermissions.read === '-';
const canSubmit = isDirty || formState !== 'success';
return (
@@ -220,7 +239,7 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is
})}
/>
</Panel.ListItem>
<CuesheetLinkOptions readRef={cuesheetReadRef} writeRef={cuesheetWriteRef} />
<CuesheetLinkOptions onChange={handlePermissionsChange} />
</>
)}
@@ -268,18 +287,29 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is
</Panel.ListGroup>
<Panel.Error>{errors.root?.message}</Panel.Error>
<Panel.InlineElements align='end' className={style.end}>
<Button type='submit' variant={canSubmit ? 'primary' : 'subtle'} loading={formState === 'loading'}>
<Button
type='submit'
variant={canSubmit ? 'primary' : 'subtle'}
loading={formState === 'loading'}
disabled={noReadAccess}
>
{canSubmit ? 'Create share link' : 'Link copied to clipboard!'}
</Button>
</Panel.InlineElements>
</div>
<Panel.Section className={style.column}>
<Panel.Description>Share this link</Panel.Description>
<QRCode size={172} value={url} />
<div className={style.copiableLink} data-testid='copy-link'>
{url}
</div>
<CopyTag copyValue={url}>Copy link</CopyTag>
{url ? (
<>
<QRCode size={172} value={url} />
<div className={style.copiableLink} data-testid='copy-link'>
{url}
</div>
<CopyTag copyValue={url}>Copy link</CopyTag>
</>
) : (
<Panel.Description>Your link will appear here once you create it.</Panel.Description>
)}
</Panel.Section>
</div>
</form>
@@ -1,4 +1,4 @@
import { Fragment, RefObject, useMemo, useState } from 'react';
import { Fragment, useCallback, useEffect, useMemo, useState } from 'react';
import RadioGroup from '../../../common/components/radio-group/RadioGroup';
import Switch from '../../../common/components/switch/Switch';
@@ -10,118 +10,141 @@ import style from './CuesheetLinkOptions.module.scss';
type AccessMode = 'full' | 'custom';
interface CuesheetLinkOptionsProps {
readRef?: RefObject<HTMLInputElement | null>;
writeRef?: RefObject<HTMLInputElement | null>;
export interface CuesheetPermissionValues {
read: string;
write: string;
}
export default function CuesheetLinkOptions({ readRef, writeRef }: CuesheetLinkOptionsProps) {
interface CuesheetLinkOptionsProps {
/** Existing read permission to seed the form with ('full' | '-' | comma separated keys) */
initialRead?: string;
/** Existing write permission to seed the form with ('full' | '-' | comma separated keys) */
initialWrite?: string;
/** Notifies the parent whenever the resolved read/write permissions change */
onChange: (permissions: CuesheetPermissionValues) => void;
}
/** A null result means "full or unset" - there is no explicit per-column selection to seed */
function parseKeys(permission: string | undefined): Set<string> | null {
if (permission == null || permission === 'full') {
return null;
}
if (permission === '-') {
return new Set();
}
return new Set(permission.split(','));
}
function modeFromPermission(permission: string | undefined): AccessMode {
return permission == null || permission === 'full' ? 'full' : 'custom';
}
export default function CuesheetLinkOptions({ initialRead, initialWrite, onChange }: CuesheetLinkOptionsProps) {
const { data } = useCustomFields();
const customFieldColumns = useMemo(() => makeCuesheetCustomColumns(data), [data]);
const allColumns = useMemo(() => [...cuesheetDefaultColumns, ...customFieldColumns], [customFieldColumns]);
const [readPermissions, setReadPermissions] = useState<AccessMode>('full');
const [writePermissions, setWritePermissions] = useState<AccessMode>('full');
// Parsed seed values - stable for the lifetime of a given preset
const initialReadKeys = useMemo(() => parseKeys(initialRead), [initialRead]);
const initialWriteKeys = useMemo(() => parseKeys(initialWrite), [initialWrite]);
const [readSwitches, setReadSwitches] = useState<Record<string, boolean>>(() => {
const initialState: Record<string, boolean> = {};
[...cuesheetDefaultColumns, ...customFieldColumns].forEach((column) => {
initialState[column.value] = true;
const [readPermissions, setReadPermissions] = useState<AccessMode>(() => modeFromPermission(initialRead));
const [writePermissions, setWritePermissions] = useState<AccessMode>(() => modeFromPermission(initialWrite));
// Default for a column we have not seen yet: honour the seed in custom mode, otherwise grant access
const defaultRead = useCallback(
(key: string) => (initialReadKeys ? initialReadKeys.has(key) : true),
[initialReadKeys],
);
const defaultWrite = useCallback(
(key: string) => (initialWriteKeys ? initialWriteKeys.has(key) : true),
[initialWriteKeys],
);
const [readSwitches, setReadSwitches] = useState<Record<string, boolean>>({});
const [writeSwitches, setWriteSwitches] = useState<Record<string, boolean>>({});
// Custom fields load asynchronously, so reconcile the switch maps whenever the column list grows.
// Newly seen columns are seeded from the initial values (or default to on for a fresh link).
useEffect(() => {
setReadSwitches((prev) => {
const next = { ...prev };
for (const column of allColumns) {
if (!(column.value in next)) next[column.value] = defaultRead(column.value);
}
return next;
});
return initialState;
});
const [writeSwitches, setWriteSwitches] = useState<Record<string, boolean>>(() => {
const initialState: Record<string, boolean> = {};
[...cuesheetDefaultColumns, ...customFieldColumns].forEach((column) => {
initialState[column.value] = true;
setWriteSwitches((prev) => {
const next = { ...prev };
for (const column of allColumns) {
if (!(column.value in next)) next[column.value] = defaultWrite(column.value);
}
return next;
});
return initialState;
});
}, [allColumns, defaultRead, defaultWrite]);
const isReadOn = (key: string) => readSwitches[key] ?? defaultRead(key);
const isWriteOn = (key: string) => writeSwitches[key] ?? defaultWrite(key);
const handleReadModeChange = (value: AccessMode) => {
setReadPermissions(value);
setReadSwitches((prevReadSwitches) => {
const updatedReadSwitches = { ...prevReadSwitches };
Object.keys(updatedReadSwitches).forEach((key) => {
updatedReadSwitches[key] = true;
});
return updatedReadSwitches;
});
};
const handleWriteModeChange = (value: AccessMode) => {
setWritePermissions(value);
// Full write implies full read
if (value === 'full') {
setReadPermissions('full');
}
setWritePermissions(value);
setReadSwitches((prevReadSwitches) => {
const updatedReadSwitches = { ...prevReadSwitches };
setWriteSwitches((prevWriteSwitches) => {
const updatedWriteSwitches = { ...prevWriteSwitches };
[...cuesheetDefaultColumns, ...customFieldColumns].forEach((column) => {
updatedReadSwitches[column.value] = true;
updatedWriteSwitches[column.value] = true;
});
return updatedWriteSwitches;
});
return updatedReadSwitches;
});
};
const handleSwitchChange = (key: string, type: 'read' | 'write', value: boolean) => {
if (type === 'read') {
setReadSwitches((prevReadSwitches) => {
const updatedReadSwitches = { ...prevReadSwitches, [key]: value };
return updatedReadSwitches;
});
} else {
setWriteSwitches((prevWriteSwitches) => {
const updatedWriteSwitches = { ...prevWriteSwitches, [key]: value };
return updatedWriteSwitches;
});
const handleReadSwitch = (key: string, value: boolean) => {
setReadSwitches((prev) => ({ ...prev, [key]: value }));
// A column the recipient cannot read cannot be written either
if (!value) {
setWriteSwitches((prev) => ({ ...prev, [key]: false }));
}
};
const getReadPermissions = () => {
const handleWriteSwitch = (key: string, value: boolean) => {
setWriteSwitches((prev) => ({ ...prev, [key]: value }));
// Granting write access requires read access
if (value) {
setReadSwitches((prev) => ({ ...prev, [key]: true }));
}
};
const resolvedRead = useMemo(() => {
if (readPermissions === 'full' || writePermissions === 'full') {
return 'full';
}
const keys = allColumns.filter((column) => isReadOn(column.value)).map((column) => column.value);
return keys.length ? keys.join(',') : '-';
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [readPermissions, writePermissions, readSwitches, allColumns]);
return Object.entries(readSwitches)
.filter(([_, value]) => value)
.map(([key]) => key)
.join(',');
};
const getWritePermissions = () => {
const resolvedWrite = useMemo(() => {
if (writePermissions === 'full') {
return 'full';
}
const keys = allColumns.filter((column) => isWriteOn(column.value)).map((column) => column.value);
return keys.length ? keys.join(',') : '-';
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [writePermissions, writeSwitches, allColumns]);
return Object.entries(writeSwitches)
.filter(([_, value]) => value)
.map(([key]) => key)
.join(',');
};
// Notify the parent of the resolved permissions. onChange is expected to be stable.
useEffect(() => {
onChange({ read: resolvedRead, write: resolvedWrite });
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [resolvedRead, resolvedWrite]);
const noReadAccess = resolvedRead === '-';
return (
<Panel.Indent>
<input name='read' hidden readOnly ref={readRef} value={getReadPermissions() || '-'} />
<input name='write' hidden readOnly ref={writeRef} value={getWritePermissions() || '-'} />
<div>
<Panel.Field title='Access mode' description='Which parts of the data will the link give access to' />
<Panel.Field title='Access mode' description='Which parts of the data the link gives access to' />
<div>
<RadioGroup
value={writePermissions}
onValueChange={handleWriteModeChange}
orientation='horizontal'
items={[
{ value: 'full', label: 'Full write (edit all existing and future columns)' },
{ value: 'custom', label: 'Custom write' },
]}
/>
<RadioGroup
value={readPermissions}
onValueChange={handleReadModeChange}
@@ -132,8 +155,18 @@ export default function CuesheetLinkOptions({ readRef, writeRef }: CuesheetLinkO
{ value: 'custom', label: 'Custom read' },
]}
/>
<RadioGroup
value={writePermissions}
onValueChange={handleWriteModeChange}
orientation='horizontal'
items={[
{ value: 'full', label: 'Full write (edit all existing and future columns)' },
{ value: 'custom', label: 'Custom write' },
]}
/>
</div>
</div>
{noReadAccess && <Panel.Error>Links must contain at least one readable column.</Panel.Error>}
<div className={style.twoCols}>
<div className={style.grid}>
<Panel.Description>Ontime columns</Panel.Description>
@@ -143,14 +176,14 @@ export default function CuesheetLinkOptions({ readRef, writeRef }: CuesheetLinkO
<Fragment key={column.value}>
<div>{column.label}</div>
<Switch
checked={Boolean(readSwitches[column.value])}
onCheckedChange={(value: boolean) => handleSwitchChange(column.value, 'read', value)}
checked={isReadOn(column.value)}
onCheckedChange={(value: boolean) => handleReadSwitch(column.value, value)}
disabled={readPermissions === 'full' || writePermissions === 'full'}
data-testid={`read-${column.value}`}
/>
<Switch
checked={Boolean(writeSwitches[column.value])}
onCheckedChange={(value: boolean) => handleSwitchChange(column.value, 'write', value)}
checked={isWriteOn(column.value)}
onCheckedChange={(value: boolean) => handleWriteSwitch(column.value, value)}
disabled={writePermissions === 'full'}
data-testid={`write-${column.value}`}
/>
@@ -164,16 +197,16 @@ export default function CuesheetLinkOptions({ readRef, writeRef }: CuesheetLinkO
<Panel.Description>Write</Panel.Description>
{customFieldColumns.map((column) => (
<Fragment key={column.value}>
{column.label}
<div>{column.label}</div>
<Switch
checked={Boolean(readSwitches[column.value])}
onCheckedChange={(value: boolean) => handleSwitchChange(column.value, 'read', value)}
checked={isReadOn(column.value)}
onCheckedChange={(value: boolean) => handleReadSwitch(column.value, value)}
disabled={readPermissions === 'full' || writePermissions === 'full'}
data-testid={`read-${column.value}`}
/>
<Switch
checked={Boolean(writeSwitches[column.value])}
onCheckedChange={(value: boolean) => handleSwitchChange(column.value, 'write', value)}
checked={isWriteOn(column.value)}
onCheckedChange={(value: boolean) => handleWriteSwitch(column.value, value)}
disabled={writePermissions === 'full'}
data-testid={`write-${column.value}`}
/>
+1 -1
View File
@@ -82,5 +82,5 @@ export const initializeSentry = () => {
},
});
return Sentry.withSentryReactRouterV6Routing(Routes);
return Sentry.withSentryReactRouterV7Routing(Routes);
};
@@ -28,6 +28,7 @@ export const langDe: TranslationObject = {
'timeline.done': 'Beendet',
'timeline.due': 'fällig',
'timeline.followedby': 'Gefolgt von',
'timeline.standby': 'Bereitschaft',
'project.title': 'Titel',
'project.description': 'Beschreibung',
'project.info': 'Projektinfo',
@@ -28,6 +28,7 @@ export const langEs: TranslationObject = {
'timeline.done': 'Terminado',
'timeline.due': 'pendiente',
'timeline.followedby': 'Seguido por',
'timeline.standby': 'En espera',
'project.title': 'Título',
'project.description': 'Descripción',
'project.info': 'Información del proyecto',
@@ -28,6 +28,7 @@ export const langFr: TranslationObject = {
'timeline.done': 'Terminé',
'timeline.due': 'dû',
'timeline.followedby': 'Suivi de',
'timeline.standby': 'En attente',
'project.title': 'Titre',
'project.description': 'Description',
'project.info': 'Informations du projet',
@@ -28,6 +28,7 @@ export const langIt: TranslationObject = {
'timeline.done': 'Terminato',
'timeline.due': 'previsto',
'timeline.followedby': 'Seguito da',
'timeline.standby': 'In attesa',
'project.title': 'Titolo',
'project.description': 'Descrizione',
'project.info': 'Informazioni sul progetto',
@@ -28,6 +28,7 @@ export const langPt: TranslationObject = {
'timeline.done': 'Concluído',
'timeline.due': 'Pendente',
'timeline.followedby': 'Seguido por',
'timeline.standby': 'Em espera',
'project.title': 'Título',
'project.description': 'Descrição',
'project.info': 'Informações do projeto',
@@ -14,3 +14,7 @@
'table';
color: $ui-white;
}
.rundownSelect {
min-width: min(20rem, calc(100vw - 6rem));
}
@@ -4,28 +4,34 @@ import { IoApps } from 'react-icons/io5';
import IconButton from '../../common/components/buttons/IconButton';
import NavigationMenu from '../../common/components/navigation-menu/NavigationMenu';
import { EntryActionsProvider } from '../../common/context/EntryActionsContext';
import { useEntryActions } from '../../common/hooks/useEntryAction';
import { useScopedRundown } from '../../common/hooks-query/useScopedRundown';
import { useScopedEntryActions } from '../../common/hooks/useEntryAction';
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 { FOLLOW_LOADED_RUNDOWN_ID, useCuesheetRundownSelection } from './useCuesheetRundownSelection';
import styles from './CuesheetPage.module.scss';
export default function CuesheetPage() {
'use memo';
const [isMenuOpen, menuHandler] = useDisclosure();
const entryActions = useEntryActions();
const { selectedRundownId, loadedRundownId, setSelectedRundownId, projectRundowns } = useCuesheetRundownSelection();
const source = useScopedRundown(selectedRundownId === FOLLOW_LOADED_RUNDOWN_ID ? loadedRundownId : selectedRundownId);
const actions = useScopedEntryActions(source.rundownId);
useWindowTitle('Cuesheet');
const isLocked = getIsNavigationLocked();
return (
<EntryActionsProvider actions={entryActions}>
<EntryActionsProvider actions={actions}>
<NavigationMenu isOpen={isMenuOpen} onClose={menuHandler.close} />
<EntryEditModal />
<EntryEditModal rundown={source.rundown} />
<div className={styles.tableWrapper} data-testid='cuesheet'>
<CuesheetOverview>
{!isLocked && (
@@ -35,7 +41,13 @@ export default function CuesheetPage() {
)}
</CuesheetOverview>
<CuesheetProgress />
<CuesheetTableWrapper />
<CuesheetTableWrapper
source={source}
selectedRundownId={selectedRundownId}
loadedRundownId={loadedRundownId}
setSelectedRundownId={setSelectedRundownId}
projectRundowns={projectRundowns}
/>
</div>
</EntryActionsProvider>
);
@@ -1,18 +1,40 @@
import { MaybeString, ProjectRundown } from 'ontime-types';
import { memo, use, useMemo } from 'react';
import Select from '../../common/components/select/Select';
import EmptyPage from '../../common/components/state/EmptyPage';
import { PresetContext } from '../../common/context/PresetContext';
import useCustomFields from '../../common/hooks-query/useCustomFields';
import type { RundownSource } from '../../common/hooks-query/useScopedRundown';
import { AppMode } from '../../ontimeConfig';
import CuesheetDnd from './cuesheet-dnd/CuesheetDnd';
import { makeCuesheetColumns } from './cuesheet-table/cuesheet-table-elements/cuesheetColsFactory';
import CuesheetTable from './cuesheet-table/CuesheetTable';
import { useApplyCuesheetPolicy } from './useApplyCuesheetPolicy';
import { FOLLOW_LOADED_RUNDOWN_ID } from './useCuesheetRundownSelection';
import styles from './CuesheetPage.module.scss';
interface CuesheetTableWrapperProps {
source: RundownSource;
selectedRundownId: MaybeString;
loadedRundownId: string;
setSelectedRundownId: (rundownId: string) => void;
projectRundowns: ProjectRundown[];
}
export default memo(CuesheetTableWrapper);
function CuesheetTableWrapper() {
const { data: customFields, status: customFieldStatus } = useCustomFields();
function CuesheetTableWrapper({
source,
selectedRundownId,
setSelectedRundownId,
loadedRundownId,
projectRundowns,
}: CuesheetTableWrapperProps) {
const preset = use(PresetContext);
const { cuesheetMode, setCuesheetMode } = useApplyCuesheetPolicy(preset);
const isCurrentRundown = source.rundownId !== null && source.rundownId === loadedRundownId;
const { cuesheetMode, setCuesheetMode } = useApplyCuesheetPolicy(preset, { canRunMode: isCurrentRundown });
const { data: customFields, status: customFieldStatus } = useCustomFields();
const columns = useMemo(
() => makeCuesheetColumns(customFields, cuesheetMode, preset),
@@ -28,11 +50,66 @@ function CuesheetTableWrapper() {
) : (
<CuesheetTable
columns={columns}
source={source}
cuesheetMode={cuesheetMode}
tableRoot='cuesheet'
setCuesheetMode={setCuesheetMode}
isCurrentRundown={isCurrentRundown}
insertElement={
<>
<RundownSelect
cuesheetMode={cuesheetMode}
selectedRundownId={selectedRundownId}
loadedRundownId={loadedRundownId}
setSelectedRundownId={setSelectedRundownId}
projectRundowns={projectRundowns}
/>
</>
}
/>
)}
</CuesheetDnd>
);
}
interface RundownSelectProps {
cuesheetMode: AppMode;
selectedRundownId: MaybeString;
loadedRundownId: string;
setSelectedRundownId: (rundownId: string) => void;
projectRundowns: ProjectRundown[];
}
function RundownSelect({
cuesheetMode,
projectRundowns,
loadedRundownId,
selectedRundownId,
setSelectedRundownId,
}: RundownSelectProps) {
'use memo';
const options = projectRundowns.map(({ id, title }) => ({
value: id,
label: loadedRundownId === id ? `${title} (loaded)` : title,
}));
options.unshift({
value: FOLLOW_LOADED_RUNDOWN_ID,
label: 'Follow loaded', // TODO: Better wording and maybe icon? and translation
});
return (
<div className={styles.rundownSelect}>
<Select
value={selectedRundownId ?? undefined}
options={options}
onValueChange={(value) => {
if (value) {
setSelectedRundownId(value);
}
}}
disabled={cuesheetMode === AppMode.Run}
fluid
/>
</div>
);
}
@@ -20,6 +20,7 @@ describe('getCuesheetPermissionsPolicy()', () => {
alias: 'cuesheet-read-only',
target: OntimeView.Cuesheet,
search: '',
displayInNav: false,
options: {
read: 'full',
write: '-',
@@ -41,6 +42,7 @@ describe('getCuesheetPermissionsPolicy()', () => {
alias: 'cuesheet-flag',
target: OntimeView.Cuesheet,
search: '',
displayInNav: false,
options: {
read: 'full',
write: 'flag',
@@ -62,6 +64,7 @@ describe('getCuesheetPermissionsPolicy()', () => {
alias: 'cuesheet-default',
target: OntimeView.Cuesheet,
search: '',
displayInNav: false,
};
const policy = getCuesheetColumnAccessPolicy(preset, AppMode.Edit);
@@ -76,6 +79,7 @@ describe('getCuesheetPermissionsPolicy()', () => {
alias: 'cuesheet-granular',
target: OntimeView.Cuesheet,
search: '',
displayInNav: false,
options: {
read: 'cue,title',
write: 'title',
@@ -0,0 +1,25 @@
import { describe, expect, it } from 'vitest';
import { AppMode } from '../../../ontimeConfig';
import { getEffectiveCuesheetMode } from '../useApplyCuesheetPolicy';
describe('getEffectiveCuesheetMode()', () => {
it('honors the stored mode when the user can change mode on the current rundown', () => {
const permissions = { canChangeMode: true };
expect(getEffectiveCuesheetMode(permissions, AppMode.Edit, { canRunMode: true })).toBe(AppMode.Edit);
expect(getEffectiveCuesheetMode(permissions, AppMode.Run, { canRunMode: true })).toBe(AppMode.Run);
});
it('forces Run mode when the preset forbids mode changes', () => {
const permissions = { canChangeMode: false };
expect(getEffectiveCuesheetMode(permissions, AppMode.Edit, { canRunMode: true })).toBe(AppMode.Run);
});
it('forces Edit mode for background rundowns without changing the permission policy', () => {
const permissions = { canChangeMode: true };
expect(getEffectiveCuesheetMode(permissions, AppMode.Run, { canRunMode: false })).toBe(AppMode.Edit);
});
});
@@ -0,0 +1,21 @@
import {
FOLLOW_LOADED_RUNDOWN_ID,
getCuesheetRundownStorageKey,
resolveSelectedRundownId,
} from '../useCuesheetRundownSelection';
describe('useCuesheetRundownSelection helpers', () => {
it('builds a project-scoped storage key', () => {
expect(getCuesheetRundownStorageKey('http://localhost:4001', 'My Project')).toBe(
'cuesheet-selected-rundown:http://localhost:4001:My Project',
);
});
it('falls back to the follow loaded rundown when the stored selection is missing', () => {
expect(resolveSelectedRundownId('missing', new Set(['loaded', 'other']))).toBe(FOLLOW_LOADED_RUNDOWN_ID);
});
it('keeps the stored selection when it still exists in the current project', () => {
expect(resolveSelectedRundownId('other', new Set(['loaded', 'other']))).toBe('other');
});
});
@@ -1,11 +1,16 @@
import { Rundown } from 'ontime-types';
import { memo } from 'react';
import Modal from '../../../common/components/modal/Modal';
import CuesheetEntryEditor from '../../../features/rundown/entry-editor/CuesheetEventEditor';
import { useEditModal } from './useEditModal';
interface EntryEditModalProps {
rundown: Rundown;
}
export default memo(EntryEditModal);
function EntryEditModal() {
function EntryEditModal({ rundown }: EntryEditModalProps) {
const entryId = useEditModal((state) => state.selectedEntryId);
const closeModal = useEditModal((state) => state.clearSelection);
@@ -19,7 +24,7 @@ function EntryEditModal() {
onClose={closeModal}
title='Edit entry'
showCloseButton
bodyElements={<CuesheetEntryEditor entryId={entryId} />}
bodyElements={<CuesheetEntryEditor entryId={entryId} rundown={rundown} />}
/>
);
}
@@ -1,7 +1,7 @@
import { useTableNav } from '@table-nav/react';
import { ColumnDef, Table, getCoreRowModel, useReactTable } from '@tanstack/react-table';
import { OntimeEntry, TimeField, isOntimeDelay, isOntimeGroup, isOntimeMilestone } from 'ontime-types';
import { ComponentProps, memo, useCallback, useEffect, useMemo, useRef } from 'react';
import { OntimeEntry, SupportedEntry, TimeField, isOntimeDelay, isOntimeGroup, isOntimeMilestone } from 'ontime-types';
import { ComponentProps, ReactNode, memo, useCallback, useEffect, useMemo, useRef } from 'react';
import {
ContextProp,
ItemProps,
@@ -14,21 +14,20 @@ import {
import EmptyPage from '../../../common/components/state/EmptyPage';
import EmptyTableBody from '../../../common/components/state/EmptyTableBody';
import { useEntryActionsContext } from '../../../common/context/EntryActionsContext';
import { useFlatRundownWithMetadata } from '../../../common/hooks-query/useRundown';
import { useSelectedEventId } from '../../../common/hooks/useSocket';
import type { RundownSource } from '../../../common/hooks-query/useScopedRundown';
import type { ExtendedEntry } from '../../../common/utils/rundownMetadata';
import EditorTableSettings from '../../../features/rundown/rundown-table/EditorTableSettings';
import { usePersistedRundownOptions } from '../../../features/rundown/rundown.options';
import { useEventSelection } from '../../../features/rundown/useEventSelection';
import { AppMode } from '../../../ontimeConfig';
import { usePersistedCuesheetOptions } from '../cuesheet.options';
import { useCuesheetPermissions } from '../useTablePermissions';
import { CuesheetHeader, SortableCuesheetHeader } from './cuesheet-table-elements/CuesheetHeader';
import DelayRow from './cuesheet-table-elements/DelayRow';
import EventRow from './cuesheet-table-elements/EventRow';
import GroupRow from './cuesheet-table-elements/GroupRow';
import MilestoneRow from './cuesheet-table-elements/MilestoneRow';
import TableMenu from './cuesheet-table-menu/TableMenu';
import CuesheetTableSettings from './cuesheet-table-settings/CuesheetTableSettings';
import CuesheetTableHeaderToolbar from './cuesheet-table-settings/CuesheetTableHeaderToolbar';
import { useColumnOrder, useColumnSizes, useColumnVisibility } from './useColumnManager';
import style from './CuesheetTable.module.scss';
@@ -36,30 +35,41 @@ import style from './CuesheetTable.module.scss';
type CuesheetTableBaseProps = {
columns: ColumnDef<ExtendedEntry>[];
cuesheetMode: AppMode;
source: RundownSource;
insertElement?: ReactNode;
};
type EditorCuesheetTableProps = CuesheetTableBaseProps & {
tableRoot: 'editor';
setCuesheetMode?: undefined;
isCurrentRundown?: undefined;
};
type ViewCuesheetTableProps = CuesheetTableBaseProps & {
tableRoot: 'cuesheet';
setCuesheetMode: (mode: AppMode) => void;
isCurrentRundown?: boolean;
};
type CuesheetTableProps = EditorCuesheetTableProps | ViewCuesheetTableProps;
export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCuesheetMode }: CuesheetTableProps) {
const { data, status } = useFlatRundownWithMetadata();
const { updateEntry, updateTimer } = useEntryActionsContext();
export default function CuesheetTable({
columns,
cuesheetMode,
source,
tableRoot,
setCuesheetMode,
isCurrentRundown,
insertElement,
}: CuesheetTableProps) {
const { flatRundown, status, selectedEventId } = source;
const { updateEntry, updateTimer, addEntry } = useEntryActionsContext();
const canCreateEntries = useCuesheetPermissions((state) => state.canCreateEntries) && cuesheetMode === AppMode.Edit;
const useOptions = tableRoot === 'editor' ? usePersistedRundownOptions : usePersistedCuesheetOptions;
const showDelayedTimes = useOptions((state) => state.showDelayedTimes);
const hideTableSeconds = useOptions((state) => state.hideTableSeconds);
const hideIndexColumn = useOptions((state) => state.hideIndexColumn);
const optionsStore = useOptions();
const { showDelayedTimes, hideTableSeconds, hideIndexColumn } = optionsStore;
const selectedEventId = useSelectedEventId();
const cursor = useEventSelection((state) => state.cursor);
const setScrollHandler = useEventSelection((state) => state.setScrollHandler);
@@ -70,7 +80,7 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
() => ({
handleUpdate: (rowIndex: number, accessor: string, payload: string, isCustom = false) => {
// check if value is the same
const event = data[rowIndex];
const event = flatRundown[rowIndex];
if (!event) {
return;
@@ -101,7 +111,7 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
hideIndexColumn,
},
}),
[cuesheetMode, data, hideIndexColumn, hideTableSeconds, showDelayedTimes, updateEntry, updateTimer],
[cuesheetMode, flatRundown, hideIndexColumn, hideTableSeconds, showDelayedTimes, updateEntry, updateTimer],
);
const { columnOrder, resetColumnOrder } = useColumnOrder(columns, tableRoot);
@@ -109,7 +119,7 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
const { columnVisibility, setColumnVisibility } = useColumnVisibility(tableRoot);
const table = useReactTable({
data,
data: flatRundown,
columns,
columnResizeMode: 'onChange',
state: {
@@ -137,13 +147,13 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
return;
}
const eventIndex = data.findIndex((event) => event.id === selectedEventId);
const eventIndex = flatRundown.findIndex((event) => event.id === selectedEventId);
if (eventIndex === -1) {
return;
}
virtuosoRef.current.scrollToIndex({ index: eventIndex, behavior: 'auto', align: 'start', offset: -50 });
}, [cuesheetMode, data, selectedEventId]);
}, [cuesheetMode, flatRundown, selectedEventId]);
// Provide an imperative scroll handler for explicit jumps (finder/keyboard)
useEffect(() => {
@@ -152,7 +162,7 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
return;
}
const eventIndex = data.findIndex((event) => event.id === entryId);
const eventIndex = flatRundown.findIndex((event) => event.id === entryId);
if (eventIndex === -1) {
return;
}
@@ -165,7 +175,7 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
return () => {
setScrollHandler(null);
};
}, [data, setScrollHandler]);
}, [flatRundown, setScrollHandler]);
/**
* To improve performance on resizing, we memoise the column sizes
@@ -194,8 +204,9 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
listeners,
rows,
table,
handleAddNew: canCreateEntries ? (type: SupportedEntry) => addEntry({ type }) : undefined,
}),
[columnSizeVars, cursor, listeners, rows, table],
[columnSizeVars, cursor, listeners, rows, table, addEntry, canCreateEntries],
);
const computeItemKey = useCallback((_: number, item: ExtendedEntry) => item.id, []);
@@ -217,7 +228,7 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
});
}, [cuesheetMode, hideIndexColumn, table]);
const isLoading = !data || status === 'pending';
const isLoading = !flatRundown || status === 'pending';
if (isLoading) {
return <EmptyPage text='Loading...' />;
@@ -225,26 +236,27 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
return (
<>
{tableRoot === 'editor' ? (
<EditorTableSettings
columns={allLeafColumns}
handleResetResizing={resetColumnResizing}
handleResetReordering={resetColumnOrder}
handleClearToggles={setAllVisible}
/>
) : (
<CuesheetTableSettings
columns={allLeafColumns}
cuesheetMode={cuesheetMode}
setCuesheetMode={setCuesheetMode}
handleResetResizing={resetColumnResizing}
handleResetReordering={resetColumnOrder}
handleClearToggles={setAllVisible}
/>
)}
<CuesheetTableHeaderToolbar
columns={allLeafColumns}
optionsStore={optionsStore}
handleResetResizing={resetColumnResizing}
handleResetReordering={resetColumnOrder}
handleClearToggles={setAllVisible}
insertElement={insertElement}
modeControls={
tableRoot === 'cuesheet'
? {
cuesheetMode,
setCuesheetMode,
isCurrentRundown,
}
: undefined
}
showShare={tableRoot === 'cuesheet'}
/>
<TableVirtuoso
ref={virtuosoRef}
data={data}
data={flatRundown}
context={virtuosoContext}
style={tableRoot === 'editor' ? { paddingLeft: '1rem' } : undefined}
computeItemKey={computeItemKey}
@@ -264,10 +276,13 @@ interface CuesheetVirtuosoContext {
listeners: ReturnType<typeof useTableNav>['listeners'];
rows: ReturnType<Table<ExtendedEntry>['getRowModel']>['rows'];
table: Table<ExtendedEntry>;
handleAddNew?: (type: SupportedEntry) => void;
}
const EmptyPlaceholder = memo(function EmptyPlaceholder() {
return <EmptyTableBody text='No data in rundown' />;
const EmptyPlaceholder = memo(function EmptyPlaceholder({
context,
}: TableProps & ContextProp<CuesheetVirtuosoContext>) {
return <EmptyTableBody handleAddNew={context.handleAddNew} />;
});
const CuesheetTableElement = memo(function CuesheetTableElement({
@@ -49,6 +49,10 @@ function DurationInput({
setIsEditing(false);
setTimeout(() => textRef.current?.focusParentElement()); // Immediate timeout to ensure state change takes place first
};
const handleTabOut = useCallback(() => {
setIsEditing(false);
// Tab moves focus naturally; do not steal it back to parent
}, []);
const handleUpdate = useCallback(
(newValue: string) => {
@@ -95,8 +99,10 @@ function DurationInput({
ref={inputRef}
initialValue={timeString}
allowSubmitSameValue={!lockedValue} // if the value is not locked, submitting will lock the value
submitOnTab={false}
handleUpdate={handleUpdate}
handleCancelUpdate={handleFakeBlur}
handleTabCancel={handleTabOut}
/>
) : (
<TextLikeInput
@@ -30,15 +30,16 @@ function EditableImage({ initialValue, readOnly, updateValue }: EditableImagePro
}
};
if (!initialValue && readOnly) {
return null;
}
if (!initialValue) {
return (
<Input
variant='ghosted'
className={style.imageInput}
fluid
readOnly={readOnly}
// we disable the field to prevent receiving focus
disabled={readOnly}
placeholder='Paste image URL'
onBlur={(event) => handleUpdate(event.currentTarget.value)}
onKeyDown={(event) => {
@@ -1,7 +1,7 @@
import { Table, flexRender } from '@tanstack/react-table';
import { EntryId, OntimeEntry, RGBColour, SupportedEntry } from 'ontime-types';
import { colourToHex, cssOrHexToColour } from 'ontime-utils';
import { CSSProperties, useMemo } from 'react';
import { CSSProperties, memo, useMemo } from 'react';
import { IoEllipsisHorizontal } from 'react-icons/io5';
import IconButton from '../../../../common/components/buttons/IconButton';
@@ -30,7 +30,8 @@ interface EventRowProps {
hasCursor?: boolean;
}
export default function EventRow({
export default memo(EventRow);
function EventRow({
rowId,
id,
eventIndex,
@@ -55,24 +56,25 @@ export default function EventRow({
const openMenu = useCuesheetTableMenu((store) => store.openMenu);
const { color, backgroundColor } = getAccessibleColour(colour);
const tmpColour = cssOrHexToColour(color) as RGBColour; // we know this to be a correct colour
const mutedText = colourToHex({ ...tmpColour, alpha: tmpColour.alpha * 0.8 });
const { rowBgColour, backgroundColor, mutedText } = useMemo(() => {
const accessible = getAccessibleColour(colour);
const tmpColour = cssOrHexToColour(accessible.color) as RGBColour;
const rowBgColour: string | undefined = useMemo(() => {
let rowBgColour: string | undefined;
if (isLoaded) {
return '#087A27'; // $active-green
rowBgColour = '#087A27'; // $active-green
} else if (colour) {
// the colour is user defined and might be invalid
const accessibleBackgroundColor = cssOrHexToColour(getAccessibleColour(colour).backgroundColor);
if (accessibleBackgroundColor !== null) {
return colourToHex({
...accessibleBackgroundColor,
alpha: accessibleBackgroundColor.alpha * 0.25,
});
const accessibleBg = cssOrHexToColour(accessible.backgroundColor);
if (accessibleBg !== null) {
rowBgColour = colourToHex({ ...accessibleBg, alpha: accessibleBg.alpha * 0.25 });
}
}
return;
return {
rowBgColour,
backgroundColor: accessible.backgroundColor,
mutedText: colourToHex({ ...tmpColour, alpha: tmpColour.alpha * 0.8 }),
};
}, [colour, isLoaded]);
return (
@@ -1,6 +1,6 @@
import { Table, flexRender } from '@tanstack/react-table';
import { EntryId, SupportedEntry } from 'ontime-types';
import { CSSProperties } from 'react';
import { CSSProperties, memo } from 'react';
import { IoEllipsisHorizontal } from 'react-icons/io5';
import IconButton from '../../../../common/components/buttons/IconButton';
@@ -20,7 +20,8 @@ interface GroupRowProps {
hasCursor?: boolean;
}
export default function GroupRow({
export default memo(GroupRow);
function GroupRow({
groupId,
colour,
rowId,
@@ -1,7 +1,7 @@
import { Table, flexRender } from '@tanstack/react-table';
import { EntryId, SupportedEntry } from 'ontime-types';
import { colourToHex, cssOrHexToColour } from 'ontime-utils';
import { CSSProperties } from 'react';
import { CSSProperties, memo, useMemo } from 'react';
import { IoEllipsisHorizontal } from 'react-icons/io5';
import IconButton from '../../../../common/components/buttons/IconButton';
@@ -25,7 +25,8 @@ interface MilestoneRowProps {
hasCursor?: boolean;
}
export default function MilestoneRow({
export default memo(MilestoneRow);
function MilestoneRow({
entryId,
isPast,
parentBgColour,
@@ -45,17 +46,12 @@ export default function MilestoneRow({
const openMenu = useCuesheetTableMenu((store) => store.openMenu);
let rowBgColour: string | undefined;
if (colour) {
// the colour is user defined and might be invalid
const accessibleBackgroundColor = cssOrHexToColour(getAccessibleColour(colour).backgroundColor);
if (accessibleBackgroundColor !== null) {
rowBgColour = colourToHex({
...accessibleBackgroundColor,
alpha: accessibleBackgroundColor.alpha * 0.25,
});
}
}
const rowBgColour = useMemo(() => {
if (!colour) return undefined;
const accessibleBg = cssOrHexToColour(getAccessibleColour(colour).backgroundColor);
if (accessibleBg === null) return undefined;
return colourToHex({ ...accessibleBg, alpha: accessibleBg.alpha * 0.25 });
}, [colour]);
return (
<tr
@@ -8,13 +8,24 @@ interface SingleLineCellProps {
fieldId?: string;
fieldLabel?: string;
allowSubmitSameValue?: boolean;
submitOnTab?: boolean;
handleUpdate: (newValue: string) => void;
handleCancelUpdate?: () => void;
handleTabCancel?: () => void;
}
const SingleLineCell = forwardRef(
(
{ initialValue, fieldId, fieldLabel, allowSubmitSameValue, handleUpdate, handleCancelUpdate }: SingleLineCellProps,
{
initialValue,
fieldId,
fieldLabel,
allowSubmitSameValue,
submitOnTab,
handleUpdate,
handleCancelUpdate,
handleTabCancel,
}: SingleLineCellProps,
inputRef,
) => {
const ref = useRef<HTMLInputElement | null>(null);
@@ -25,7 +36,9 @@ const SingleLineCell = forwardRef(
allowKeyboardNavigation: true,
submitOnEnter: true, // single line should submit on enter
submitOnCtrlEnter: true,
submitOnTab,
onCancelUpdate: handleCancelUpdate,
onTabCancel: handleTabCancel,
});
// expose a subset of the methods to the parent
@@ -50,6 +50,10 @@ function TimeInputDuration({
setIsEditing(false);
setTimeout(() => textRef.current?.focusParentElement()); // Immediate timeout to ensure state change takes place first
};
const handleTabOut = useCallback(() => {
setIsEditing(false);
// Tab moves focus naturally; do not steal it back to parent
}, []);
const handleUpdate = useCallback(
(newValue: string) => {
@@ -96,8 +100,10 @@ function TimeInputDuration({
ref={inputRef}
initialValue={timeString}
allowSubmitSameValue={!lockedValue} // if the value is not locked, submitting will lock the value
submitOnTab={false}
handleUpdate={handleUpdate}
handleCancelUpdate={handleFakeBlur}
handleTabCancel={handleTabOut}
/>
) : (
<TextLikeInput
@@ -11,78 +11,92 @@ import Checkbox from '../../../../common/components/checkbox/Checkbox';
import * as Editor from '../../../../common/components/editor-utils/EditorUtils';
import PopoverContents from '../../../../common/components/popover/Popover';
import type { ExtendedEntry } from '../../../../common/utils/rundownMetadata';
import { cx } from '../../../../common/utils/styleUtils';
import { AppMode } from '../../../../ontimeConfig';
import { CuesheetOptions, usePersistedCuesheetOptions } from '../../cuesheet.options';
import { useCuesheetPermissions } from '../../useTablePermissions';
import CuesheetShareModal from './CuesheetShareModal';
import style from './CuesheetTableSettings.module.scss';
interface CuesheetTableSettingsProps {
columns: Column<ExtendedEntry, unknown>[];
type TableHeaderOptionsStore = {
hideTableSeconds: boolean;
hideIndexColumn: boolean;
showDelayedTimes: boolean;
hideDelays: boolean;
setOption: <K extends keyof TableHeaderOptionValues>(key: K, value: TableHeaderOptionValues[K]) => void;
};
type TableHeaderOptionValues = Pick<
TableHeaderOptionsStore,
'hideTableSeconds' | 'hideIndexColumn' | 'showDelayedTimes' | 'hideDelays'
>;
type TableModeControls = {
cuesheetMode: AppMode;
setCuesheetMode: (mode: AppMode) => void;
handleResetResizing: () => void;
handleResetReordering: () => void;
handleClearToggles: () => void;
}
isCurrentRundown?: boolean;
};
export interface ViewSettingsProps {
optionsStore: CuesheetOptions;
}
export interface ColumnSettingsProps {
interface CuesheetTableHeaderToolbarProps {
columns: Column<ExtendedEntry, unknown>[];
optionsStore: TableHeaderOptionsStore;
handleResetResizing: () => void;
handleResetReordering: () => void;
handleClearToggles: () => void;
insertElement?: ReactNode;
modeControls?: TableModeControls;
showShare?: boolean;
}
export default function CuesheetTableSettings({
export default function CuesheetTableHeaderToolbar({
columns,
cuesheetMode,
setCuesheetMode,
optionsStore,
handleResetResizing,
handleResetReordering,
handleClearToggles,
}: CuesheetTableSettingsProps) {
insertElement,
modeControls,
showShare = false,
}: CuesheetTableHeaderToolbarProps) {
const canChangeMode = useCuesheetPermissions((state) => state.canChangeMode);
const canShare = useCuesheetPermissions((state) => state.canShare);
const options = usePersistedCuesheetOptions();
const toggleCuesheetMode = (mode: AppMode[]) => {
// we need to stop user from deselecting a mode
const newValue = mode.at(0);
if (!newValue) return;
setCuesheetMode(newValue);
if (!newValue || !modeControls) return;
modeControls.setCuesheetMode(newValue);
};
const isBackground = !(modeControls?.isCurrentRundown ?? true);
return (
<Toolbar.Root className={style.tableSettings}>
<ViewSettings optionsStore={options} />
<Toolbar.Root className={style.tableSettings} data-background-rundown={isBackground}>
<ViewSettings optionsStore={optionsStore} />
<ColumnSettings
columns={columns}
handleResetResizing={handleResetResizing}
handleResetReordering={handleResetReordering}
handleClearToggles={handleClearToggles}
/>
{canChangeMode && (
<ToggleGroup
value={[cuesheetMode]}
onValueChange={toggleCuesheetMode}
className={cx([style.group, style.apart])}
>
<Toolbar.Button render={<Toggle />} value={AppMode.Run} className={style.radioButton}>
Run
</Toolbar.Button>
<Toolbar.Button render={<Toggle />} value={AppMode.Edit} className={style.radioButton}>
Edit
</Toolbar.Button>
</ToggleGroup>
{modeControls && canChangeMode && (
<div className={style.apart}>
{insertElement}
<ToggleGroup
value={[modeControls.cuesheetMode]}
onValueChange={toggleCuesheetMode}
className={style.group}
disabled={!modeControls.isCurrentRundown}
>
<Toolbar.Button render={<Toggle />} value={AppMode.Run} className={style.radioButton}>
Run
</Toolbar.Button>
<Toolbar.Button render={<Toggle />} value={AppMode.Edit} className={style.radioButton}>
Edit
</Toolbar.Button>
</ToggleGroup>
</div>
)}
{canShare && (
{showShare && canShare && (
<>
<Editor.Separator orientation='vertical' />
<CuesheetShareModal />
@@ -92,9 +106,18 @@ export default function CuesheetTableSettings({
);
}
export function ViewSettings({ optionsStore }: ViewSettingsProps) {
const options = optionsStore;
interface ViewSettingsProps {
optionsStore: TableHeaderOptionsStore;
}
interface ColumnSettingsProps {
columns: Column<ExtendedEntry, unknown>[];
handleResetResizing: () => void;
handleResetReordering: () => void;
handleClearToggles: () => void;
}
function ViewSettings({ optionsStore }: ViewSettingsProps) {
return (
<Popover.Root>
<Popover.Trigger
@@ -115,15 +138,15 @@ export function ViewSettings({ optionsStore }: ViewSettingsProps) {
<Editor.Label className={style.sectionTitle}>Element visibility</Editor.Label>
<Editor.Label className={style.option}>
<Checkbox
defaultChecked={options.hideTableSeconds}
onCheckedChange={(checked) => options.setOption('hideTableSeconds', checked)}
defaultChecked={optionsStore.hideTableSeconds}
onCheckedChange={(checked) => optionsStore.setOption('hideTableSeconds', checked)}
/>
Hide seconds in table
</Editor.Label>
<Editor.Label className={style.option}>
<Checkbox
defaultChecked={options.hideIndexColumn}
onCheckedChange={(checked) => options.setOption('hideIndexColumn', checked)}
defaultChecked={optionsStore.hideIndexColumn}
onCheckedChange={(checked) => optionsStore.setOption('hideIndexColumn', checked)}
/>
Hide index column
</Editor.Label>
@@ -133,15 +156,15 @@ export function ViewSettings({ optionsStore }: ViewSettingsProps) {
<Editor.Label className={style.sectionTitle}>Table Behaviour</Editor.Label>
<Editor.Label className={style.option}>
<Checkbox
defaultChecked={options.showDelayedTimes}
onCheckedChange={(checked) => options.setOption('showDelayedTimes', checked)}
defaultChecked={optionsStore.showDelayedTimes}
onCheckedChange={(checked) => optionsStore.setOption('showDelayedTimes', checked)}
/>
Show delayed times
</Editor.Label>
<Editor.Label className={style.option}>
<Checkbox
defaultChecked={options.hideDelays}
onCheckedChange={(checked) => options.setOption('hideDelays', checked)}
defaultChecked={optionsStore.hideDelays}
onCheckedChange={(checked) => optionsStore.setOption('hideDelays', checked)}
/>
Hide delay entries
</Editor.Label>
@@ -151,7 +174,7 @@ export function ViewSettings({ optionsStore }: ViewSettingsProps) {
);
}
export function ColumnSettings({
function ColumnSettings({
columns,
handleResetResizing,
handleResetReordering,
@@ -177,6 +200,7 @@ export function ColumnSettings({
{columns.map((column) => {
const columnHeader = column.columnDef.header;
const visible = column.getIsVisible();
return (
<Editor.Label key={`${column.id}-${visible}`} className={style.option}>
<Checkbox defaultChecked={visible} onCheckedChange={column.toggleVisibility} />
@@ -8,6 +8,24 @@
gap: 1rem;
font-size: $inner-section-text-size;
border-radius: 3px 3px 0 0;
transition: background-color 0.2s ease-in-out;
&[data-background-rundown='true'] {
background-color: rgba($ontime-color, 0.5);
.apart::before {
content: 'BACKGROUND EDIT';
color: $ui-white;
animation: blinker 2s ease-in-out infinite;
}
}
}
@keyframes blinker {
50% {
color: transparent;
}
}
.sectionTitle {
@@ -43,6 +61,9 @@
.apart {
margin-left: auto;
display: flex;
align-items: center;
gap: 1rem;
}
/** styles should match RundownHeader.module.scss */
@@ -70,12 +91,17 @@
font-size: calc(1rem - 2px);
font-weight: 600;
&[data-disabled] {
cursor: not-allowed;
opacity: 0.4;
}
&:focus-visible {
background: transparent;
outline: 1px solid $blue-500;
}
&:hover:not(:disabled):not(:active) {
&:hover:not([data-disabled]):not(:active) {
background: $gray-1000;
}
@@ -87,7 +113,7 @@
background: $blue-700;
color: $ui-white;
&:hover:not(:disabled):not(:active) {
&:hover:not([data-disabled]):not(:active) {
background: $blue-600;
}
}
@@ -5,12 +5,33 @@ import { useCallback, useEffect, useMemo } from 'react';
import { sessionScope } from '../../externals';
import { AppMode, sessionKeys } from '../../ontimeConfig';
import { getCuesheetPermissionsPolicy } from './cuesheet.policies';
import type { CuesheetPermissions } from './useTablePermissions';
import { useCuesheetPermissions } from './useTablePermissions';
type CuesheetPolicyOptions = {
// Run mode is only meaningful for the loaded rundown — background rundowns force Edit.
canRunMode: boolean;
};
export function getEffectiveCuesheetMode(
permissions: Pick<CuesheetPermissions, 'canChangeMode'>,
storedMode: AppMode,
{ canRunMode }: CuesheetPolicyOptions,
) {
if (!permissions.canChangeMode) {
return AppMode.Run;
}
return canRunMode ? storedMode : AppMode.Edit;
}
/**
* Applies cuesheet permissions to shared state and exposes the effective mode for the UI.
*/
export function useApplyCuesheetPolicy(preset: URLPreset | undefined): {
export function useApplyCuesheetPolicy(
preset: URLPreset | undefined,
{ canRunMode }: CuesheetPolicyOptions,
): {
cuesheetMode: AppMode;
setCuesheetMode: (mode: AppMode) => void;
} {
@@ -26,16 +47,14 @@ export function useApplyCuesheetPolicy(preset: URLPreset | undefined): {
defaultValue: preset ? AppMode.Run : AppMode.Edit,
});
const cuesheetMode = permissions.canChangeMode ? storedCuesheetMode : AppMode.Run;
const cuesheetMode = getEffectiveCuesheetMode(permissions, storedCuesheetMode, { canRunMode });
const setCuesheetMode = useCallback(
(mode: AppMode) => {
if (!permissions.canChangeMode) {
return;
}
if (!permissions.canChangeMode || !canRunMode) return;
setStoredCuesheetMode(mode);
},
[permissions.canChangeMode, setStoredCuesheetMode],
[canRunMode, permissions.canChangeMode, setStoredCuesheetMode],
);
// Keep the shared permissions store aligned with the active preset policy.
@@ -0,0 +1,65 @@
import { useSessionStorage } from '@mantine/hooks';
import { startTransition, useCallback, useMemo } from 'react';
import { useNavigate } from 'react-router';
import { useOrderedProjectList } from '../../common/hooks-query/useProjectList';
import { useProjectRundowns } from '../../common/hooks-query/useProjectRundowns';
import { serverURL } from '../../externals';
export const FOLLOW_LOADED_RUNDOWN_ID = '__follow-loaded__' as const;
export function getCuesheetRundownStorageKey(server: string, projectFilename: string) {
return `cuesheet-selected-rundown:${server}:${projectFilename}`;
}
export function resolveSelectedRundownId(storedSelectedRundownId: string | null, availableRundownIds: Set<string>) {
if (storedSelectedRundownId && availableRundownIds.has(storedSelectedRundownId)) return storedSelectedRundownId;
return FOLLOW_LOADED_RUNDOWN_ID;
}
export function useCuesheetRundownSelection() {
'use memo';
const { data: projectRundowns } = useProjectRundowns();
const {
data: { lastLoadedProject },
} = useOrderedProjectList();
const storageKey = useMemo(() => getCuesheetRundownStorageKey(serverURL, lastLoadedProject), [lastLoadedProject]);
const [storedSelectedRundownId, setStoredSelectedRundownId] = useSessionStorage<string | null>({
key: storageKey,
defaultValue: FOLLOW_LOADED_RUNDOWN_ID,
});
const availableRundownIds = new Set(projectRundowns.rundowns.map(({ id }) => id)).add(FOLLOW_LOADED_RUNDOWN_ID);
const { loaded: loadedRundownId } = projectRundowns;
const selectedRundownId = resolveSelectedRundownId(storedSelectedRundownId, availableRundownIds);
return {
loadedRundownId,
selectedRundownId,
projectRundowns: projectRundowns.rundowns,
setSelectedRundownId: (rundownId: string) => {
startTransition(() => {
setStoredSelectedRundownId(rundownId);
});
},
};
}
export function useDirectLinkToBackgroundEdit() {
const {
data: { lastLoadedProject },
} = useOrderedProjectList();
const navigate = useNavigate();
const storageKey = getCuesheetRundownStorageKey(serverURL, lastLoadedProject);
const [_, setStoredSelectedRundownId] = useSessionStorage<string | null>({ key: storageKey, defaultValue: null });
return useCallback(
async (rundownId: string) => {
await navigate('/cuesheet');
startTransition(() => setStoredSelectedRundownId(rundownId));
},
[setStoredSelectedRundownId, navigate],
);
}
@@ -45,6 +45,9 @@ $studio-idle: $red-1300;
top: 0;
top: 50%;
left: 50%;
margin-top: -0.5rem;
margin-left: -0.5rem;
}
.tick--active {
@@ -1,6 +1,8 @@
@use '@/theme/viewerDefs' as *;
$timeline-height: 1rem;
$group-band-height: 0.5rem;
$group-band-gap: 0.25rem;
$timeline-color: color-mix(in srgb, transparent 60%, var(--background-color-override, $viewer-background-color));
.timelineContainer {
@@ -17,7 +19,21 @@ $timeline-color: color-mix(in srgb, transparent 60%, var(--background-color-over
position: relative;
font-weight: 600;
height: 100%;
box-shadow: inset 0 1rem 0 0 var(--card-background-color-override, $viewer-card-bg-color);
// reserve the top region (progress bar + gap + group band) with the card background
box-shadow: inset 0 calc(#{$timeline-height} + #{$group-band-gap} + #{$group-band-height}) 0 0
var(--card-background-color-override, $viewer-card-bg-color);
}
.groupBand {
height: $group-band-height;
margin-top: $group-band-gap;
width: 100%;
background: var(--group-colour, transparent);
display: flex;
align-items: center;
position: relative;
z-index: 2;
overflow: visible;
}
.column {
@@ -92,7 +108,6 @@ $timeline-color: color-mix(in srgb, transparent 60%, var(--background-color-over
border-top: 2px solid var(--background-color-override, $viewer-background-color);
box-shadow: 0 0.25rem 0 0 var(--color, $gray-300);
text-transform: capitalize;
white-space: normal;
&[data-status='done'] {
@@ -119,6 +134,7 @@ $timeline-color: color-mix(in srgb, transparent 60%, var(--background-color-over
.status {
width: fit-content;
text-transform: uppercase;
}
.status.due {
+1 -4
View File
@@ -55,10 +55,6 @@ function Timeline({ firstStart, rundown, selectedEventId, totalDuration }: Timel
return calculateTimelineLayout(playableEvents, scheduleStart, scheduleEnd, screenWidth, !fixedSize);
}, [rundown, scheduleStart, scheduleEnd, screenWidth, fixedSize]);
if (totalDuration === 0) {
return null;
}
// Pre-calculate event statuses
let currentStatus: ProgressStatus = selectedEventId ? 'done' : 'future';
const statusMap: Record<string, ProgressStatus> = {};
@@ -105,6 +101,7 @@ function Timeline({ firstStart, rundown, selectedEventId, totalDuration }: Timel
title={displayTitle}
cue={event.cue}
width={position.width}
groupColour={event.groupColour}
/>
);
})}
@@ -26,6 +26,7 @@ interface TimelineEntryProps {
title: string;
width: number;
cue: string;
groupColour?: string;
ref?: RefObject<HTMLDivElement | null>;
}
@@ -48,6 +49,7 @@ export function TimelineEntry({
title,
width,
cue,
groupColour,
ref,
}: TimelineEntryProps) {
const formattedStartTime = formatTime(start, formatOptions);
@@ -67,6 +69,7 @@ export function TimelineEntry({
{
'--color': colour,
'--lighter': lighterColour ?? '',
'--group-colour': groupColour ?? 'transparent',
left: `${left}px`,
width: `${width}px`,
} as CSSProperties
@@ -74,6 +77,7 @@ export function TimelineEntry({
data-testid={cue}
>
{status === 'live' ? <ActiveBlock /> : <div data-status={status} className={style.timelineBlock} />}
<div className={style.groupBand} />
<div
className={cx([style.content, width < 20 && style.hide, !hasLink && style.separeLeft])}
data-status={status}
@@ -153,6 +157,8 @@ function TimelineEntryStatus({
statusText = getLocalizedString('timeline.live');
} else if (statusText === 'pending') {
statusText = getLocalizedString('timeline.due');
} else if (statusText === 'done') {
statusText = getLocalizedString('timeline.done');
}
const isDue = status === 'future' && timeToStart <= 0;
@@ -38,6 +38,8 @@ export default function TimelinePageLoader() {
function TimelinePage({ events, customFields, projectData, settings }: TimelineData) {
const selectedEventId = useSelectedEventId();
const { mainSource, timeformat } = useTimelineOptions();
const { getLocalizedString } = useTranslation();
// holds copy of the rundown with only relevant events
const { scopedRundown, firstStart, totalDuration } = useScopedRundown(events, selectedEventId);
@@ -50,6 +52,8 @@ function TimelinePage({ events, customFields, projectData, settings }: TimelineD
const defaultFormat = getDefaultFormat(settings?.timeFormat);
const progressOptions = useMemo(() => getTimelineOptions(defaultFormat, customFields), [defaultFormat, customFields]);
const hasContent = totalDuration > 0;
return (
<div className='timeline' data-testid='timeline-view'>
<ViewParamsEditor target={OntimeView.Timeline} viewOptions={progressOptions} />
@@ -61,12 +65,16 @@ function TimelinePage({ events, customFields, projectData, settings }: TimelineD
<TimelineSections now={now} next={next} followedBy={followedBy} mainSource={mainSource} />
<Timeline
firstStart={firstStart}
rundown={scopedRundown}
selectedEventId={selectedEventId}
totalDuration={totalDuration}
/>
{hasContent ? (
<Timeline
firstStart={firstStart}
rundown={scopedRundown}
selectedEventId={selectedEventId}
totalDuration={totalDuration}
/>
) : (
<EmptyPage text={getLocalizedString('common.no_data')} />
)}
</div>
);
}
@@ -20,7 +20,7 @@ export default function TimelineSections({ now, next, followedBy, mainSource }:
const state = useExpectedStartData();
// gather card data
const titleNow = getPropertyValue(now, mainSource ?? 'title') ?? '-';
const titleNow = now ? (getPropertyValue(now, mainSource ?? 'title') ?? '-') : getLocalizedString('timeline.standby');
const dueText = getLocalizedString('timeline.due').toUpperCase();
const nextText = getPropertyValue(next, mainSource ?? 'title') ?? '-';
const followedByText = getPropertyValue(followedBy, mainSource ?? 'title') ?? '-';
@@ -96,63 +96,77 @@ export function useScopedRundown(
): ScopedRundownData {
const { hidePast } = useTimelineOptions();
const data = useMemo(() => {
if (rundown.length === 0) {
return { scopedRundown: [], firstStart: 0, totalDuration: 0 };
}
const scopedRundown: ExtendedEntry<PlayableEvent>[] = [];
let selectedIndex = selectedEventId ? Infinity : -1;
let firstStart = null;
let totalDuration = 0;
let lastEntry: ExtendedEntry<PlayableEvent> | null = null;
for (let i = 0; i < rundown.length; i++) {
const currentEntry = rundown[i];
// we only deal with playableEvents
if (isOntimeEvent(currentEntry) && isPlayableEvent(currentEntry)) {
if (currentEntry.id === selectedEventId) {
selectedIndex = i;
}
// maybe filter past
if (hidePast && i < selectedIndex) {
continue;
}
// add to scopedRundown
scopedRundown.push(currentEntry);
/**
* Derive timers
* This logic is partially from rundownCache.generate
* With the addition of deriving the current day offset
*/
if (firstStart === null) {
firstStart = currentEntry.timeStart;
}
const timeFromPrevious: number = getTimeFrom(currentEntry, lastEntry);
if (timeFromPrevious === 0) {
totalDuration += currentEntry.duration;
} else if (timeFromPrevious > 0) {
totalDuration += timeFromPrevious + currentEntry.duration;
} else if (timeFromPrevious < 0) {
totalDuration += Math.max(currentEntry.duration + timeFromPrevious, 0);
}
if (isNewLatest(currentEntry, lastEntry)) {
lastEntry = currentEntry;
}
}
}
return { scopedRundown, firstStart: firstStart ?? 0, totalDuration };
}, [hidePast, rundown, selectedEventId]);
const data = useMemo(
() => computeScopedRundown(rundown, selectedEventId, hidePast),
[hidePast, rundown, selectedEventId],
);
return data;
}
/**
* Pure computation behind useScopedRundown: filters to playable events and derives timers
*/
export function computeScopedRundown(
rundown: ExtendedEntry<OntimeEntry>[],
selectedEventId: MaybeString,
hidePast: boolean,
): ScopedRundownData {
if (rundown.length === 0) {
return { scopedRundown: [], firstStart: 0, totalDuration: 0 };
}
const scopedRundown: ExtendedEntry<PlayableEvent>[] = [];
let selectedIndex = selectedEventId ? Infinity : -1;
let firstStart: number | null = null;
let totalDuration = 0;
let lastEntry: ExtendedEntry<PlayableEvent> | null = null;
for (let i = 0; i < rundown.length; i++) {
// we only deal with playableEvents
const currentEntry = rundown[i];
if (!isOntimeEvent(currentEntry) || !isPlayableEvent(currentEntry)) {
continue;
}
if (currentEntry.id === selectedEventId) {
selectedIndex = i;
}
// maybe filter past
if (hidePast && i < selectedIndex) {
continue;
}
// add to scopedRundown
scopedRundown.push(currentEntry);
/**
* Derive timers
* This logic is partially from rundownCache.generate
* With the addition of deriving the current day offset
*/
if (firstStart === null) {
firstStart = currentEntry.timeStart;
}
const timeFromPrevious: number = getTimeFrom(currentEntry, lastEntry);
if (timeFromPrevious === 0) {
totalDuration += currentEntry.duration;
} else if (timeFromPrevious > 0) {
totalDuration += timeFromPrevious + currentEntry.duration;
} else if (timeFromPrevious < 0) {
totalDuration += Math.max(currentEntry.duration + timeFromPrevious, 0);
}
if (isNewLatest(currentEntry, lastEntry)) {
lastEntry = currentEntry;
}
}
return { scopedRundown, firstStart: firstStart ?? 0, totalDuration };
}
type UpcomingEvents = {
now: ExtendedEntry<OntimeEvent> | null;
next: ExtendedEntry<OntimeEvent> | null;
+1 -1
View File
@@ -87,7 +87,7 @@ export default defineConfig({
},
test: {
globals: true,
environment: 'jsdom',
dom: true,
},
build: {
outDir: './build',
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "ontime-electron",
"version": "4.8.0",
"version": "4.10.0",
"author": "Carlos Valente",
"description": "Time keeping for live events",
"repository": "https://github.com/cpvalente/ontime",
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@getontime/resolver",
"version": "4.8.0",
"version": "4.10.0",
"type": "module",
"repository": "https://github.com/cpvalente/ontime",
"types": "./dist/main.d.ts",
+10 -11
View File
@@ -2,21 +2,22 @@
"name": "ontime-server",
"type": "module",
"main": "src/index.ts",
"version": "4.8.0",
"version": "4.10.0",
"exports": "./src/index.js",
"dependencies": {
"@googleapis/sheets": "^5.0.5",
"@modelcontextprotocol/sdk": "^1.15.0",
"cookie": "1.0.2",
"cookie-parser": "1.4.7",
"cors": "2.8.5",
"cors": "2.8.6",
"dotenv": "^16.0.1",
"express": "5.1.0",
"express-static-gzip": "3.0.0",
"express-validator": "7.2.1",
"fast-equals": "^5.0.1",
"express": "5.2.1",
"express-static-gzip": "3.0.1",
"express-validator": "7.3.2",
"fast-equals": "^6.0.0",
"google-auth-library": "^9.4.2",
"lowdb": "^7.0.1",
"multer": "2.1.0",
"multer": "2.2.0",
"ontime-utils": "workspace:*",
"osc-min": "2.1.2",
"sanitize-filename": "^1.6.3",
@@ -24,17 +25,15 @@
"xlsx": "^0.18.5"
},
"devDependencies": {
"@types/cookie-parser": "1.4.9",
"@types/cookie-parser": "1.4.10",
"@types/cors": "2.8.19",
"@types/express": "5.0.3",
"@types/express": "5.0.6",
"@types/multer": "2.1.0",
"@types/node": "catalog:",
"@types/websocket": "^1.0.5",
"@types/ws": "^8.5.10",
"esbuild": "^0.24.0",
"ontime-types": "workspace:*",
"server-timing": "^3.3.3",
"shx": "^0.3.4",
"ts-essentials": "catalog:",
"tsx": "^4.19.2",
"typescript": "catalog:",
+2 -2
View File
@@ -262,6 +262,6 @@ export const socket = new SocketServer();
/**
* Utility function to notify clients that the REST data is stale
*/
export function sendRefetch(target: RefetchKey, revision: MaybeNumber = null) {
socket.sendAsJson(MessageTag.Refetch, { target, revision });
export function sendRefetch(target: RefetchKey, revision: MaybeNumber = null, rundownId?: string) {
socket.sendAsJson(MessageTag.Refetch, { target, revision, rundownId });
}
@@ -110,14 +110,13 @@ type old_URLPreset = {
/**
* migrates a url presets from v3 to v4
* - pathAndParams split into a target and search
*
*/
export function migrateURLPresets(jsonData: object): URLPreset[] | undefined {
if (is.objectWithKeys(jsonData, ['urlPresets']) && is.array(jsonData.urlPresets)) {
const oldURLPresets = structuredClone(jsonData.urlPresets) as old_URLPreset;
const newURLPreset: URLPreset[] = oldURLPresets.map(({ enabled, alias, pathAndParams }) => {
const [target, search] = pathAndParams.split('?');
return { enabled, alias, target, search, options: {} } as URLPreset;
return { enabled, alias, target, search, displayInNav: false, options: {} } as URLPreset;
});
return newURLPreset;
}
@@ -208,6 +208,7 @@ describe('v3 to v4', () => {
target: OntimeView.Timer,
search:
'showLeadingZeros=true&timerType=clock&hideClock=true&hideCards=true&hideProgress=true&hideMessage=true&hideSecondary=true&hideLogo=true',
displayInNav: false,
options: {},
},
{
@@ -216,6 +217,7 @@ describe('v3 to v4', () => {
target: OntimeView.Timer,
search:
'showLeadingZeros=true&hideClock=true&hideCards=true&hideProgress=true&hideMessage=true&hideSecondary=true&hideLogo=true',
displayInNav: false,
options: {},
},
];
@@ -1,11 +1,13 @@
import {
CustomField,
EntryId,
OntimeDelay,
OntimeEvent,
OntimeGroup,
OntimeMilestone,
Rundown,
SupportedEntry,
isOntimeGroup,
} from 'ontime-types';
import { makeNewRundown } from '../../../models/dataModel.js';
@@ -59,13 +61,24 @@ export function makeOntimeMilestone(patch: Partial<OntimeMilestone>): OntimeMile
}
/**
* Utility to create a rundown object
* Utility to create a rundown object.
* Derives flatOrder from order/entries when the patch does not provide one,
* so test fixtures match the shape of a processed rundown.
*/
export function makeRundown(patch: Partial<Rundown>): Rundown {
return {
...makeNewRundown(),
...patch,
};
const rundown = { ...makeNewRundown(), ...patch };
if (!patch.flatOrder) {
const flatOrder: EntryId[] = [];
for (const id of rundown.order) {
flatOrder.push(id);
const entry = rundown.entries[id];
if (isOntimeGroup(entry)) {
flatOrder.push(...entry.entries);
}
}
rundown.flatOrder = flatOrder;
}
return rundown;
}
export function makeCustomField(patch: Partial<CustomField>): CustomField {
@@ -63,7 +63,7 @@ describe('createTransaction', () => {
expect(typeof commit).toBe('function');
});
it('should return the updated data after commit is called and writes are scheduled', () => {
it('should return the updated data after commit is called and writes are scheduled', async () => {
const { rundown, customFields, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: true });
rundown.title = 'Another Title';
customFields['newField'] = {
@@ -72,8 +72,7 @@ describe('createTransaction', () => {
colour: 'blue',
};
const updated = commit();
vi.runAllTimers();
const updated = await commit();
expect(updated.rundown.title).toBe('Another Title');
expect(updated.customFields).toHaveProperty('newField');
@@ -132,6 +131,23 @@ describe('processRundown()', () => {
expect(initResult.entries['3'].type).toBe(SupportedEntry.Delay);
});
it('produces order, flatOrder and applies delays to following events', () => {
const rundown = makeRundown({
order: ['1', 'delay', '2'],
entries: {
'1': makeOntimeEvent({ id: '1', timeStart: 0, timeEnd: 1000, duration: 1000 }),
delay: makeOntimeDelay({ id: 'delay', duration: 250 }),
'2': makeOntimeEvent({ id: '2', timeStart: 1000, timeEnd: 2000, duration: 1000 }),
},
});
const processed = processRundown(rundown, {});
expect(processed.order).toEqual(['1', 'delay', '2']);
expect(processed.flatEntryOrder).toEqual(['1', 'delay', '2']);
expect((processed.entries['2'] as OntimeEvent).delay).toBe(250);
});
it('calculates delays versions of a given rundown', () => {
const rundown = makeRundown({
order: ['1', '2'],
@@ -1622,6 +1638,34 @@ describe('rundownMutation.applyDelay()', () => {
},
});
});
it('uses the passed rundown own order, not the loaded rundown metadata', () => {
// The loaded rundown has completely different events
const loadedRundown = makeRundown({
order: ['loaded-delay', 'loaded-ev'],
entries: {
'loaded-delay': makeOntimeDelay({ id: 'loaded-delay', duration: 9999 }),
'loaded-ev': makeOntimeEvent({ id: 'loaded-ev', timeStart: 0, timeEnd: 100, duration: 100 }),
},
});
rundownCache.init(loadedRundown, {});
// Background rundown is independent of the loaded one
const bgRundown = makeRundown({
order: ['bg-delay', 'bg-ev'],
entries: {
'bg-delay': makeOntimeDelay({ id: 'bg-delay', duration: 500 }),
'bg-ev': makeOntimeEvent({ id: 'bg-ev', timeStart: 0, timeEnd: 200, duration: 200 }),
},
});
rundownMutation.applyDelay(bgRundown, bgRundown.entries['bg-delay'] as OntimeDelay);
// bg-ev must be shifted by its own delay (500), not influenced by the loaded rundown
expect((bgRundown.entries['bg-ev'] as OntimeEvent).timeStart).toBe(500);
// loaded-ev must be untouched
expect((loadedRundown.entries['loaded-ev'] as OntimeEvent).timeStart).toBe(0);
});
});
describe('rundownMutation.swap()', () => {
@@ -2,13 +2,11 @@ import { EndAction, OntimeEvent, TimeStrategy, TimerType } from 'ontime-types';
import { MILLIS_PER_HOUR, createEvent } from 'ontime-utils';
import { assertType } from 'vitest';
import { demoDb } from '../../../models/demoProject.js';
import { makeOntimeEvent, makeOntimeGroup, makeRundown } from '../__mocks__/rundown.mocks.js';
import {
calculateDayOffset,
deleteById,
doesInvalidateMetadata,
duplicateRundown,
getIntegerAndFraction,
hasChanges,
makeDeepClone,
@@ -223,25 +221,6 @@ describe('calculateDayOffset()', () => {
});
});
describe('duplicateRundown', () => {
it('duplicates a given rundown', () => {
const demoRundown = demoDb.rundowns['default'];
const title = 'Duplicated Rundown';
const duplicatedRundown = duplicateRundown(demoRundown, title);
expect(duplicatedRundown).toMatchObject({
title: title,
entries: expect.any(Object),
order: expect.any(Array),
flatOrder: expect.any(Array),
});
expect(demoRundown.id).not.toEqual(duplicatedRundown.id);
expect(duplicatedRundown.order.length).toEqual(demoRundown.order.length);
expect(duplicatedRundown.flatOrder.length).toEqual(demoRundown.flatOrder.length);
expect(Object.keys(duplicatedRundown.entries).length).toEqual(Object.keys(demoRundown.entries).length);
});
});
describe('makeDeepClone()', () => {
it('deep clones a group along with its nested entries', () => {
const group1 = makeOntimeGroup({ id: 'group1', title: 'Group 1', entries: ['event1', 'event2'] });
+118 -87
View File
@@ -74,6 +74,7 @@ let rundownMetadata: RundownMetadata = {
let projectCustomFields: CustomFields = {};
export const getCurrentRundown = (): Readonly<Rundown> => cachedRundown;
export const getCurrentRundownId = (): string => cachedRundown.id;
export const getRundownMetadata = (): Readonly<RundownMetadata> => rundownMetadata;
export const getProjectCustomFields = (): Readonly<CustomFields> => projectCustomFields;
export const getEntryWithId = (entryId: EntryId): OntimeEntry | undefined => cachedRundown.entries[entryId];
@@ -81,56 +82,85 @@ export const getEntryWithId = (entryId: EntryId): OntimeEntry | undefined => cac
type Transaction = {
customFields: CustomFields;
rundown: Rundown;
rundownMetadata: Readonly<RundownMetadata>;
commit: (shouldProcess?: boolean) => {
commit: (shouldProcess?: boolean) => Promise<{
rundown: Readonly<Rundown>;
rundownMetadata: Readonly<RundownMetadata>;
rundownMetadata: Readonly<RundownMetadata> | null;
customFields: Readonly<CustomFields>;
revision: Readonly<number>;
};
}>;
};
type TransactionOptions = {
mutableRundown?: boolean;
mutableCustomFields?: boolean;
/**
* Target rundown ID. Defaults to the loaded rundown.
* When targeting a non-loaded ("background") rundown, the cache and runtime
* metadata are bypassed the rundown is read from disk and persisted directly.
*/
rundownId?: string;
};
export function createTransaction(options: TransactionOptions): Transaction {
const rundown = options.mutableRundown ? structuredClone(cachedRundown) : cachedRundown;
const targetId = options.rundownId ?? cachedRundown.id;
const isLoaded = targetId === cachedRundown.id;
const sourceRundown: Rundown = isLoaded ? cachedRundown : (getDataProvider().getRundown(targetId) as Rundown);
const rundown = options.mutableRundown ? structuredClone(sourceRundown) : sourceRundown;
const customFields = options.mutableCustomFields ? structuredClone(projectCustomFields) : projectCustomFields;
/**
* Applies a mutated rundown to the cache
* Applies a mutated rundown to its persistence target
* @param shouldProcess - whether the rundown should be processed after the commit
* Some edit mutations, and custom field changes do not require processing
*/
function commit(shouldProcess: boolean = true) {
async function commit(shouldProcess: boolean = true) {
let committedRundown: Readonly<Rundown> = isLoaded ? cachedRundown : rundown;
let committedMetadata: RundownMetadata | null = isLoaded ? rundownMetadata : null;
let committedRevision: number = sourceRundown.revision;
// if the rundown is mutable we persist the changes
if (options.mutableRundown) {
// update fields which are agnostic of whether the rundown is processed
cachedRundown.revision = cachedRundown.revision + 1;
cachedRundown.title = rundown.title;
if (isLoaded) {
// update fields which are agnostic of whether the rundown is processed
cachedRundown.revision = cachedRundown.revision + 1;
cachedRundown.title = rundown.title;
if (!shouldProcess) {
// if we dont need to process, we just reassign the commit data to the cache
cachedRundown.entries = rundown.entries;
cachedRundown.order = rundown.order;
cachedRundown.flatOrder = rundown.flatOrder;
if (!shouldProcess) {
// if we dont need to process, we just reassign the commit data to the cache
cachedRundown.entries = rundown.entries;
cachedRundown.order = rundown.order;
cachedRundown.flatOrder = rundown.flatOrder;
} else {
const processedData = processRundown(rundown, projectCustomFields, { mutate: true });
// update the cache values
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- we are not interested in the iteration data
const { previousEvent, latestEvent, previousEntry, entries, order, ...metadata } = processedData;
cachedRundown.entries = entries;
cachedRundown.order = order;
cachedRundown.flatOrder = metadata.flatEntryOrder;
rundownMetadata = metadata;
}
// persist after all mutations are applied
await getDataProvider().setRundown(cachedRundown.id, cachedRundown);
committedRundown = cachedRundown;
committedMetadata = rundownMetadata;
committedRevision = cachedRundown.revision;
} else {
const processedData = processRundown(rundown, projectCustomFields);
// update the cache values
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- we are not interested in the iteration data
const { previousEvent, latestEvent, previousEntry, entries, order, ...metadata } = processedData;
cachedRundown.entries = entries;
cachedRundown.order = order;
cachedRundown.flatOrder = metadata.flatEntryOrder;
rundownMetadata = metadata;
// background rundown: process if requested, persist directly, no runtime metadata
rundown.revision = rundown.revision + 1;
if (shouldProcess) {
const processedData = processRundown(rundown, projectCustomFields, { mutate: true });
rundown.entries = processedData.entries;
rundown.order = processedData.order;
rundown.flatOrder = processedData.flatEntryOrder;
}
await getDataProvider().setRundown(targetId, rundown);
committedRundown = rundown;
committedRevision = rundown.revision;
}
// persist after all mutations are applied
getDataProvider().setRundown(cachedRundown.id, cachedRundown);
}
// if the customFields are mutable we persist the changes
@@ -138,21 +168,20 @@ export function createTransaction(options: TransactionOptions): Transaction {
projectCustomFields = customFields;
// persist after reassignment
getDataProvider().setCustomFields(projectCustomFields);
await getDataProvider().setCustomFields(projectCustomFields);
}
return {
rundown: cachedRundown,
rundownMetadata,
rundown: committedRundown,
rundownMetadata: committedMetadata,
customFields: projectCustomFields,
revision: cachedRundown.revision,
revision: committedRevision,
};
}
return {
customFields,
rundown,
rundownMetadata,
commit,
};
}
@@ -287,11 +316,11 @@ function reorder(rundown: Rundown, eventFrom: OntimeEntry, eventTo: OntimeEntry,
* Mutates the given rundown
*/
function applyDelay(rundown: Rundown, delay: OntimeDelay) {
const delayIndex = rundownMetadata.flatEntryOrder.indexOf(delay.id);
const delayIndex = rundown.flatOrder.indexOf(delay.id);
// if the delay is empty, or the last element
// there is nothing do apply
if (delay.duration === 0 || delayIndex === rundownMetadata.flatEntryOrder.length - 1) {
if (delay.duration === 0 || delayIndex === rundown.flatOrder.length - 1) {
return;
}
@@ -304,8 +333,8 @@ function applyDelay(rundown: Rundown, delay: OntimeDelay) {
let lastEntry: OntimeEvent | null = null;
let isFirstEvent = true;
for (let i = delayIndex + 1; i < rundownMetadata.flatEntryOrder.length; i++) {
const currentId = rundownMetadata.flatEntryOrder[i];
for (let i = delayIndex + 1; i < rundown.flatOrder.length; i++) {
const currentId = rundown.flatOrder[i];
const currentEntry = rundown.entries[currentId];
// we don't do operation on other event types
@@ -587,6 +616,23 @@ export async function updateBackgroundRundown(rundownId: string, rundown: Rundow
await getDataProvider().setRundown(rundownId, rundown);
}
/**
* Reads a rundown from disk and returns it in the processed shape used by clients.
* Used for non-loaded rundowns the loaded rundown is served directly from cache.
*/
export function getProcessedRundown(rundownId: string): Rundown {
const stored = getDataProvider().getRundown(rundownId);
const processed = processRundown(stored, getDataProvider().getCustomFields());
return {
id: stored.id,
title: stored.title,
entries: processed.entries,
order: processed.order,
flatOrder: processed.flatEntryOrder,
revision: stored.revision,
};
}
/**
* Adds a new custom field to the object and returns it
*/
@@ -665,7 +711,7 @@ export const customFieldMutation = {
export function init(initialRundown: Readonly<Rundown>, initialCustomFields: Readonly<CustomFields>) {
const rundown = structuredClone(initialRundown);
const customFields = structuredClone(initialCustomFields);
const processedData = processRundown(rundown, customFields);
const processedData = processRundown(rundown, customFields, { mutate: true });
// update the cache values
cachedRundown.id = rundown.id;
@@ -698,72 +744,57 @@ export const rundownCache = {
};
/**
* Utility updates cache after a mutation
* Handles calculating the rundown metadata
* Computes derived rundown metadata (delays, gaps, group times, ordered lists).
* By default the input rundown is not mutated entries are cloned as they are processed.
* Callers that own a writable rundown can pass `{ mutate: true }` to skip the per-entry clone.
* @private should not be called outside of `rundown.dao.ts`, exported for testing
*/
export function processRundown(
initialRundown: Readonly<Rundown>,
customFields: Readonly<CustomFields>,
options?: { mutate?: boolean },
): ProcessedRundownMetadata {
const { process, getMetadata } = makeRundownMetadata(customFields);
const { process, getMetadata } = makeRundownMetadata(customFields, options);
for (let i = 0; i < initialRundown.order.length; i++) {
// we assign a reference to the current entry, this will be mutated in place
const currentEntryId = initialRundown.order[i];
const currentEntry = initialRundown.entries[currentEntryId];
if (!currentEntry) {
continue;
}
const { processedEntry } = process(currentEntry, null);
const currentEntry = initialRundown.entries[initialRundown.order[i]];
if (!currentEntry) continue;
// if the event is a group, we process the nested entries
// the code here is a copy of the processing of top level events
if (isOntimeGroup(processedEntry)) {
let groupStartTime = null;
let groupEndTime = null;
let isFirstLinked = false;
const groupEvents: EntryId[] = [];
processedEntry.duration = 0;
const processedEntry = process(currentEntry, null);
if (!isOntimeGroup(processedEntry)) continue;
// check if the group contains nested entries
for (let j = 0; j < processedEntry.entries.length; j++) {
const nestedEntryId = processedEntry.entries[j];
const nestedEntry = initialRundown.entries[nestedEntryId];
// process nested entries and recompute aggregate group fields
let groupStartTime: number | null = null;
let groupEndTime: number | null = null;
let isFirstLinked = false;
const groupEvents: EntryId[] = [];
processedEntry.duration = 0;
if (!nestedEntry) {
continue;
}
for (let j = 0; j < processedEntry.entries.length; j++) {
const nestedEntry = initialRundown.entries[processedEntry.entries[j]];
if (!nestedEntry) continue;
groupEvents.push(nestedEntry.id);
const { processedEntry: processedNestedEntry } = process(nestedEntry, processedEntry.id);
groupEvents.push(nestedEntry.id);
const processedNestedEntry = process(nestedEntry, processedEntry.id);
// we dont extract metadata of skipped events,
// if this is not a playable event there is nothing else to do
if (!isOntimeEvent(processedNestedEntry) || !isPlayableEvent(processedNestedEntry)) {
continue;
}
// skip metadata aggregation for non-playable nested entries
if (!isOntimeEvent(processedNestedEntry) || !isPlayableEvent(processedNestedEntry)) continue;
// first start is always the first event
if (groupStartTime === null) {
groupStartTime = processedNestedEntry.timeStart;
isFirstLinked = Boolean(processedNestedEntry.linkStart);
}
// lastEntry is the event with the latest end time
groupEndTime = processedNestedEntry.timeEnd;
if (j > 0) {
processedEntry.duration += processedNestedEntry.gap;
}
processedEntry.duration = processedEntry.duration + processedNestedEntry.duration;
if (groupStartTime === null) {
groupStartTime = processedNestedEntry.timeStart;
isFirstLinked = Boolean(processedNestedEntry.linkStart);
}
// update group metadata
processedEntry.timeStart = groupStartTime;
processedEntry.timeEnd = groupEndTime;
processedEntry.isFirstLinked = isFirstLinked;
processedEntry.entries = groupEvents;
groupEndTime = processedNestedEntry.timeEnd;
if (j > 0) {
processedEntry.duration += processedNestedEntry.gap;
}
processedEntry.duration += processedNestedEntry.duration;
}
processedEntry.timeStart = groupStartTime;
processedEntry.timeEnd = groupEndTime;
processedEntry.isFirstLinked = isFirstLinked;
processedEntry.entries = groupEvents;
}
return getMetadata();
@@ -205,10 +205,15 @@ export type ProcessedRundownMetadata = RundownMetadata & {
/**
* Factory function to create a rundown metadata processor
* @returns {process, getMetadata} process() - processes entries in order | getMetadata() -> returns the current metadata
*
* @param customFields project custom fields used to sanitise entries
* @param options.mutate when true, entries are mutated in place rather than cloned.
* Callers must own (or have already cloned) the input rundown.
* @returns process() - processes entries in order | getMetadata() returns the accumulated metadata
*/
export function makeRundownMetadata(customFields: CustomFields) {
let rundownMeta: ProcessedRundownMetadata = {
export function makeRundownMetadata(customFields: CustomFields, options?: { mutate?: boolean }) {
const mutate = options?.mutate ?? false;
const rundownMeta: ProcessedRundownMetadata = {
totalDelay: 0,
totalDuration: 0,
totalDays: 0,
@@ -228,13 +233,8 @@ export function makeRundownMetadata(customFields: CustomFields) {
previousEntry: null,
};
function process<T extends OntimeEntry>(
entry: T,
childOfGroup: EntryId | null,
): { processedData: ProcessedRundownMetadata; processedEntry: T } {
const data = processEntry(rundownMeta, customFields, entry, childOfGroup);
rundownMeta = data.processedData;
return data;
function process<T extends OntimeEntry>(entry: T, childOfGroup: EntryId | null): T {
return processEntry(rundownMeta, customFields, mutate ? entry : structuredClone(entry), childOfGroup);
}
function getMetadata(): ProcessedRundownMetadata {
@@ -245,20 +245,19 @@ export function makeRundownMetadata(customFields: CustomFields) {
}
/**
* Processes a single entry and updates the rundown metadata
* Processes a single entry, mutating both `entry` and `rundownMetadata` in place.
* Returns the same `entry` reference for caller convenience.
*/
function processEntry<T extends OntimeEntry>(
rundownMetadata: ProcessedRundownMetadata,
customFields: CustomFields,
entry: T,
childOfGroup: EntryId | null,
): { processedData: ProcessedRundownMetadata; processedEntry: T } {
const processedData = { ...rundownMetadata };
const currentEntry = structuredClone(entry);
processedData.flatEntryOrder.push(currentEntry.id);
): T {
rundownMetadata.flatEntryOrder.push(entry.id);
if (isOntimeEvent(currentEntry)) {
processedData.timedEventOrder.push(currentEntry.id);
if (isOntimeEvent(entry)) {
rundownMetadata.timedEventOrder.push(entry.id);
/**
* 1.Checks that link can be established (ie, events exist and are valid)
@@ -266,91 +265,91 @@ function processEntry<T extends OntimeEntry>(
* The linked event is always the previous playable event
* If no previous event exists, the link is removed
*/
if (currentEntry.linkStart) {
if (processedData.previousEvent) {
const timePatch = getLinkedTimes(currentEntry, processedData.previousEvent);
currentEntry.timeStart = timePatch.timeStart;
currentEntry.timeEnd = timePatch.timeEnd;
currentEntry.duration = timePatch.duration;
if (entry.linkStart) {
if (rundownMetadata.previousEvent) {
const timePatch = getLinkedTimes(entry, rundownMetadata.previousEvent);
entry.timeStart = timePatch.timeStart;
entry.timeEnd = timePatch.timeEnd;
entry.duration = timePatch.duration;
} else {
currentEntry.linkStart = false;
entry.linkStart = false;
}
}
// 2. handle custom fields - mutates currentEntry
sanitiseCustomFields(customFields, currentEntry);
// 2. handle custom fields - mutates entry
sanitiseCustomFields(customFields, entry);
processedData.totalDays += calculateDayOffset(currentEntry, processedData.previousEvent);
currentEntry.dayOffset = processedData.totalDays as Day;
currentEntry.delay = 0; // this means we dont calculate delays or gaps for skipped events
currentEntry.gap = 0; // this means we dont calculate delays or gaps for skipped events
currentEntry.parent = childOfGroup;
rundownMetadata.totalDays += calculateDayOffset(entry, rundownMetadata.previousEvent);
entry.dayOffset = rundownMetadata.totalDays as Day;
entry.delay = 0; // this means we dont calculate delays or gaps for skipped events
entry.gap = 0; // this means we dont calculate delays or gaps for skipped events
entry.parent = childOfGroup;
// update rundown metadata, it only concerns playable events
if (isPlayableEvent(currentEntry)) {
processedData.playableEventOrder.push(currentEntry.id);
if (isPlayableEvent(entry)) {
rundownMetadata.playableEventOrder.push(entry.id);
// first start is always the first event
if (processedData.firstStart === null) {
processedData.firstStart = currentEntry.timeStart;
if (rundownMetadata.firstStart === null) {
rundownMetadata.firstStart = entry.timeStart;
}
// check if event is flagged
if (currentEntry.flag) {
processedData.flags.push(currentEntry.id);
if (entry.flag) {
rundownMetadata.flags.push(entry.id);
}
currentEntry.gap = getTimeFrom(currentEntry, processedData.latestEvent);
entry.gap = getTimeFrom(entry, rundownMetadata.latestEvent);
if (currentEntry.gap === 0) {
if (entry.gap === 0) {
// event starts on previous finish, we add its duration
processedData.totalDuration += currentEntry.duration;
} else if (currentEntry.gap > 0) {
rundownMetadata.totalDuration += entry.duration;
} else if (entry.gap > 0) {
// event has a gap, we add the gap and the duration
processedData.totalDuration += currentEntry.gap + currentEntry.duration;
} else if (currentEntry.gap < 0) {
rundownMetadata.totalDuration += entry.gap + entry.duration;
} else {
// there is an overlap, we remove the overlap from the duration
// ensuring that the sum is not negative (ie: fully overlapped events)
// NOTE: we add the gap since it is a negative number
processedData.totalDuration += Math.max(currentEntry.duration + currentEntry.gap, 0);
rundownMetadata.totalDuration += Math.max(entry.duration + entry.gap, 0);
}
// remove eventual gaps from the accumulated delay
// we only affect positive delays (time forwards)
if (processedData.totalDelay > 0 && currentEntry.gap > 0) {
if (rundownMetadata.totalDelay > 0 && entry.gap > 0) {
let correctedDelay = 0;
// we need to separate the delay that is accumulated from one that may exist after the gap
if (isOntimeDelay(processedData.previousEntry)) {
correctedDelay = processedData.previousEntry.duration;
processedData.totalDelay -= correctedDelay;
if (isOntimeDelay(rundownMetadata.previousEntry)) {
correctedDelay = rundownMetadata.previousEntry.duration;
rundownMetadata.totalDelay -= correctedDelay;
}
processedData.totalDelay = Math.max(processedData.totalDelay - currentEntry.gap, 0);
processedData.totalDelay += correctedDelay;
rundownMetadata.totalDelay = Math.max(rundownMetadata.totalDelay - entry.gap, 0);
rundownMetadata.totalDelay += correctedDelay;
}
// current event delay is the current accumulated delay
currentEntry.delay = processedData.totalDelay;
entry.delay = rundownMetadata.totalDelay;
// assign data for next iteration
processedData.previousEvent = currentEntry;
rundownMetadata.previousEvent = entry;
// lastEntry is the event with the latest end time
if (isNewLatest(currentEntry, processedData.latestEvent)) {
processedData.latestEvent = currentEntry;
processedData.lastEnd = currentEntry.timeEnd;
if (isNewLatest(entry, rundownMetadata.latestEvent)) {
rundownMetadata.latestEvent = entry;
rundownMetadata.lastEnd = entry.timeEnd;
}
}
} else if (isOntimeDelay(currentEntry)) {
} else if (isOntimeDelay(entry)) {
// !!! this must happen after handling the links
processedData.totalDelay += currentEntry.duration;
currentEntry.parent = childOfGroup;
rundownMetadata.totalDelay += entry.duration;
entry.parent = childOfGroup;
}
if (!childOfGroup) {
processedData.order.push(currentEntry.id);
rundownMetadata.order.push(entry.id);
}
processedData.entries[currentEntry.id] = currentEntry;
processedData.previousEntry = currentEntry;
rundownMetadata.entries[entry.id] = entry;
rundownMetadata.previousEntry = entry;
return { processedData, processedEntry: currentEntry };
return entry;
}
@@ -5,26 +5,28 @@ import { ErrorResponse, OntimeEntry, ProjectRundownsList, RenumberCues, Rundown
import { getErrorMessage } from 'ontime-utils';
import { getDataProvider } from '../../classes/data-provider/DataProvider.js';
import { makeNewRundown } from '../../models/dataModel.js';
import { paramsWithId } from '../validation-utils/validationFunction.js';
import { getCurrentRundown } from './rundown.dao.js';
import { getCurrentRundown, getProcessedRundown } from './rundown.dao.js';
import {
addEntry,
applyDelay,
batchEditEntries,
cloneEntry,
createNewRundown,
deleteAllEntries,
deleteEntries,
deleteRundown,
duplicateExistingRundown,
editEntry,
groupEntries,
initRundown,
loadRundown,
renameRundown,
renumberEntries,
reorderEntry,
swapEvents,
ungroupEntries,
} from './rundown.service.js';
import { duplicateRundown, normalisedToRundownArray } from './rundown.utils.js';
import { normalisedToRundownArray } from './rundown.utils.js';
import {
clonePostValidator,
entryBatchPutValidator,
@@ -34,8 +36,8 @@ import {
entryReorderValidator,
entrySwapValidator,
rundownArrayOfIds,
rundownPatchValidator,
rundownPostValidator,
validateRundownMutation,
} from './rundown.validation.js';
export const router: Router = express.Router();
@@ -45,7 +47,7 @@ export const router: Router = express.Router();
/**
* Returns all rundowns in the project
*/
router.get('/', async (_req: Request, res: Response<ProjectRundownsList>) => {
router.get('/', (_req: Request, res: Response<ProjectRundownsList>) => {
const projectRundowns = getDataProvider().getProjectRundowns();
res.json({ loaded: getCurrentRundown().id, rundowns: normalisedToRundownArray(projectRundowns) });
});
@@ -53,11 +55,24 @@ router.get('/', async (_req: Request, res: Response<ProjectRundownsList>) => {
/**
* Returns the current rundown
*/
router.get('/current', async (_req: Request, res: Response<Rundown>) => {
router.get('/current', (_req: Request, res: Response<Rundown>) => {
const rundown = getCurrentRundown();
res.json(rundown);
});
/**
* Returns a given rundown in its normalised client shape
*/
router.get('/:id', paramsWithId, (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = getProcessedRundown(req.params.id);
res.json(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(404).send({ message });
}
});
/**
* Loads a given rundown
*/
@@ -76,11 +91,7 @@ router.post('/:id/load', paramsWithId, async (req: Request, res: Response<Projec
*/
router.post('/', rundownPostValidator, async (req: Request, res: Response<ProjectRundownsList | ErrorResponse>) => {
try {
const emptyRundown = makeNewRundown();
emptyRundown.title = req.body.title;
await getDataProvider().setRundown(emptyRundown.id, emptyRundown);
const projectRundowns = getDataProvider().getProjectRundowns();
const projectRundowns = await createNewRundown(req.body.title);
res.status(201).json({ loaded: getCurrentRundown().id, rundowns: normalisedToRundownArray(projectRundowns) });
} catch (error) {
const message = getErrorMessage(error);
@@ -96,13 +107,7 @@ router.post(
paramsWithId,
async (req: Request, res: Response<ProjectRundownsList | ErrorResponse>) => {
try {
const dataProvider = getDataProvider();
const rundown = dataProvider.getRundown(req.params.id);
const duplicatedRundown: Rundown = duplicateRundown(rundown, `Copy of ${rundown.title}`);
await dataProvider.setRundown(duplicatedRundown.id, duplicatedRundown);
const projectRundowns = getDataProvider().getProjectRundowns();
const projectRundowns = await duplicateExistingRundown(req.params.id);
res.status(201).json({ loaded: getCurrentRundown().id, rundowns: normalisedToRundownArray(projectRundowns) });
} catch (error) {
const message = getErrorMessage(error);
@@ -115,54 +120,26 @@ router.post(
* Patches the data of an existing rundown
* Currently only the title can be changed
*/
router.patch('/:id', paramsWithId, async (req: Request, res: Response<ProjectRundownsList | ErrorResponse>) => {
try {
const dataProvider = getDataProvider();
const rundown = dataProvider.getRundown(req.params.id);
if (!rundown) throw new Error(`Rundown with ID ${req.params.id} not found`);
if (!req.body.title) throw new Error('No title provided');
await dataProvider.setRundown(rundown.id, { ...rundown, title: req.body.title });
/**
* If loaded we re-init the rundown
* This is likely over-kill but the simplest way to ensure state consistency
*/
if (req.params.id === getCurrentRundown().id) {
const rundown = dataProvider.getRundown(req.params.id);
const customField = dataProvider.getCustomFields();
await initRundown(rundown, customField);
router.patch(
'/:id',
rundownPatchValidator,
async (req: Request, res: Response<ProjectRundownsList | ErrorResponse>) => {
try {
const projectRundowns = await renameRundown(req.params.id, req.body.title);
res.status(200).json({ loaded: getCurrentRundown().id, rundowns: normalisedToRundownArray(projectRundowns) });
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
const projectRundowns = getDataProvider().getProjectRundowns();
res.status(201).json({ loaded: getCurrentRundown().id, rundowns: normalisedToRundownArray(projectRundowns) });
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
});
},
);
/**
* Deletes a rundown if not loaded
*/
router.delete('/:id', paramsWithId, async (req: Request, res: Response<ProjectRundownsList | ErrorResponse>) => {
try {
if (req.params.id === getCurrentRundown().id) {
res.status(400).send({ message: 'Cannot delete loaded rundown' });
return;
}
const dataProvider = getDataProvider();
const projectRundowns = dataProvider.getProjectRundowns();
if (Object.keys(projectRundowns).length <= 1) {
// might never hit this as it is likely covered by the case of trying to delete the loaded rundown
res.status(400).send({ message: 'Cannot delete the last rundown' });
return;
}
await dataProvider.deleteRundown(req.params.id);
const newProjectRundowns = getDataProvider().getProjectRundowns();
const newProjectRundowns = await deleteRundown(req.params.id);
res.status(200).json({ loaded: getCurrentRundown().id, rundowns: normalisedToRundownArray(newProjectRundowns) });
} catch (error) {
const message = getErrorMessage(error);
@@ -180,10 +157,9 @@ router.delete('/:id', paramsWithId, async (req: Request, res: Response<ProjectRu
router.post(
'/:rundownId/entry',
entryPostValidator,
validateRundownMutation,
async (req: Request, res: Response<OntimeEntry | ErrorResponse>) => {
try {
const newEvent = await addEntry(req.body);
const newEvent = await addEntry(req.params.rundownId, req.body);
res.status(201).send(newEvent);
} catch (error) {
const message = getErrorMessage(error);
@@ -195,20 +171,15 @@ router.post(
/**
* Edits an entry in a given rundown
*/
router.put(
'/:rundownId/entry',
entryPutValidator,
validateRundownMutation,
async (req: Request, res: Response<OntimeEntry | ErrorResponse>) => {
try {
const event = await editEntry(req.body);
res.status(200).send(event);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
},
);
router.put('/:rundownId/entry', entryPutValidator, async (req: Request, res: Response<OntimeEntry | ErrorResponse>) => {
try {
const event = await editEntry(req.params.rundownId, req.body);
res.status(200).send(event);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
});
/**
* Edits an entry in a given rundown
@@ -216,10 +187,9 @@ router.put(
router.put(
'/:rundownId/batch',
entryBatchPutValidator,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await batchEditEntries(req.body.ids, req.body.data);
const rundown = await batchEditEntries(req.params.rundownId, req.body.ids, req.body.data);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
@@ -234,11 +204,10 @@ router.put(
router.patch(
'/:rundownId/reorder',
entryReorderValidator,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const { entryId, destinationId, order } = req.body;
const rundown = await reorderEntry(entryId, destinationId, order);
const rundown = await reorderEntry(req.params.rundownId, entryId, destinationId, order);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
@@ -253,10 +222,9 @@ router.patch(
router.patch(
'/:rundownId/applydelay/:id',
paramsWithId,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await applyDelay(req.params.id);
const rundown = await applyDelay(req.params.rundownId, req.params.id);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
@@ -268,20 +236,15 @@ router.patch(
/**
* Swaps data between two Ontime events
*/
router.patch(
'/:rundownId/swap',
entrySwapValidator,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await swapEvents(req.body.from, req.body.to);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
},
);
router.patch('/:rundownId/swap', entrySwapValidator, async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await swapEvents(req.params.rundownId, req.body.from, req.body.to);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
});
/**
* Clones the contents of an entry into a new one
@@ -290,10 +253,9 @@ router.post(
'/:rundownId/clone/:id',
paramsWithId,
clonePostValidator,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await cloneEntry(req.params.id, {
const rundown = await cloneEntry(req.params.rundownId, req.params.id, {
before: req.body?.before,
after: req.body?.after,
});
@@ -308,38 +270,28 @@ router.post(
/**
* Creates a group out of a list of entries
*/
router.post(
'/:rundownId/group',
rundownArrayOfIds,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await groupEntries(req.body.ids);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
},
);
router.post('/:rundownId/group', rundownArrayOfIds, async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await groupEntries(req.params.rundownId, req.body.ids);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
});
/**
* Dissolves a group by moving its children to the main rundown
*/
router.post(
'/:rundownId/ungroup/:id',
paramsWithId,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await ungroupEntries(req.params.id);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
},
);
router.post('/:rundownId/ungroup/:id', paramsWithId, async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await ungroupEntries(req.params.rundownId, req.params.id);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
});
/**
* Deletes a list of entries by their ID
@@ -347,10 +299,9 @@ router.post(
router.delete(
'/:rundownId/entries',
rundownArrayOfIds,
validateRundownMutation,
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await deleteEntries(req.body.ids);
const rundown = await deleteEntries(req.params.rundownId, req.body.ids);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
@@ -362,19 +313,15 @@ router.delete(
/**
* Deletes all entries in a given rundown
*/
router.delete(
'/:rundownId/all',
validateRundownMutation,
async (_req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await deleteAllEntries();
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
},
);
router.delete('/:rundownId/all', async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const rundown = await deleteAllEntries(req.params.rundownId);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
res.status(400).send({ message });
}
});
/**
* Reorders two entries in a rundown
@@ -382,11 +329,10 @@ router.delete(
router.patch(
'/:rundownId/renumber',
entryRenumberValidator,
validateRundownMutation,
(req: Request, res: Response<Rundown | ErrorResponse>) => {
async (req: Request, res: Response<Rundown | ErrorResponse>) => {
try {
const { ids, prefix, start, increment } = matchedData<RenumberCues>(req);
const rundown = renumberEntries(ids, prefix, start, increment);
const rundown = await renumberEntries(req.params.rundownId, ids, prefix, start, increment);
res.status(200).send(rundown);
} catch (error) {
const message = getErrorMessage(error);
@@ -16,18 +16,19 @@ import {
isOntimeEvent,
isOntimeGroup,
} from 'ontime-types';
import { customFieldLabelToKey, getInsertAfterId, resolveInsertParent } from 'ontime-utils';
import { customFieldLabelToKey, generateId, getInsertAfterId, resolveInsertParent } from 'ontime-utils';
import { sendRefetch } from '../../adapters/WebsocketAdapter.js';
import { getDataProvider } from '../../classes/data-provider/DataProvider.js';
import { logger } from '../../classes/Logger.js';
import { makeNewRundown } from '../../models/dataModel.js';
import { setLastLoadedRundown } from '../../services/app-state-service/AppStateService.js';
import { runtimeService } from '../../services/runtime-service/runtime.service.js';
import { updateRundownData } from '../../stores/runtimeState.js';
import {
createTransaction,
customFieldMutation,
getCurrentRundown,
getCurrentRundownId,
rundownCache,
rundownMutation,
updateBackgroundRundown,
@@ -38,8 +39,8 @@ import { generateEvent, getIntegerAndFraction, hasChanges } from './rundown.util
/**
* creates a new entry with given data
*/
export async function addEntry(eventData: EventPostPayload): Promise<OntimeEntry> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function addEntry(rundownId: string, eventData: EventPostPayload): Promise<OntimeEntry> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
// we allow the user to provide an ID, but make sure it is unique
if (eventData?.id && Object.hasOwn(rundown.entries, eventData.id)) {
@@ -66,7 +67,7 @@ export async function addEntry(eventData: EventPostPayload): Promise<OntimeEntry
// make mutations to rundown
rundownMutation.add(rundown, newEntry, afterId, parent);
const { rundownMetadata, revision } = commit();
const { rundown: responseRundown, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -74,17 +75,17 @@ export async function addEntry(eventData: EventPostPayload): Promise<OntimeEntry
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: [newEntry.id], external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: [newEntry.id], external: true });
});
return newEntry;
return responseRundown.entries[newEntry.id] ?? newEntry;
}
/**
* Applies a patch to an entry in the rundown
*/
export async function editEntry(patch: PatchWithId): Promise<OntimeEntry> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function editEntry(rundownId: string, patch: PatchWithId): Promise<OntimeEntry> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
const currentEntry = rundown.entries[patch.id];
/**
@@ -110,7 +111,7 @@ export async function editEntry(patch: PatchWithId): Promise<OntimeEntry> {
}
const { entry, didInvalidate } = rundownMutation.edit(rundown, patch);
const { rundownMetadata, revision } = commit(didInvalidate);
const { rundown: responseRundown, rundownMetadata, revision } = await commit(didInvalidate);
// schedule the side effects
setImmediate(() => {
@@ -118,17 +119,24 @@ export async function editEntry(patch: PatchWithId): Promise<OntimeEntry> {
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: didInvalidate ? true : [entry.id], external: true });
notifyChanges(rundown.id, rundownMetadata, revision, {
timer: didInvalidate ? true : [entry.id],
external: true,
});
});
return entry;
return responseRundown.entries[entry.id] ?? entry;
}
/**
* Applies a patch to several entries in the rundown
*/
export async function batchEditEntries(ids: EntryId[], patch: Partial<OntimeEntry>): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function batchEditEntries(
rundownId: string,
ids: EntryId[],
patch: Partial<OntimeEntry>,
): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
/**
* We can do some validation globally, but mostly we will validate each entry individually
@@ -173,7 +181,7 @@ export async function batchEditEntries(ids: EntryId[], patch: Partial<OntimeEntr
batchDidInvalidate = true;
}
}
const { rundown: rundownResult, rundownMetadata, revision } = commit(batchDidInvalidate);
const { rundown: rundownResult, rundownMetadata, revision } = await commit(batchDidInvalidate);
// schedule the side effects
setImmediate(() => {
@@ -181,7 +189,10 @@ export async function batchEditEntries(ids: EntryId[], patch: Partial<OntimeEntr
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: batchDidInvalidate ? true : changedIds, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, {
timer: batchDidInvalidate ? true : changedIds,
external: true,
});
});
return rundownResult;
@@ -190,8 +201,8 @@ export async function batchEditEntries(ids: EntryId[], patch: Partial<OntimeEntr
/**
* Deletes a known entry from the current rundown
*/
export async function deleteEntries(entryIds: EntryId[]): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function deleteEntries(rundownId: string, entryIds: EntryId[]): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
for (let i = 0; i < entryIds.length; i++) {
const entry = rundown.entries[entryIds[i]];
@@ -201,7 +212,7 @@ export async function deleteEntries(entryIds: EntryId[]): Promise<Rundown> {
rundownMutation.remove(rundown, entry);
}
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -209,7 +220,7 @@ export async function deleteEntries(entryIds: EntryId[]): Promise<Rundown> {
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: entryIds, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: entryIds, external: true });
});
return rundownResult;
@@ -218,12 +229,12 @@ export async function deleteEntries(entryIds: EntryId[]): Promise<Rundown> {
/**
* Deletes all entries from the current rundown
*/
export async function deleteAllEntries(): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function deleteAllEntries(rundownId: string): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
rundownMutation.removeAll(rundown);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -231,7 +242,7 @@ export async function deleteAllEntries(): Promise<Rundown> {
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: true, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: true, external: true });
});
return rundownResult;
@@ -242,8 +253,13 @@ export async function deleteAllEntries(): Promise<Rundown> {
* Handles moving across root orders (a group order and top level order)
* @throws if entryId or destinationId not found
*/
export async function reorderEntry(entryId: EntryId, destinationId: EntryId, order: 'before' | 'after' | 'insert') {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function reorderEntry(
rundownId: string,
entryId: EntryId,
destinationId: EntryId,
order: 'before' | 'after' | 'insert',
) {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
// check that both entries exist
const eventFrom = rundown.entries[entryId];
@@ -255,7 +271,7 @@ export async function reorderEntry(entryId: EntryId, destinationId: EntryId, ord
rundownMutation.reorder(rundown, eventFrom, eventTo, order);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -263,7 +279,7 @@ export async function reorderEntry(entryId: EntryId, destinationId: EntryId, ord
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: true, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: true, external: true });
});
return rundownResult;
@@ -272,22 +288,28 @@ export async function reorderEntry(entryId: EntryId, destinationId: EntryId, ord
/**
* @throws if an id is missing or not an Ontime event
*/
export function renumberEntries(ids: EntryId[], prefix: string, start: string, increment: string): Rundown {
export async function renumberEntries(
rundownId: string,
ids: EntryId[],
prefix: string,
start: string,
increment: string,
): Promise<Rundown> {
const startNumber = getIntegerAndFraction(start);
const incrementNumber = getIntegerAndFraction(increment);
// if the prefix doesn't already include a separator or is empty, then insert a separator
if (prefix !== '' && !prefix.endsWith('-') && !prefix.endsWith(' ')) prefix += ' ';
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true, mutableCustomFields: false });
rundownMutation.renumber(rundown, ids, prefix, startNumber, incrementNumber);
const { rundown: rundownResult, rundownMetadata, revision } = commit(false);
const { rundown: rundownResult, rundownMetadata, revision } = await commit(false);
setImmediate(() => {
updateRuntimeOnChange(rundownMetadata);
notifyChanges(rundownMetadata, revision, { timer: ids, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: ids, external: true });
});
return rundownResult;
@@ -297,8 +319,8 @@ export function renumberEntries(ids: EntryId[], prefix: string, start: string, i
* Applies a delay into the rundown effectively changing the schedule
* The applied delay is deleted
*/
export async function applyDelay(delayId: EntryId): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function applyDelay(rundownId: string, delayId: EntryId): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
// check that delay exists
const delay = rundown.entries[delayId];
@@ -310,7 +332,7 @@ export async function applyDelay(delayId: EntryId): Promise<Rundown> {
rundownMutation.applyDelay(rundown, delay);
rundownMutation.remove(rundown, delay);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -318,7 +340,7 @@ export async function applyDelay(delayId: EntryId): Promise<Rundown> {
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: true, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: true, external: true });
});
return rundownResult;
@@ -327,8 +349,8 @@ export async function applyDelay(delayId: EntryId): Promise<Rundown> {
/**
* Swaps the data between two events in the rundown
*/
export async function swapEvents(fromId: EntryId, toId: EntryId): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function swapEvents(rundownId: string, fromId: EntryId, toId: EntryId): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
const eventFrom = rundown.entries[fromId];
const eventTo = rundown.entries[toId];
@@ -343,7 +365,7 @@ export async function swapEvents(fromId: EntryId, toId: EntryId): Promise<Rundow
}
rundownMutation.swap(rundown, eventFrom, eventTo);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -351,7 +373,7 @@ export async function swapEvents(fromId: EntryId, toId: EntryId): Promise<Rundow
updateRuntimeOnChange(rundownMetadata);
// notify timer and external services of change
notifyChanges(rundownMetadata, revision, { timer: true, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: true, external: true });
});
return rundownResult;
@@ -362,8 +384,8 @@ export async function swapEvents(fromId: EntryId, toId: EntryId): Promise<Rundow
* Handles cloning children if the entry is a group
* @throws if the entry to clone does not exist
*/
export async function cloneEntry(entryId: EntryId, options: InsertOptions): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function cloneEntry(rundownId: string, entryId: EntryId, options: InsertOptions): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
const originalEntry = rundown.entries[entryId];
if (!originalEntry) {
@@ -371,7 +393,7 @@ export async function cloneEntry(entryId: EntryId, options: InsertOptions): Prom
}
const newEntry = rundownMutation.clone(rundown, originalEntry, options);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -380,11 +402,11 @@ export async function cloneEntry(entryId: EntryId, options: InsertOptions): Prom
// notify timer and external services of change
if (isOntimeGroup(newEntry)) {
notifyChanges(rundownMetadata, revision, { timer: newEntry.entries, external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: newEntry.entries, external: true });
} else if (isOntimeEvent(newEntry)) {
notifyChanges(rundownMetadata, revision, { timer: [newEntry.id], external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: [newEntry.id], external: true });
} else if (isOntimeDelay(newEntry)) {
notifyChanges(rundownMetadata, revision, { external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { external: true });
}
});
@@ -394,11 +416,11 @@ export async function cloneEntry(entryId: EntryId, options: InsertOptions): Prom
/**
* Groups a list of entries into a new group
*/
export async function groupEntries(entryIds: EntryId[]): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function groupEntries(rundownId: string, entryIds: EntryId[]): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
rundownMutation.group(rundown, entryIds);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -406,7 +428,7 @@ export async function groupEntries(entryIds: EntryId[]): Promise<Rundown> {
updateRuntimeOnChange(rundownMetadata);
// we need to notify the timer since we might be grouping a running event
notifyChanges(rundownMetadata, revision, { external: true, timer: true });
notifyChanges(rundown.id, rundownMetadata, revision, { external: true, timer: true });
});
return rundownResult;
@@ -415,8 +437,8 @@ export async function groupEntries(entryIds: EntryId[]): Promise<Rundown> {
/**
* Deletes a group and moves all its children to the top level
*/
export async function ungroupEntries(groupId: EntryId): Promise<Rundown> {
const { rundown, commit } = createTransaction({ mutableRundown: true, mutableCustomFields: false });
export async function ungroupEntries(rundownId: string, groupId: EntryId): Promise<Rundown> {
const { rundown, commit } = createTransaction({ rundownId, mutableRundown: true });
const group = rundown.entries[groupId];
if (!group || !isOntimeGroup(group)) {
@@ -424,7 +446,7 @@ export async function ungroupEntries(groupId: EntryId): Promise<Rundown> {
}
rundownMutation.ungroup(rundown, group);
const { rundown: rundownResult, rundownMetadata, revision } = commit();
const { rundown: rundownResult, rundownMetadata, revision } = await commit();
// schedule the side effects
setImmediate(() => {
@@ -432,7 +454,7 @@ export async function ungroupEntries(groupId: EntryId): Promise<Rundown> {
updateRuntimeOnChange(rundownMetadata);
// we dont need to notify the timer since the grouping does not affect the runtime
notifyChanges(rundownMetadata, revision, { external: true });
notifyChanges(rundown.id, rundownMetadata, revision, { external: true });
});
return rundownResult;
@@ -459,7 +481,7 @@ export async function createCustomField(customField: CustomField): Promise<Custo
customFieldMutation.add(customFields, key, customField);
// Adding a custom field has no immediate implications on the rundown
const { customFields: resultCustomFields } = commit(false);
const { customFields: resultCustomFields } = await commit(false);
setImmediate(() => {
sendRefetch(RefetchKey.CustomFields);
@@ -517,12 +539,12 @@ export async function editCustomField(
}
// the custom fields have been removed and there is no processing to be done
const { rundownMetadata, revision, customFields: resultCustomFields } = commit(false);
const { rundownMetadata, revision, customFields: resultCustomFields } = await commit(false);
// schedule the side effects
setImmediate(() => {
sendRefetch(RefetchKey.CustomFields);
notifyChanges(rundownMetadata, revision, { timer: true, external: true });
notifyChanges(undefined, rundownMetadata, revision, { timer: true, external: true });
});
return resultCustomFields;
@@ -556,12 +578,12 @@ export async function deleteCustomField(key: CustomFieldKey, projectRundowns: Pr
customFieldMutation.remove(customFields, key);
// the custom fields have been removed and there is no processing to be done
const { rundownMetadata, revision, customFields: resultCustomFields } = commit(false);
const { rundownMetadata, revision, customFields: resultCustomFields } = await commit(false);
// schedule the side effects
setImmediate(() => {
sendRefetch(RefetchKey.CustomFields);
notifyChanges(rundownMetadata, revision, { timer: true, external: true });
notifyChanges(undefined, rundownMetadata, revision, { timer: true, external: true });
});
return resultCustomFields;
@@ -573,7 +595,8 @@ export async function deleteCustomField(key: CustomFieldKey, projectRundowns: Pr
*
* @private - exported for testing
*/
export function updateRuntimeOnChange(rundownMetadata: RundownMetadata) {
export function updateRuntimeOnChange(rundownMetadata: RundownMetadata | null) {
if (!rundownMetadata) return;
// we only declare the amount of playable events
const numEvents = rundownMetadata.timedEventOrder.length;
@@ -592,29 +615,40 @@ type NotifyChangesOptions = {
/**
* Notify services of changes in the rundown
* TODO: we could receive a runtime flag to call updateRuntimeOnChange
* instead of having it in every consumer
*/
function notifyChanges(rundownMetadata: RundownMetadata, revision: number, options: NotifyChangesOptions) {
// notify timer service of changed events
if (options.timer) {
function notifyChanges(
rundownId: string | undefined,
rundownMetadata: RundownMetadata | null,
revision: number,
options: NotifyChangesOptions,
) {
// notify timer service of changed event
if (rundownMetadata && options.timer && rundownId && isCurrentRundown(rundownId)) {
runtimeService.notifyOfChangedEvents(rundownMetadata);
}
// notify external services of changes
if (options.reload) {
sendRefetch(RefetchKey.All);
} else if (options.external) {
sendRefetch(RefetchKey.Rundown, revision);
sendRefetch(RefetchKey.Rundown, revision, rundownId);
}
}
export function isCurrentRundown(id: string) {
return id === getCurrentRundownId();
}
/**
* @throws if the provided id does not exist
*/
export async function loadRundown(id: string) {
const dataProvider = getDataProvider();
if (id === getCurrentRundown().id) {
if (isCurrentRundown(id)) {
return dataProvider.getProjectRundowns();
}
const rundown = dataProvider.getRundown(id);
const customField = dataProvider.getCustomFields();
await initRundown(rundown, customField);
@@ -637,9 +671,97 @@ export async function initRundown(
updateRuntimeOnChange(rundownMetadata);
setImmediate(() => {
notifyChanges(rundownMetadata, revision, { timer: true, external: true, reload });
notifyChanges(rundown.id, rundownMetadata, revision, { timer: true, external: true, reload });
sendRefetch(RefetchKey.ProjectRundowns);
setLastLoadedRundown(rundown.id).catch((error) => {
logger.error(LogOrigin.Server, `Failed to persist last loaded rundown: ${error}`);
});
});
}
export async function createNewRundown(title: string) {
const emptyRundown = makeNewRundown();
emptyRundown.title = title;
await getDataProvider().setRundown(emptyRundown.id, emptyRundown);
const projectRundowns = getDataProvider().getProjectRundowns();
setImmediate(() => {
sendRefetch(RefetchKey.ProjectRundowns);
});
return projectRundowns;
}
/**
* Renames an existing rundown
* @throws if the provided id does not exist
*/
export async function renameRundown(id: string, title: string) {
const dataProvider = getDataProvider();
const rundown = dataProvider.getRundown(id);
await dataProvider.setRundown(id, { ...rundown, title });
/**
* If we are modifying the loaded rundown we re-init it
* This is likely over-kill but the simplest way to ensure state consistency
*/
if (isCurrentRundown(id)) {
const rundown = dataProvider.getRundown(id);
const customField = dataProvider.getCustomFields();
// init rundown does its own refetch
await initRundown(rundown, customField);
} else {
setImmediate(() => {
sendRefetch(RefetchKey.ProjectRundowns);
});
}
return dataProvider.getProjectRundowns();
}
/**
* Duplicates an existing rundown without making it the loaded one
* @throws if the provided id does not exist
*/
export async function duplicateExistingRundown(id: string) {
const dataProvider = getDataProvider();
const rundown = dataProvider.getRundown(id);
const duplicatedRundown: Rundown = structuredClone(rundown);
duplicatedRundown.id = generateId();
duplicatedRundown.title = `Copy of ${rundown.title}`;
duplicatedRundown.revision = 0;
await dataProvider.setRundown(duplicatedRundown.id, duplicatedRundown);
setImmediate(() => {
sendRefetch(RefetchKey.ProjectRundowns);
});
return dataProvider.getProjectRundowns();
}
/**
* Deletes a rundown
* @throws if attempting to delete the loaded rundown or the last rundown in the project
*/
export async function deleteRundown(id: string) {
if (isCurrentRundown(id)) {
throw new Error('Cannot delete loaded rundown');
}
const dataProvider = getDataProvider();
if (Object.keys(dataProvider.getProjectRundowns()).length <= 1) {
throw new Error('Cannot delete the last rundown');
}
const projectRundowns = await dataProvider.deleteRundown(id);
setImmediate(() => {
sendRefetch(RefetchKey.ProjectRundowns);
});
return projectRundowns;
}
@@ -34,43 +34,34 @@ import {
import { RundownMetadata } from './rundown.types.js';
type CompleteEntry<T> =
T extends Partial<OntimeEvent>
? OntimeEvent
: T extends Partial<OntimeDelay>
? OntimeDelay
: T extends Partial<OntimeGroup>
? OntimeGroup
: T extends Partial<OntimeMilestone>
? OntimeMilestone
: never;
/**
* Generates a fully formed RundownEntry of the patch type
*/
export function generateEvent<
T extends Partial<OntimeEvent> | Partial<OntimeDelay> | Partial<OntimeGroup> | Partial<OntimeMilestone>,
>(rundown: Rundown, eventData: T, afterId: EntryId | null, parent?: EntryId): CompleteEntry<T> {
export function generateEvent(
rundown: Rundown,
eventData: Partial<OntimeEvent> | Partial<OntimeDelay> | Partial<OntimeGroup> | Partial<OntimeMilestone>,
afterId: EntryId | null,
parent?: EntryId,
): OntimeEntry {
if (isOntimeEvent(eventData)) {
return createEvent(
eventData,
getCueCandidate(rundown.entries, rundown.flatOrder, afterId, parent),
) as CompleteEntry<T>;
const event = createEvent(eventData, getCueCandidate(rundown.entries, rundown.flatOrder, afterId, parent));
if (!event) throw new Error('Invalid event type');
return event;
}
const id = eventData.id || getUniqueId(rundown);
if (isOntimeDelay(eventData)) {
return createDelay({ duration: eventData.duration ?? 0, id }) as CompleteEntry<T>;
return createDelay({ duration: eventData.duration ?? 0, id });
}
// TODO(v4): allow user to provide a larger patch of the group entry
if (isOntimeGroup(eventData)) {
return createGroup({ id, title: eventData.title ?? '' }) as CompleteEntry<T>;
return createGroup({ id, title: eventData.title ?? '' });
}
if (isOntimeMilestone(eventData)) {
return createMilestone({ ...eventData, id }) as CompleteEntry<T>;
return createMilestone({ ...eventData, id });
}
throw new Error('Invalid event type');
@@ -460,20 +451,6 @@ export function normalisedToRundownArray(rundowns: ProjectRundowns): ProjectRund
});
}
/**
* Duplicates an existing rundown ensuring all IDs are unique
*/
export function duplicateRundown(rundown: Rundown, newTitle: string): Rundown {
const newRundownId = generateId();
const newRundown = structuredClone(rundown);
newRundown.id = newRundownId;
newRundown.title = newTitle;
newRundown.revision = 0;
return newRundown;
}
export type IncrementNumber = {
integer: number;
faction: number;
@@ -1,39 +1,19 @@
import type { NextFunction, Request, Response } from 'express';
import { body, param } from 'express-validator';
import { requestValidationFunction } from '../validation-utils/validationFunction.js';
import { getCurrentRundown } from './rundown.dao.js';
// #region operations on project rundowns =========================
export const rundownPostValidator = [body('title').isString().trim().notEmpty(), requestValidationFunction];
export const rundownPatchValidator = [
param('id').isString().trim().notEmpty(),
body('title').isString().trim().notEmpty().withMessage('No title provided'),
requestValidationFunction,
];
// #endregion operations on project rundowns ======================
// #region operations on rundown entries ==========================
/**
* Middleware prevents mutating a rundown that is not selected
* This allows our service to still only handle the current rundown
*
* This would need to be removed in favour or rundown selection if we would like
* to implement the mutation of background rundowns
*/
export async function validateRundownMutation(req: Request, res: Response, next: NextFunction) {
const { rundownId } = req.params;
try {
if (getCurrentRundown().id !== rundownId) {
res.status(404).json({ message: 'Cannot mutate not selected rundown' });
return;
}
next();
} catch (error) {
res.status(404).json({ message: 'Rundown not found' });
return;
}
}
export const entryPostValidator = [
body('type').isString().isIn(['event', 'delay', 'group', 'milestone']),
body('after').optional().isString(),
@@ -12,7 +12,9 @@ describe('parseUrlPresets()', () => {
it('parses data, skipping invalid results', () => {
const errorEmitter = vi.fn();
const urlPresets = [{ enabled: true, alias: 'alias', target: 'timer', search: 'ss' }] as URLPreset[];
const urlPresets = [
{ enabled: true, alias: 'alias', target: 'timer', search: 'ss', displayInNav: false },
] as URLPreset[];
const result = parseUrlPresets({ urlPresets }, errorEmitter);
expect(result.length).toEqual(1);
expect(result.at(0)).toMatchObject({
@@ -36,6 +38,7 @@ describe('parseUrlPresets()', () => {
alias: 'testalias',
target: 'timer',
search: 'testpathAndParams',
displayInNav: false,
},
],
} as unknown as DatabaseModel;
@@ -26,6 +26,7 @@ export function parseUrlPresets(data: Partial<DatabaseModel>, emitError?: ErrorE
alias: preset.alias,
target: preset.target,
search: preset.search ?? '',
displayInNav: preset.displayInNav ?? false,
options: preset?.options,
};
newPresets.push(newPreset);
@@ -21,6 +21,7 @@ router.post('/', validateNewPreset, async (req: Request, res: Response<URLPreset
alias: req.body.alias,
target: req.body.target,
search: req.body.search,
displayInNav: req.body.displayInNav,
options: req.body.options,
};
@@ -55,6 +56,7 @@ router.put('/:alias', validateUpdatePreset, async (req: Request, res: Response<U
alias: req.body.alias,
target: req.body.target,
search: req.body.search,
displayInNav: req.body.displayInNav,
options: req.body.options ?? existingPreset.options,
};
@@ -12,6 +12,7 @@ export const validateNewPreset = [
body('alias').isString().trim().notEmpty(),
body('target').isString().trim().notEmpty().isIn(Object.values(OntimeView)),
body('search').isString().trim(),
body('displayInNav').isBoolean(),
// options are currently only provided for cuesheet presets
body('options').optional().isObject(),
@@ -27,6 +28,7 @@ export const validateUpdatePreset = [
body('alias').isString().trim().notEmpty(),
body('target').isString().trim().notEmpty().isIn(Object.values(OntimeView)),
body('search').isString().trim(),
body('displayInNav').isBoolean(),
// options are currently only provided for cuesheet presets
body('options').optional().isObject(),
@@ -63,7 +63,7 @@ const actionHandlers: Record<ApiActionTag, ActionHandler> = {
throw new Error('Missing Event ID');
}
const { entries } = getCurrentRundown();
const { entries, id: currentRundownId } = getCurrentRundown();
const customFields = getProjectCustomFields();
const targetEntry = entries[id];
@@ -89,8 +89,8 @@ const actionHandlers: Record<ApiActionTag, ActionHandler> = {
Object.assign(patchEntry, newObjectProperty);
}
});
//TODO: windowed edit function
await editEntry(patchEntry);
await editEntry(currentRundownId, patchEntry);
return { payload: 'success' };
},
/* Message Service */
@@ -0,0 +1,255 @@
import { SupportedEntry, type EventPostPayload, type OntimeEntry, type PatchWithId, type Rundown } from 'ontime-types';
import { beforeEach, describe, expect, it, vi } from 'vitest';
const addEntryMock = vi.hoisted(() => vi.fn());
const editEntryMock = vi.hoisted(() => vi.fn());
const groupEntriesMock = vi.hoisted(() => vi.fn());
const ungroupEntriesMock = vi.hoisted(() => vi.fn());
const getCurrentRundownMock = vi.hoisted(() => vi.fn());
vi.mock('../../api-data/rundown/rundown.dao.js', () => ({
getCurrentRundown: getCurrentRundownMock,
getCurrentRundownId: vi.fn(() => 'loaded-rundown'),
getProjectCustomFields: vi.fn(() => ({})),
}));
vi.mock('../../classes/data-provider/DataProvider.js', () => ({
getDataProvider: vi.fn(),
}));
vi.mock('../../api-data/rundown/rundown.service.js', () => ({
addEntry: addEntryMock,
batchEditEntries: vi.fn(),
deleteEntries: vi.fn(),
editEntry: editEntryMock,
groupEntries: groupEntriesMock,
reorderEntry: vi.fn(),
ungroupEntries: ungroupEntriesMock,
}));
const { batchCreateEntriesForMcp, groupEntriesForMcp, ungroupEntryForMcp } = await import('../mcp.service.js');
function makeRundown(entries: Rundown['entries'], order: string[] = Object.keys(entries)): Rundown {
return {
id: 'loaded-rundown',
title: 'Loaded',
order,
flatOrder: order,
entries,
revision: 0,
};
}
describe('mcp.service', () => {
beforeEach(() => {
vi.clearAllMocks();
getCurrentRundownMock.mockReturnValue(makeRundown({}));
let id = 0;
addEntryMock.mockImplementation(async (_rundownId: string, payload: EventPostPayload) => {
id += 1;
const entryId = `entry-${id}`;
if (payload.type === SupportedEntry.Group) {
return {
id: entryId,
type: SupportedEntry.Group,
title: payload.title ?? '',
note: '',
colour: '',
custom: {},
targetDuration: null,
entries: [],
revision: 0,
timeStart: null,
timeEnd: null,
duration: 0,
isFirstLinked: false,
};
}
return {
id: entryId,
type: payload.type ?? SupportedEntry.Event,
title: payload.title ?? '',
parent: 'parent' in payload ? payload.parent : null,
} as OntimeEntry;
});
editEntryMock.mockImplementation(async (_rundownId: string, patch: PatchWithId) => ({
id: patch.id,
type: SupportedEntry.Group,
title: 'Session block',
note: patch.note ?? '',
colour: patch.colour ?? '',
custom: patch.custom ?? {},
targetDuration: patch.targetDuration ?? null,
entries: [],
revision: 1,
timeStart: null,
timeEnd: null,
duration: 0,
isFirstLinked: false,
}));
});
it('creates grouped batch entries with group metadata and child parent references', async () => {
const result = await batchCreateEntriesForMcp({
entries: [
{
type: SupportedEntry.Group,
title: 'Session block',
note: 'Main room',
colour: '#123456',
targetDuration: 3_600_000,
children: [
{ type: SupportedEntry.Event, title: 'Talk', timeStart: 36_000_000, duration: 1_800_000 },
{ type: SupportedEntry.Milestone, title: 'Reset stage' },
],
},
{ type: SupportedEntry.Event, title: 'After block', timeStart: 39_600_000, duration: 900_000 },
],
});
expect(addEntryMock).toHaveBeenNthCalledWith(
1,
'loaded-rundown',
expect.objectContaining({ type: SupportedEntry.Group, title: 'Session block' }),
);
expect(editEntryMock).toHaveBeenCalledWith(
'loaded-rundown',
expect.objectContaining({
id: 'entry-1',
note: 'Main room',
colour: '#123456',
targetDuration: 3_600_000,
}),
);
expect(addEntryMock).toHaveBeenNthCalledWith(
2,
'loaded-rundown',
expect.objectContaining({ type: SupportedEntry.Event, title: 'Talk', parent: 'entry-1' }),
);
expect(addEntryMock).toHaveBeenNthCalledWith(
3,
'loaded-rundown',
expect.objectContaining({
type: SupportedEntry.Milestone,
title: 'Reset stage',
parent: 'entry-1',
after: 'entry-2',
}),
);
expect(addEntryMock).toHaveBeenNthCalledWith(
4,
'loaded-rundown',
expect.objectContaining({ type: SupportedEntry.Event, title: 'After block', after: 'entry-1' }),
);
expect(result.created.map((entry) => entry.id)).toEqual(['entry-1', 'entry-2', 'entry-3', 'entry-4']);
});
it('rejects nested groups before creating entries', async () => {
await expect(
batchCreateEntriesForMcp({
entries: [
{
type: SupportedEntry.Group,
title: 'Outer',
children: [{ type: SupportedEntry.Group, title: 'Inner' }],
},
],
}),
).rejects.toThrow('Cannot create a group inside another group.');
expect(addEntryMock).not.toHaveBeenCalled();
expect(editEntryMock).not.toHaveBeenCalled();
});
it('groups existing top-level entries and applies group metadata', async () => {
const sourceRundown = makeRundown(
{
'entry-1': { id: 'entry-1', type: SupportedEntry.Event, title: 'One', parent: null } as OntimeEntry,
'entry-2': { id: 'entry-2', type: SupportedEntry.Event, title: 'Two', parent: null } as OntimeEntry,
},
['entry-1', 'entry-2'],
);
const groupedRundown = makeRundown(
{
group: {
id: 'group',
type: SupportedEntry.Group,
title: '',
note: '',
colour: '',
custom: {},
targetDuration: null,
entries: ['entry-1', 'entry-2'],
revision: 0,
timeStart: null,
timeEnd: null,
duration: 0,
isFirstLinked: false,
},
'entry-1': { id: 'entry-1', type: SupportedEntry.Event, title: 'One', parent: 'group' } as OntimeEntry,
'entry-2': { id: 'entry-2', type: SupportedEntry.Event, title: 'Two', parent: 'group' } as OntimeEntry,
},
['group'],
);
getCurrentRundownMock.mockReturnValue(sourceRundown);
groupEntriesMock.mockResolvedValue(groupedRundown);
const result = await groupEntriesForMcp({
ids: ['entry-1', 'entry-2'],
title: 'Block',
colour: '#abcdef',
targetDuration: 1_200_000,
});
expect(groupEntriesMock).toHaveBeenCalledWith('loaded-rundown', ['entry-1', 'entry-2']);
expect(editEntryMock).toHaveBeenCalledWith(
'loaded-rundown',
expect.objectContaining({ id: 'group', colour: '#abcdef', targetDuration: 1_200_000 }),
);
expect(result.entry.id).toBe('group');
expect(result.order).toEqual(['group']);
});
it('rejects grouping nested entries before mutating', async () => {
getCurrentRundownMock.mockReturnValue(
makeRundown({
group: { id: 'group', type: SupportedEntry.Group, entries: ['entry-1'] } as OntimeEntry,
'entry-1': { id: 'entry-1', type: SupportedEntry.Event, title: 'One', parent: 'group' } as OntimeEntry,
}),
);
await expect(groupEntriesForMcp({ ids: ['entry-1'] })).rejects.toThrow(
'Cannot group nested entry entry-1. Move it out of its group first.',
);
expect(groupEntriesMock).not.toHaveBeenCalled();
expect(editEntryMock).not.toHaveBeenCalled();
});
it('ungroups an existing group entry', async () => {
getCurrentRundownMock.mockReturnValue(
makeRundown({
group: { id: 'group', type: SupportedEntry.Group, entries: ['entry-1'] } as OntimeEntry,
'entry-1': { id: 'entry-1', type: SupportedEntry.Event, title: 'One', parent: 'group' } as OntimeEntry,
}),
);
ungroupEntriesMock.mockResolvedValue(
makeRundown(
{
'entry-1': { id: 'entry-1', type: SupportedEntry.Event, title: 'One', parent: null } as OntimeEntry,
},
['entry-1'],
),
);
const result = await ungroupEntryForMcp({ id: 'group' });
expect(ungroupEntriesMock).toHaveBeenCalledWith('loaded-rundown', 'group');
expect(result).toMatchObject({ ungrouped: 'group', order: ['entry-1'] });
});
});
+21
View File
@@ -0,0 +1,21 @@
import type { NextFunction, Request, RequestHandler, Response } from 'express';
import { hasPassword, hashedPassword } from '../api-data/session/session.service.js';
/**
* Wraps the app authenticate middleware with support for the Authorization header.
* MCP clients conventionally authenticate with `Authorization: Bearer <token>`
* rather than cookies or query params; any other request falls through to the
* app middleware, keeping the behaviour of the shared middleware untouched.
*/
export function makeMcpAuthenticate(fallback: RequestHandler): RequestHandler {
return function mcpAuthenticate(req: Request, res: Response, next: NextFunction) {
if (hasPassword) {
const authHeader = req.headers.authorization;
if (authHeader?.startsWith('Bearer ') && authHeader.slice(7) === hashedPassword) {
return next();
}
}
return fallback(req, res, next);
};
}

Some files were not shown because too many files have changed in this diff Show More