refactor: expose aux timer names via runtime store, index in automations

Addresses review feedback on the aux timer naming feature:

- Automation action labels now reference the timers by index
  ("Aux timer 1: start") rather than the custom names, keeping the
  automation config stable regardless of naming.
- Expose the custom names through the consumer-facing runtime interface:
  the aux timer objects broadcast over the websocket now carry a `name`
  field. Names are seeded from the persisted settings at bootstrap and
  kept in sync whenever the settings change, so every consumer (views and
  integrations) reads them from the same runtime data.
- The client control and view consumers now read the name from the
  runtime store instead of querying settings directly; the settings form
  remains the persisted editing source.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WCZejVTzuAY3tHTE6nB3JH
This commit is contained in:
Claude
2026-07-25 08:49:51 +00:00
parent 2f7909ccc3
commit 2f29060fa4
17 changed files with 145 additions and 46 deletions
@@ -3,7 +3,6 @@ import { millisToString, parseUserTime } from 'ontime-utils';
import { IoArrowDown, IoArrowUp, IoPause, IoPlay, IoStop } from 'react-icons/io5';
import TimeInput from '../../../../common/components/input/time-input/TimeInput';
import useSettings from '../../../../common/hooks-query/useSettings';
import { setAuxTimer, useAuxTimerControl, useAuxTimerTime } from '../../../../common/hooks/useSocket';
import { getAuxTimerLabel } from '../../../../common/utils/auxTimerUtils';
import TapButton from '../tap-button/TapButton';
@@ -15,12 +14,11 @@ interface AuxTimerProps {
}
export function AuxTimer({ index }: AuxTimerProps) {
const { playback, direction } = useAuxTimerControl(index);
const { data: settings } = useSettings();
const { playback, direction, name } = useAuxTimerControl(index);
const { stop, setDirection } = setAuxTimer;
const label = getAuxTimerLabel(settings.auxTimerNames, index, `Aux Timer ${index}`);
const label = getAuxTimerLabel(name, `Aux Timer ${index}`);
const toggleDirection = () => {
const newDirection = direction === SimpleDirection.CountDown ? SimpleDirection.CountUp : SimpleDirection.CountDown;