chore: rename blocks to groups

This commit is contained in:
Carlos Valente
2025-08-09 06:47:13 +02:00
committed by Carlos Valente
parent 486d89ecf4
commit e5d2457717
83 changed files with 987 additions and 981 deletions
@@ -2,12 +2,12 @@ import { RefObject, useEffect } from 'react';
import { useQueryClient } from '@tanstack/react-query';
import { RowModel, Table } from '@tanstack/react-table';
import {
isOntimeBlock,
isOntimeDelay,
isOntimeEvent,
isOntimeGroup,
isOntimeMilestone,
OntimeBlock,
OntimeEntry,
OntimeGroup,
Rundown,
} from 'ontime-types';
import { colourToHex, cssOrHexToColour } from 'ontime-utils';
@@ -18,9 +18,9 @@ import { useSelectedEventId } from '../../../../common/hooks/useSocket';
import { getAccessibleColour } from '../../../../common/utils/styleUtils';
import { usePersistedCuesheetOptions } from '../../cuesheet.options';
import BlockRow from './BlockRow';
import DelayRow from './DelayRow';
import EventRow from './EventRow';
import GroupRow from './GroupRow';
import MilestoneRow from './MilestoneRow';
import { cleanup } from './rowObserver';
@@ -39,7 +39,7 @@ export default function CuesheetBody({ rowModel, selectedRef, table }: CuesheetB
let eventIndex = 0;
// for the first event, it will be past if there is something selected
let isPast = Boolean(selectedEventId);
let hadBlock = false;
let hadGroup = false;
// remove the observer when the table unmounts
useEffect(() => {
@@ -62,11 +62,11 @@ export default function CuesheetBody({ rowModel, selectedRef, table }: CuesheetB
isPast = false;
}
if (isOntimeBlock(entry)) {
if (isOntimeGroup(entry)) {
return (
<BlockRow
<GroupRow
key={key}
blockId={entry.id}
groupId={entry.id}
colour={entry.colour}
hidePast={isPast && hidePast}
rowId={row.id}
@@ -88,7 +88,7 @@ export default function CuesheetBody({ rowModel, selectedRef, table }: CuesheetB
if (entry.parent) {
const rundown = queryClient.getQueryData<Rundown>(RUNDOWN);
const parentEntry = rundown?.entries[entry.parent];
parentBgColour = (parentEntry as OntimeBlock).colour ?? null;
parentBgColour = (parentEntry as OntimeGroup).colour ?? null;
}
return <DelayRow key={key} duration={delayVal} parentBgColour={parentBgColour} />;
}
@@ -113,7 +113,7 @@ export default function CuesheetBody({ rowModel, selectedRef, table }: CuesheetB
if (entry.parent) {
const rundown = queryClient.getQueryData<Rundown>(RUNDOWN);
const parentEntry = rundown?.entries[entry.parent];
parentBgColour = (parentEntry as OntimeBlock | undefined)?.colour ?? null;
parentBgColour = (parentEntry as OntimeGroup | undefined)?.colour ?? null;
}
return (
@@ -153,15 +153,15 @@ export default function CuesheetBody({ rowModel, selectedRef, table }: CuesheetB
}
let parentBgColour: string | undefined;
let firstAfterBlock = false;
let firstAfterGroup = false;
if (entry.parent) {
const rundown = queryClient.getQueryData<Rundown>(RUNDOWN);
const parentEntry = rundown?.entries[entry.parent] as OntimeBlock | undefined;
const parentEntry = rundown?.entries[entry.parent] as OntimeGroup | undefined;
parentBgColour = parentEntry?.colour;
hadBlock = true;
} else if (hadBlock) {
firstAfterBlock = true;
hadBlock = false;
hadGroup = true;
} else if (hadGroup) {
firstAfterGroup = true;
hadGroup = false;
}
return (
@@ -176,7 +176,7 @@ export default function CuesheetBody({ rowModel, selectedRef, table }: CuesheetB
rowBgColour={rowBgColour}
parentBgColour={parentBgColour}
table={table}
firstAfterBlock={firstAfterBlock}
firstAfterGroup={firstAfterGroup}
/>
);
}
@@ -11,7 +11,7 @@
background: color-mix(in srgb, transparent 80%, var(--user-bg, $gray-500) 20%);
}
&.firstAfterBlock {
&.firstAfterGroup {
margin-top: 1rem;
}
@@ -26,7 +26,7 @@ interface EventRowProps {
rowBgColour?: string;
parentBgColour?: string;
table: Table<OntimeEntry>;
firstAfterBlock: boolean;
firstAfterGroup: boolean;
}
export default function EventRow({
@@ -39,7 +39,7 @@ export default function EventRow({
rowBgColour,
parentBgColour,
table,
firstAfterBlock,
firstAfterGroup,
}: EventRowProps) {
const { cuesheetMode, hideIndexColumn } = table.options.meta?.options ?? {
cuesheetMode: AppMode.Edit,
@@ -75,7 +75,7 @@ export default function EventRow({
className={cx([
style.eventRow,
event.skip && style.skip,
firstAfterBlock && style.firstAfterBlock,
firstAfterGroup && style.firstAfterGroup,
Boolean(parentBgColour) && style.hasParent,
])}
style={{
@@ -1,6 +1,6 @@
@import '../CuesheetTable.module.scss';
.blockRow {
.groupRow {
margin-top: 1rem;
width: 100%;
display: flex;
@@ -3,14 +3,14 @@ import { flexRender, Table } from '@tanstack/react-table';
import { EntryId, OntimeEntry, SupportedEntry } from 'ontime-types';
import IconButton from '../../../../common/components/buttons/IconButton';
import { useCurrentBlockId } from '../../../../common/hooks/useSocket';
import { useCurrentGroupId } from '../../../../common/hooks/useSocket';
import { AppMode } from '../../../../ontimeConfig';
import { useCuesheetTableMenu } from '../cuesheet-table-menu/useCuesheetTableMenu';
import style from './BlockRow.module.scss';
import style from './GroupRow.module.scss';
interface BlockRowProps {
blockId: EntryId;
interface GroupRowProps {
groupId: EntryId;
colour: string;
hidePast: boolean;
rowId: string;
@@ -18,8 +18,8 @@ interface BlockRowProps {
table: Table<OntimeEntry>;
}
export default function BlockRow({ blockId, colour, hidePast, rowId, rowIndex, table }: BlockRowProps) {
const { currentBlockId } = useCurrentBlockId();
export default function GroupRow({ groupId, colour, hidePast, rowId, rowIndex, table }: GroupRowProps) {
const { currentGroupId } = useCurrentGroupId();
const { cuesheetMode, hideIndexColumn } = table.options.meta?.options ?? {
cuesheetMode: AppMode.Edit,
@@ -28,12 +28,12 @@ export default function BlockRow({ blockId, colour, hidePast, rowId, rowIndex, t
const openMenu = useCuesheetTableMenu((store) => store.openMenu);
if (hidePast && !currentBlockId) {
if (hidePast && !currentGroupId) {
return null;
}
return (
<tr className={style.blockRow} style={{ '--user-bg': colour }} data-testid='cuesheet-block'>
<tr className={style.groupRow} style={{ '--user-bg': colour }} data-testid='cuesheet-group'>
{cuesheetMode === AppMode.Edit && (
<td className={style.actionColumn} tabIndex={-1} role='cell'>
<IconButton
@@ -43,7 +43,7 @@ export default function BlockRow({ blockId, colour, hidePast, rowId, rowIndex, t
onClick={(e) => {
const rect = e.currentTarget.getBoundingClientRect();
const yPos = 8 + rect.y + rect.height / 2;
openMenu({ x: rect.x, y: yPos }, blockId, SupportedEntry.Block, rowIndex, null, null);
openMenu({ x: rect.x, y: yPos }, groupId, SupportedEntry.Group, rowIndex, null, null);
}}
>
<IoEllipsisHorizontal />
@@ -134,7 +134,7 @@ function MakeMultiLineField({ row, column, table }: CellContext<OntimeEntry, unk
[column.id, row.index, table.options.meta],
);
// not all entries have all properties (eg blocks)
// not all entries have all properties (eg groups)
const initialValue = row.original[column.id as keyof OntimeEntry];
if (initialValue === undefined) {
return null;
@@ -174,7 +174,7 @@ function MakeSingleLineField({ row, column, table }: CellContext<OntimeEntry, un
[column.id, row.index, table.options.meta],
);
// not all entries have all properties (eg blocks)
// not all entries have all properties (eg groups)
const initialValue = row.original[column.id as keyof OntimeEntry];
if (initialValue === undefined) {
return null;