feat: Improve automation flow and add ontime playback actions (#2025) (#2024)

* fix: prevent add filter from submitting form

* refactor: event clarifies whether automations exist but are disabled

* refactor: improve readability of automation form

* refactor: add affordance for field warnings

* refactor: improve visibility of automation off state

* refactor: apply warning styles to other feature toggles

* Adding playback actions to automations (#2024)

* adding intial automation actions

* cleaning up

* fixing formatting

* ran oxfmt

* switching action names to playback- to match the dropdown strings

* fixing flicker that was caused by scroll arrows gettting unmounted

---------

Co-authored-by: Cameron Slipp <cdslipp@gmail.com>

apps/server/src/api-data/automation/clients/ontime.client.ts

@@ -4,6 +4,7 @@ import { parseUserTime } from 'ontime-utils';
 import { logger } from '../../../classes/Logger.js';
 import { auxTimerService } from '../../../services/aux-timer-service/AuxTimerService.js';
 import * as messageService from '../../../services/message-service/message.service.js';
+import { runtimeService } from '../../../services/runtime-service/runtime.service.js';
 
 export function toOntimeAction(action: OntimeAction) {
   const actionType = action.action;
@@ -40,6 +41,16 @@ export function toOntimeAction(action: OntimeAction) {
       return auxTimerService.setTime(time, 3);
     }
 
+    // Playback actions
+    case 'playback-start':
+      return runtimeService.start();
+    case 'playback-stop':
+      return runtimeService.stop();
+    case 'playback-pause':
+      return runtimeService.pause();
+    case 'playback-roll':
+      return runtimeService.roll();
+
     // Message actions
     case 'message-set': {
       messageService.patch({