Merge pull request #1019 from cpvalente/cleanup-server-setup

remove redundant path evaluation
refactor: improve payload type for OSC (#954 )
2026-07-26 10:38:55 +00:00 · 2024-05-30 07:57:23 -05:00 · 2024-05-30 13:02:22 +02:00 · 2024-05-30 12:15:57 +02:00 · 2024-05-29 16:25:15 -05:00 · 2024-05-29 08:33:44 +02:00
209 changed files with 4374 additions and 2868 deletions
@@ -11,4 +11,13 @@

 # Ignore git and cache folders
 .git
+.gitignore
 .cache
+
+# Ignore build folders
+node_modules
+dist
+
+# Ignore default volumes created by running docker compose up
+ontime-db
+ontime-styles
@@ -0,0 +1,2 @@
+github: cpvalente
+buy_me_a_coffee: cpvalente
@@ -1,9 +1,8 @@
-name: Ontime build v3
+name: Ontime build

 on:
-# Only trigger manually for now for testing
-#   push:
-#     tags: [ "*" ]
+  push:
+    tags: [ "*" ]
  workflow_dispatch:

 jobs:
@@ -31,7 +30,14 @@ jobs:
        run: pnpm build

      - name: Electron - Build app
+        env: 
+          APPLE_ID: ${{ secrets.APPLEID }}
+          APPLE_APP_SPECIFIC_PASSWORD: ${{ secrets.APPLEIDPASS }}
+          APPLE_TEAM_ID: ${{ secrets.TEAMID }}
+          CSC_KEY_PASSWORD: ${{ secrets.CSC_KEY_PASSWORD }}
+          CSC_LINK: ${{ secrets.CSC_LINK }}
        run: pnpm dist-mac
+        timeout-minutes: 60

      - name: Release
        uses: softprops/action-gh-release@v1
@@ -1,4 +1,4 @@
-name: Docker Image CI Ontime V2
+name: Docker Image CI Ontime

 on:
  push:
@@ -13,28 +13,10 @@ jobs:
      CI: ''

    steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
    - name: Setup env
      run: echo "RELEASE_VERSION=${GITHUB_REF#refs/*/}" >> $GITHUB_ENV

-    - name: Setup Node.js environment
-      uses: actions/setup-node@v3.6.0
-      with:
-        version: 16.16.0
-
-    - name: Setup pnpm
-      uses: pnpm/action-setup@v2
-      with:
-        version: 8
-
-    - name: Install dependencies
-      run: pnpm install --frozen-lockfile
-
-    - name: Build project packages
-      env:
-        SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
-      run: pnpm turbo build:docker
-
    - name: Docker Login
      uses: docker/login-action@v2.1.0
      with:
@@ -1,108 +0,0 @@
-name: Ontime build v2
-
-on:
-  push:
-    tags: [ "*" ]
-  workflow_dispatch:
-
-jobs:
-  build_macos:
-    runs-on: macOS-latest
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Use Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 18.18.2
-
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2
-        with:
-          version: 8
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Build project packages
-        env:
-          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
-        run: pnpm build
-
-      - name: Electron - Build app
-        run: pnpm dist-mac
-
-      - name: Release
-        uses: softprops/action-gh-release@v1
-        with:
-          files: |
-            ./apps/electron/dist/ontime-macOS-x64.dmg
-            ./apps/electron/dist/ontime-macOS-arm64.dmg
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-  build_windows:
-    runs-on: windows-latest
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Use Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 18.18.2
-
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2
-        with:
-          version: 8
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Build project packages
-        env:
-          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
-        run: pnpm build
-
-      - name: Electron - Build app
-        run: pnpm dist-win
-
-      - name: Release
-        uses: softprops/action-gh-release@v1
-        with:
-          files: './apps/electron/dist/ontime-win64.exe'
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-  build_ubuntu:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Use Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 18.18.2
-
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2
-        with:
-          version: 8
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Build project packages
-        env:
-          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
-        run: pnpm build
-
-      - name: Electron - Build app
-        run: pnpm dist-linux
-
-      - name: Release
-        uses: softprops/action-gh-release@v1
-        with:
-          files: './apps/electron/dist/ontime-linux.AppImage'
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
@@ -1,9 +1,8 @@
-name: Ontime test v3
+name: Ontime test

 on:
-# Only trigger manually for now for testing
-#   pull_request:
-#     branches: '*'
+  pull_request:
+    branches: '*'
  workflow_dispatch:

 jobs:
@@ -1,106 +0,0 @@
-name: Ontime test v2
-
-on:
-  pull_request:
-    branches: '*'
-  workflow_dispatch:
-
-jobs:
-  unit-test:
-    runs-on: ubuntu-latest
-    timeout-minutes: 20
-    env:
-      CI: ''
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Use Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 18.18.2
-
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2
-        with:
-          version: 8
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      # Run code quality per package
-      - name: React - Run linter +  TypeScript checks
-        if: always()
-        run: pnpm lint && tsc --noEmit
-        working-directory: ./apps/client
-
-      - name: Server - Run linter +  TypeScript checks
-        if: always()
-        run: pnpm lint && tsc --noEmit
-        working-directory: ./apps/server
-
-      - name: Utils - Run linter +  TypeScript checks
-        if: always()
-        run: pnpm lint && tsc --noEmit
-        working-directory: ./packages/utils
-
-      - name: Types - Run linter
-        if: always()
-        run: pnpm lint
-        working-directory: ./packages/types
-
-      # We choose to run tests separately
-      - name: React - Run unit tests
-        if: always()
-        run: pnpm test:pipeline
-        working-directory: ./apps/client
-
-      - name: Server - Run unit tests
-        if: always()
-        run: pnpm test:pipeline
-        working-directory: ./apps/server
-
-      - name: Utils - Run unit tests
-        if: always()
-        run: pnpm test:pipeline
-        working-directory: ./packages/utils
-
-  e2e-test:
-    runs-on: ubuntu-latest
-    timeout-minutes: 20
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Use Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 18.18.2
-
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2
-        with:
-          version: 8
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Build client
-        run: pnpm build:local
-
-      - name: Install Playwright Browsers
-        run: npx playwright install --with-deps
-
-      - name: Run Playwright tests
-        run: pnpm e2e
-
-      - uses: actions/upload-artifact@v3
-        if: always()
-        with:
-          name: playwright-report
-          path: playwright-report/
-          retention-days: 30
-
-      - uses: actions/upload-artifact@v3
-        with:
-          name: automated-screenshots
-          path: automated-screenshots/
-          retention-days: 14
@@ -88,8 +88,6 @@ While it should allow for a generic setup, it might need to be modified to fit y

 From the project root, run the following commands

- __Install the project dependencies__ by running `pnpm i`
- __Build packages__ by running `pnpm build:localdocker`
 - __Build docker image from__ by running `docker build -t getontime/ontime`
 - __Run docker image from compose__ by running `docker-compose up -d`

@@ -1,3 +1,12 @@
+FROM node:18.18-alpine AS builder
+ENV PNPM_HOME="/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+RUN corepack enable
+COPY . /app
+WORKDIR /app
+RUN pnpm --filter=ontime-ui --filter=ontime-server --filter=ontime-utils install --config.dedupe-peer-dependents=false --frozen-lockfile
+RUN pnpm --filter=ontime-ui --filter=ontime-server run build:docker
+
 FROM node:18.18-alpine

 # Set environment variables
@@ -9,12 +18,12 @@ ENV ONTIME_DATA=/external/
 WORKDIR /app/

 # Prepare UI
-COPY /apps/client/build ./client/
+COPY --from=builder /app/apps/client/build ./client/

 # Prepare Backend
-COPY /apps/server/dist/ ./server/
-COPY /demo-db/ ./preloaded-db/
-COPY /apps/server/src/external/ ./external/
+COPY --from=builder /app/apps/server/dist/ ./server/
+COPY ./demo-db/ ./preloaded-db/
+COPY --from=builder /app/apps/server/src/external/ ./external/

 # Export default ports
 EXPOSE 4001/tcp 8888/udp 9999/udp
@@ -1,205 +1,178 @@
-[![Ontime build v2](https://github.com/cpvalente/ontime/actions/workflows/build_v2.yml/badge.svg)](https://github.com/cpvalente/ontime/actions/workflows/build_v2.yml)
-[![License: GPL v3](https://img.shields.io/badge/License-GPLv3-green.svg)](https://www.gnu.org/licenses/gpl-3.0) 
+[![License: GPL v3](https://img.shields.io/badge/License-GPLv3-green.svg)](https://www.gnu.org/licenses/gpl-3.0)
+![GitHub Downloads (all assets, all releases)](https://img.shields.io/github/downloads/cpvalente/ontime/total)
+![Docker Pulls](https://img.shields.io/docker/pulls/getontime/ontime)
+[![](https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%A4&logo=GitHub&color=%23fe8e86)](https://github.com/sponsors/cpvalente)
+[![](https://img.shields.io/static/v1?label=Buy%20me%20a%20coffee&message=%E2%9D%A4&logo=buymeacoffee&color=%23fe8e86)](https://www.buymeacoffee.com/cpvalente)

-## Download the latest releases here
+## Download the latest release
+<a href="https://www.buymeacoffee.com/cpvalente" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" height="32"></a>

-<div style="display: flex; justify-content: space-around">
-  <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-macOS-arm64.dmg"><img alt="Download MacOS" src="https://github.com/cpvalente/ontime/blob/master/.github/aux-images/mac-download.png"/></a>
-  <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-win64.exe"><img alt="Download Windows" src="https://github.com/cpvalente/ontime/blob/master/.github/aux-images/win-download.png"/></a>
-  <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-linux.AppImage"><img alt="Download Linux" src="https://github.com/cpvalente/ontime/blob/master/.github/aux-images/linux-download.png"/></a>
-  <a href="https://hub.docker.com/r/getontime/ontime"><img alt="Get from Dockerhub" src="https://github.com/cpvalente/ontime/blob/master/.github/aux-images/dockerhub.png"/></a>
-</div>
+- Download for <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-win64.exe">Windows</a>
+- Download for <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-macOS-arm64.dmg">MacOS Arm</a>
+- Download for <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-macOS-x64.dmg">MacOS Intel</a>
+- Download AppImage for <a href="https://github.com/cpvalente/ontime/releases/latest/download/ontime-linux.AppImage">Linux</a>
+- Get from <a href="https://hub.docker.com/r/getontime/ontime">Docker hub</a>
+
+## Using Ontime?
+
+Let us know!
+Ontime improves from the collaboration with its users. We would like to understand how you use Ontime and appreciate your feedback.
+
+We would also like to include a testimonials section in our ✨new website✨. It would be great to showcase the diversity of users running Ontime.

 # Ontime

-Ontime is an application for creating and managing event running order and timers.
+Ontime is a browser-based application that manages event rundowns, scheduling, and cueing.

-The user inputs a list of events along with scheduling and event information.
-This will then populate a series of screens which are available to be rendered by any device in the Network.
+With Ontime, you can plan, track your schedule, manage automation and cross-department show information all in one place.

-This makes for a simple and cheap way to distribute over a venue using a network infrastructure instead of video outputs.
+Ontime is made by entertainment and broadcast engineers and used by

-![App Window](https://github.com/cpvalente/ontime/blob/master/.github/aux-images/app.png)
+- Conference organisers
+- Touring shows and receiving venues
+- Broadcasters and streamers
+- Theatres and opera houses
+- Houses of worship

-![Views](https://github.com/cpvalente/ontime/blob/master/.github/aux-images/overview.png)
+### For live environments
+
+Ontime is designed for use in live environments. \
+This guides the application into being flexible and efficiently integrating into different workflows.
+
+### For teams
+
+All information added in Ontime is shared with the production team and other software / hardware in your workflow. \
+Ontime also improves team collaboration with dedicated views for cuesheets and operators, and for public and production
+signage.
+
+### Simple infrastructure
+
+All the data is distributed over the network, making its distribution and infrastructure flexible and cheap. \
+With the availability of the docker image, you can also leverage IT infrastructure to make Ontime available online for
+your team and clients.
+
+Ontime is made by video engineers and entertainment technicians.
+
+![App Window](https://github.com/cpvalente/ontime/blob/master/.github/aux-images/editor.png)
+
+![Views](https://github.com/cpvalente/ontime/blob/master/.github/aux-images/ontime-overview.webp)

 [Read the docs to learn more](https://docs.getontime.no)

 ## Using Ontime

-Once installed and running, Ontime starts a background server that is the heart of all processes.
-From the app, you can add / edit your running order and control the timer playback.
+Ontime can be started by downloading the latest release for your platform. \
+Alternatively you can also use the docker image, available at [Docker Hub](https://hub.docker.com/r/getontime/ontime)

-Any device with a browser in the same network can choose one of the supported views to render the available data.
-This is done by reaching the ontime server at the _default port 4001_ eg: `localhost:4001`
-or `192.168.1.3:4001`
-<br />
-You can then use the menu in the top left corner to select the desired view.
-The menu will be initially hidden until there is mouse interaction.
+Once installed and running, any device in the network has access to Ontime.

-In the case of unattended machines or automation, it is possible to use different URL to recall
-individual views and extend view settings using the URL presets feature
+Ontime provides different screens which allow for different types of interactions with the data. These are called
+views. \
+Each view in Ontime focuses on empowering a specific role or achieving a particular task.
+
+You can access the different views by reaching the ontime server, in your browser, at (_default port
+4001_) `http://localhost:4001` or `http://192.168.1.3:4001`

 ```
-For the presentation views
+For the backstage views
 -------------------------------------------------------------
-IP.ADDRESS:4001            > Web server default to presenter timer view
 IP.ADDRESS:4001/timer      > Presenter / Stage timer view
 IP.ADDRESS:4001/minimal    > Simple timer view
 IP.ADDRESS:4001/clock      > Simple clock view
-IP.ADDRESS:4001/sm         > Stage Manager / Backstage view
-IP.ADDRESS:4001/public     > Public / Foyer view
-IP.ADDRESS:4001/lower      > Lower Thirds
+IP.ADDRESS:4001/backstage  > Stage Manager / Backstage view
+IP.ADDRESS:4001/countdown  > Countdown to anything
 IP.ADDRESS:4001/studio     > Studio Clock
 ```

 ```
-For management views
+For the public views
+-------------------------------------------------------------
+IP.ADDRESS:4001/public     > Public / Foyer view
+IP.ADDRESS:4001/lower      > Lower Thirds
+```
+
+```
+For production views
 -------------------------------------------------------------
 IP.ADDRESS:4001/editor    > the control interface, same as the app
 IP.ADDRESS:4001/cuesheet  > realtime cuesheets for collaboration
+IP.ADDRESS:4001/operator  > automated views for operators
 ```

 More documentation is available [in our docs](https://docs.getontime.no)

-## Feature List (in no specific order)
+## Main features

 - [x] Distribute data over network and render it in the browser
- [x] Different screen types
-  - Stage Timer
-  - Minimal Timer
-  - Clock
-  - Backstage Info
-  - Public Info
-  - Studio Clock
-  - Countdown
-  - [Make your own?](#make-your-own-viewer)
- [x] Configurable Lower Thirds
- [x] Collaborative editing with the cuesheet view
- [x] Send live messages to different screen types
+- [x] Collaborative
+- [x] Extendable
+- [x] Send messages to different screen types
 - [x] Differentiate between backstage and public data
 - [x] Workflow for managing delays
 - [x] Rich protocol integrations for Control and Feedback
-  - OSC (Open Sound Control)
-  - HTTP
-  - WebSockets
- [x] Roll mode: run standalone using the system clock
- [x] [Headless run](#headless-run): run server in a separate machine, configure from a browser locally
- [x] [Countdown to anything!](https://docs.getontime.no/features/count-to-anything/): have
-      a countdown to any scheduled event
+- [x] For servers: use docker to run Ontime in in a server, configure from a browser anywhere
 - [x] Multi-platform (available on Windows, MacOS and Linux)
- [x] [Companion integration](https://bitfocus.io/connections/getontime-ontime)
-
-## Unopinionated
-
-We want Ontime to be unique by targeting freelancers instead of roles.
-
-We believe most freelancers work in different fields and we want to give you a tool that you can leverage across your
-many environments and workflows.
-
-We are not interested in forcing workflows and have made Ontime so, it is flexible to whichever way you would like to
-work.
-
-## Rich APIs for workflow integrations
-
-The app is currently being developed for a broad user base, from broadcast to entertainment and
-conference halls.
-
-Taking advantage of the integrations, we currently use Ontime with:
-
- `disguise`: trigger Ontime from d3's timeline using the **OSC API**, and **render views** using d3's
-  webmodule
- `OBS`: **render views** using the Browser Module
- `QLab`: trigger Ontime using **OSC API**
- `Companion`: Ontime has a **companion module**. Issue report and feature requests should be done
-  in the [repository getontime/ontime](https://github.com/bitfocus/companion-module-getontime-ontime)
-
-### Make your own viewer
-
-Ontime broadcasts its data over WebSockets. This allows you to consume its data outside the application.
-
-Writing a new view for the browser can be done with basic knowledge of HTML + CSS + Javascript (or any other language
-that can run in the browser).
-<br />
-We have prepared a few resources to help here:
- Shipped with Ontime there is a small clock to get you started, it is available at `http://localhost:4001/external/demo` and the [code can be found here](https://github.com/cpvalente/ontime/tree/master/apps/server/src/external/demo)
- See [this repository](https://github.com/cpvalente/ontime-viewer-template-v2) with a template on
-how to get you started
- See information about the [Websocket API](https://docs.getontime.no/api/osc-and-ws/)
-<br />
-More information [in the docs](https://docs.getontime.no/features/custom-views/)
-
-
-### Headless run️
-
-You can self-host and run Ontime in a docker image.
-
-The docker image along with documentation is [available Docker Hub at getontime/ontime](https://hub.docker.com/r/getontime/ontime)
-
-If you want to run this image in a Raspberry Pi, please see [the docs](https://docs.getontime.no/additional-notes/use-with-rpi/)
+- [x] Companion integration [follow link](https://bitfocus.io/connections/getontime-ontime)

 ## Roadmap

 ### Continued development

-Several features are planned in the roadmap, and we continuously adjust this to match how users interact with the app.
-<br />
+Ontime is under active development. We continue adding and tweaking features in collaboration with users.
+
 Have an idea? Reach out via [email](mail@getontime.no)
 or [open an issue](https://github.com/cpvalente/ontime/issues/new)

 ### Issues

-We use Github's issue tracking for bug reporting and feature requests. <br />
+We use Github's issue tracking for bug reporting and feature requests. \
 Found a bug? [Open an issue](https://github.com/cpvalente/ontime/issues/new).

 #### Unsigned App

 When installing the app you would see warning screens from the Operating System like:

+in Windows
+
 `Microsoft Defender SmartScreen prevented an unrecognised app from starting. Running this app might put your PC at risk.`

-or
-
-`Ontime can't be opened because it is from an unidentified developer`
-
 or in Linux

 `Could Not Display "ontime-linux.AppImage`

+We currently only sign MacOS releases. \
+Purchasing the certificates for both Mac and Windows would mean a recurrent expense which we are not able to cover.
+
 You can circumvent this by allowing the execution of the app manually.

- In Windows: click more and select "Run Anyway"
- in macOS: the solution in macOS is different across versions, please refer to the [apple documentation](https://support.apple.com/en-gb/guide/mac-help/mh40616/mac)
- In Linux: right-click the AppImage file -> Properties -> Permissions -> select Allow Executing
-  File as a Program
+- In Windows: click `more` -> `Run Anyway`
+- In Linux: right-click the AppImage file: `Properties` -> `Permissions` -> `Allow Executing File as a Program`

-Long story short: Ontime app is unsigned. </br>Purchasing the certificates for both Mac and Windows
-would mean a recurrent expense and is not a priority. This is unlikely to change in future. If you
-have tips on how to improve this or would like to sponsor the code signing,
+If you have tips on how to improve this or would like to sponsor the code signing,
 please [open an issue](https://github.com/cpvalente/ontime/issues/new)

-#### Safari
-
-There are known issues with Safari versions lower than 13:
-
- Spacing and text styles might have small inconsistencies
- Table view does not work
-
-There is no plan for any further work on this.
-
-# Contributing
+## Contributing

 Looking to contribute? All types of help are appreciated, from coding to testing and feature specification.
-<br /><br />
-If you are a developer and would like to contribute with some code, please open an issue to discuss before opening a
-Pull Request.
-<br />
+
+If you are a developer and would like to contribute with code, please open an issue to discuss before opening a Pull Request.
+
 Information about the project setup can be found in the [development documentation](./DEVELOPMENT.md)

-# Help
+## Links

-Help is underway! ... and can be found [here](https://docs.getontime.no)
+See the [Ontime website](https://getontime.no) here and the link to the [documentation](https://docs.getontime.no)

-# License
+## License

 This project is licensed under the terms of the GNU GPL v3
+
+## Sponsor
+
+You can help the development of this project or say thank you with a one time donation. \
+See [the terms of donations](https://github.com/cpvalente/ontime/blob/master/.github/FUNDING.md).
+
+<p align="center">
+<br>
+<a href="https://www.buymeacoffee.com/cpvalente" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" width="200"></a>
+</p>
@@ -0,0 +1,19 @@
+# Terms of sponsorship
+Ontime does not exist as a fiscal entity. The sponsorship recipient is the project owner. In this light, contributors are funding the project owner's capacity to work on the project, not the project itself. As a contribution recipient, the code owner reserves the right to redistribute.
+
+## Why sponsor
+Ontime is and will remain free, regardless of your decision to contribute.
+Regardless, you may choose to provide a monetary contribution:
+
+### Improve user experience
+Certain parts of the application user experience are tied to our capacity to pay for services. App signing and Google Sheets integration are good examples of this.
+
+### Cool stuff
+We may choose not to implement some features. This could be related to the complexity required, to the skill set, or to the fact that we just feel it doesn't improve the app for a significant percentage of users. In those cases, a feature may be considered "not worth it," regardless of its pertinence.
+
+As a user, you can choose to sponsor a particular feature or donate to the app so that we can create bounties for features.
+
+### Priorities
+Monetary contributions are most immediately needed to offset the costs of presenting and distributing Ontime, i.e., hosting, domains, and certificates.
+
+Additional funding will be considered according to the needs at the time.
@@ -1,6 +1,6 @@
 {
  "name": "ontime-ui",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.4",
  "private": true,
  "type": "module",
  "dependencies": {
@@ -10,6 +10,7 @@
    "@dnd-kit/utilities": "^3.2.2",
    "@emotion/react": "^11.10.6",
    "@emotion/styled": "^11.10.6",
+    "@fontsource/open-sans": "^5.0.28",
    "@mantine/hooks": "^7.6.2",
    "@react-icons/all-files": "^4.1.0",
    "@sentry/react": "^7.92.0",
@@ -28,9 +29,8 @@
    "react-hook-form": "^7.49.2",
    "react-qr-code": "^2.0.12",
    "react-router-dom": "^6.3.0",
-    "typeface-open-sans": "^1.1.13",
    "web-vitals": "^3.1.1",
-    "zustand": "^4.5.0"
+    "zustand": "^4.5.2"
  },
  "scripts": {
    "addversion": "node -p \"'export const ONTIME_VERSION = ' + JSON.stringify(require('../../package.json').version) + ';'\" > src/ONTIME_VERSION.js",
@@ -61,7 +61,7 @@
    ]
  },
  "devDependencies": {
-    "@sentry/vite-plugin": "^2.14.0",
+    "@sentry/vite-plugin": "^2.16.1",
    "@tanstack/eslint-plugin-query": "^5.8.4",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.1.1",
@@ -87,10 +87,10 @@
    "prettier": "^3.0.3",
    "sass": "^1.57.1",
    "typescript": "^5.4.3",
-    "vite": "^5.1.0",
+    "vite": "^5.2.11",
    "vite-plugin-compression2": "^0.12.0",
    "vite-plugin-svgr": "^4.2.0",
    "vite-tsconfig-paths": "^4.3.1",
-    "vitest": "^1.2.2"
+    "vitest": "^1.6.0"
  }
 }
@@ -1,13 +1,10 @@
-import { useEffect } from 'react';
 import { BrowserRouter } from 'react-router-dom';
 import { ChakraProvider } from '@chakra-ui/react';
 import { QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';

-import { ContextMenu } from './common/components/context-menu/ContextMenu';
 import ErrorBoundary from './common/components/error-boundary/ErrorBoundary';
 import { AppContextProvider } from './common/context/AppContext';
-import useElectronEvent from './common/hooks/useElectronEvent';
 import { ontimeQueryClient } from './common/queryClient';
 import { socketClientName } from './common/stores/connectionName';
 import { connectSocket } from './common/utils/socket';
@@ -15,38 +12,10 @@ import theme from './theme/theme';
 import { TranslationProvider } from './translation/TranslationProvider';
 import AppRouter from './AppRouter';

-// Load Open Sans typeface
-// @ts-expect-error no types from font import
-import('typeface-open-sans');
-
 const preferredClientName = socketClientName.getState().name;
 connectSocket(preferredClientName);

 function App() {
-  const { isElectron, sendToElectron } = useElectronEvent();
-
-  useEffect(() => {
-    const handleKeyPress = (event: KeyboardEvent) => {
-      // handle held key
-      if (event.repeat) return;
-      // check if the alt key is pressed
-      if (event.altKey) {
-        if (event.code === 'KeyT') {
-          // ask to see debug
-          sendToElectron('set-window', 'show-dev');
-        }
-      }
-    };
-
-    if (isElectron) {
-      document.addEventListener('keydown', handleKeyPress);
-    }
-    return () => {
-      if (isElectron) {
-        document.removeEventListener('keydown', handleKeyPress);
-      }
-    };
-  }, [isElectron, sendToElectron]);
  return (
    <ChakraProvider disableGlobalStyle resetCSS theme={theme}>
      <QueryClientProvider client={ontimeQueryClient}>
@@ -55,9 +24,7 @@ function App() {
            <div className='App'>
              <ErrorBoundary>
                <TranslationProvider>
-                  <ContextMenu>
-                    <AppRouter />
-                  </ContextMenu>
+                  <AppRouter />
                </TranslationProvider>
              </ErrorBoundary>
              <ReactQueryDevtools initialIsOpen={false} />
@@ -11,15 +11,15 @@ const dbPath = `${apiEntryUrl}/db`;
 /**
 * HTTP request to the current DB
 */
-async function getDb(): Promise<AxiosResponse<DatabaseModel>> {
-  return axios.get(`${dbPath}/download`);
+async function getDb(fileName?: string): Promise<AxiosResponse<DatabaseModel>> {
+  return axios.post(`${dbPath}/download/`, { fileName });
 }

 /**
 * Request download of the current project file
 * @param fileName
 */
-export async function downloadProject(fileName: string = 'ontime-project') {
+export async function downloadProject(fileName: string) {
  try {
    const { data, name } = await fileDownload(fileName);

@@ -152,7 +152,7 @@ export async function getInfo(): Promise<GetInfo> {
 * @returns
 */
 async function fileDownload(fileName: string): Promise<{ data: DatabaseModel; name: string }> {
-  const response = await getDb();
+  const response = await getDb(fileName);

  const headerLine = response.headers['Content-Disposition'];

@@ -74,8 +74,8 @@ export async function requestApplyDelay(eventId: string): Promise<AxiosResponse<
 /**
 * HTTP request to delete given event
 */
-export async function requestDelete(eventId: string): Promise<AxiosResponse<MessageResponse>> {
-  return axios.delete(`${rundownPath}/${eventId}`);
+export async function requestDelete(eventIds: string[]): Promise<AxiosResponse<MessageResponse>> {
+  return axios.delete(rundownPath, { data: { ids: eventIds } });
 }

 /**
@@ -1,96 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-import {
-  AlertDialog,
-  AlertDialogBody,
-  AlertDialogContent,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogOverlay,
-  Button,
-  IconButton,
-  Tooltip,
-} from '@chakra-ui/react';
-import { IoPowerOutline } from '@react-icons/all-files/io5/IoPowerOutline';
-
-import { useEmitLog } from '../../stores/logger';
-
-interface QuitIconBtnProps {
-  clickHandler: () => void;
-  disabled?: boolean;
-}
-
-const quitBtnStyle = {
-  color: '#D20300', // $red-700
-  borderColor: '#D20300', // $red-700
-  _focus: { boxShadow: 'none' },
-  _hover: {
-    background: '#D20300', // $red-700
-    color: 'white',
-    _disabled: {
-      color: '#D20300', // $red-700
-      background: 'none',
-    },
-  },
-  _active: {
-    background: '#9A0000', // $red-1000
-    color: 'white',
-  },
-  variant: 'outline',
-  isRound: true,
-};
-
-export default function QuitIconBtn(props: QuitIconBtnProps) {
-  const { clickHandler, disabled, ...rest } = props;
-  const [isOpen, setIsOpen] = useState(false);
-  const { emitInfo } = useEmitLog();
-  const onClose = () => setIsOpen(false);
-  const cancelRef = useRef<HTMLButtonElement | null>(null);
-
-  useEffect(() => {
-    if (window.process?.type === 'renderer') {
-      window.ipcRenderer.on('user-request-shutdown', () => {
-        emitInfo('Shutdown request');
-        setIsOpen(true);
-      });
-    }
-  }, [emitInfo]);
-
-  const handleShutdown = useCallback(() => {
-    onClose();
-    clickHandler();
-  }, [clickHandler]);
-
-  return (
-    <>
-      <Tooltip label='Quit Application'>
-        <IconButton
-          aria-label='Quit Application'
-          size='lg'
-          icon={<IoPowerOutline />}
-          onClick={() => setIsOpen(true)}
-          isDisabled={disabled}
-          {...quitBtnStyle}
-          {...rest}
-        />
-      </Tooltip>
-      <AlertDialog isOpen={isOpen} leastDestructiveRef={cancelRef} onClose={onClose}>
-        <AlertDialogOverlay>
-          <AlertDialogContent>
-            <AlertDialogHeader fontSize='lg' fontWeight='bold'>
-              Ontime Shutdown
-            </AlertDialogHeader>
-            <AlertDialogBody>This will shutdown the Ontime server. Are you sure?</AlertDialogBody>
-            <AlertDialogFooter>
-              <Button ref={cancelRef} onClick={onClose} variant='ghost'>
-                Cancel
-              </Button>
-              <Button colorScheme='red' onClick={handleShutdown} ml={3}>
-                Shutdown
-              </Button>
-            </AlertDialogFooter>
-          </AlertDialogContent>
-        </AlertDialogOverlay>
-      </AlertDialog>
-    </>
-  );
-}
@@ -75,6 +75,7 @@ export const ContextMenu = ({ children }: ContextMenuProps) => {
          w={1}
          h={1}
          style={{
+            position: 'fixed',
            left: coords.x,
            top: coords.y,
          }}
@@ -1,27 +1,25 @@
-import { useEffect, useRef } from 'react';
+import { RefObject, useEffect } from 'react';
 import { Textarea, TextareaProps } from '@chakra-ui/react';
 // @ts-expect-error no types from library
 import autosize from 'autosize/dist/autosize';

-export const AutoTextArea = (props: TextareaProps) => {
-  const { value } = props;
-
-  const ref = useRef<HTMLTextAreaElement>(null);
+export const AutoTextArea = (props: TextareaProps & { inputref: RefObject<unknown> }) => {
+  const { value, inputref } = props;

  useEffect(() => {
-    const node = ref.current;
-    autosize(ref.current);
+    const node = inputref.current;
+    autosize(inputref.current);
    return () => {
      autosize.destroy(node);
    };
-  }, [value]);
+  }, [inputref, value]);

  return (
    <Textarea
      overflow='hidden'
      w='100%'
+      ref={inputref}
      resize='none'
-      ref={ref}
      transition='height none'
      variant='ontime-transparent'
      {...props}
@@ -1,9 +1,8 @@
 import { KeyboardEvent, useEffect, useRef, useState } from 'react';
 import { Input, Radio, RadioGroup } from '@chakra-ui/react';
-import { millisToString } from 'ontime-utils';
+import { millisToString, parseUserTime } from 'ontime-utils';

 import { useEventAction } from '../../../hooks/useEventAction';
-import { forgivingStringToMillis } from '../../../utils/dateConfig';

 import style from './DelayInput.module.scss';

@@ -40,7 +39,7 @@ export default function DelayInput(props: DelayInputProps) {
    }

    const isNegative = newValue.startsWith('-');
-    let newMillis = forgivingStringToMillis(newValue);
+    let newMillis = parseUserTime(newValue);

    if (isNegative) {
      newMillis = newMillis * -1;
@@ -1,58 +0,0 @@
-import { useCallback, useRef } from 'react';
-import { Input, Textarea } from '@chakra-ui/react';
-
-import { EventEditorSubmitActions } from '../../../../features/rundown/event-editor/EventEditor';
-import { Size } from '../../../models/Util.type';
-
-import useReactiveTextInput from './useReactiveTextInput';
-
-interface BaseProps {
-  isTextArea?: boolean;
-  isFullHeight?: boolean;
-  size?: Size;
-  field: EventEditorSubmitActions;
-  initialText?: string;
-  submitHandler: (field: EventEditorSubmitActions, newValue: string) => void;
-}
-
-interface TextInputProps extends BaseProps {
-  isTextArea?: false;
-}
-
-type ResizeOptions = 'horizontal' | 'vertical' | 'none';
-
-interface TextAreaProps extends BaseProps {
-  isTextArea: true;
-  resize?: ResizeOptions;
-}
-
-type InputProps = TextInputProps | TextAreaProps;
-
-export default function TextInput(props: InputProps) {
-  const { isTextArea, isFullHeight, size = 'sm', field, initialText = '', submitHandler } = props;
-  const inputRef = useRef(null);
-
-  const submitCallback = useCallback((newValue: string) => submitHandler(field, newValue), [field, submitHandler]);
-
-  const textInputProps = useReactiveTextInput(initialText, submitCallback, { submitOnEnter: true });
-  const textAreaProps = useReactiveTextInput(initialText, submitCallback);
-
-  let resize: ResizeOptions = 'none';
-  if (isTextArea) {
-    resize = (props as TextAreaProps)?.resize ?? 'none';
-  }
-
-  return isTextArea ? (
-    <Textarea
-      ref={inputRef}
-      size={size}
-      resize={resize}
-      variant='ontime-filled'
-      {...textAreaProps}
-      style={{ height: isFullHeight ? '100%' : undefined }}
-      data-testid='input-textarea'
-    />
-  ) : (
-    <Input ref={inputRef} size={size} variant='ontime-filled' {...textInputProps} data-testid='input-textfield' />
-  );
-}
@@ -1,17 +1,20 @@
-import { ChangeEvent, KeyboardEvent, useCallback, useEffect, useState } from 'react';
+import { ChangeEvent, KeyboardEvent, RefObject, useCallback, useEffect, useMemo, useState } from 'react';
+import { getHotkeyHandler, HotkeyItem } from '@mantine/hooks';

 interface UseReactiveTextInputReturn {
  value: string;
  onChange: (event: ChangeEvent) => void;
  onBlur: (event: ChangeEvent) => void;
-  onKeyDown: (event: KeyboardEvent) => void;
+  onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
 }

 export default function useReactiveTextInput(
  initialText: string,
  submitCallback: (newValue: string) => void,
+  ref: RefObject<HTMLInputElement>,
  options?: {
    submitOnEnter?: boolean;
+    submitOnCtrlEnter?: boolean;
  },
 ): UseReactiveTextInputReturn {
  const [text, setText] = useState<string>(initialText);
@@ -44,43 +47,45 @@ export default function useReactiveTextInput(
  const handleSubmit = useCallback(
    (valueToSubmit: string) => {
      // No need to update if it hasn't changed
-      if (valueToSubmit === initialText) {
-        return;
-      }
-      const cleanVal = valueToSubmit.trim();
-      submitCallback(cleanVal);
-
-      if (cleanVal !== valueToSubmit) {
-        setText(cleanVal);
+      if (valueToSubmit !== initialText) {
+        const cleanVal = valueToSubmit.trim();
+        submitCallback(cleanVal);
+        if (cleanVal !== valueToSubmit) {
+          setText(cleanVal);
+        }
      }
+      setTimeout(() => ref.current?.blur()); // Immediate timeout to ensure text is set before bluring
    },
-    [initialText, submitCallback],
+    [initialText, ref, submitCallback],
  );

  /**
-   * @description Handles common keys for submit and cancel
-   * @param {string} key
+   * @description Handles escape events
+   * @param {string} valueToSubmit
   */
-  const keyHandler = useCallback(
-    (key: string) => {
-      switch (key) {
-        case 'Escape':
-          setText(initialText);
-          break;
-        case 'Enter':
-          if (options?.submitOnEnter) {
-            handleSubmit(text);
-          }
-          break;
-      }
-    },
-    [initialText, options?.submitOnEnter, handleSubmit, text],
-  );
+  const handleEscape = useCallback(() => {
+    // No need to update if it hasn't changed
+    setText(initialText);
+    setTimeout(() => ref.current?.blur()); // Immediate timeout to ensure text is set before bluring
+  }, [initialText, ref]);
+
+  const keyHandler = useMemo(() => {
+    const hotKeys: HotkeyItem[] = [['Escape', handleEscape, { preventDefault: true }]];
+
+    if (options?.submitOnEnter) {
+      hotKeys.push(['Enter', () => handleSubmit(text)]);
+    }
+
+    if (options?.submitOnCtrlEnter) {
+      hotKeys.push(['mod + Enter', () => handleSubmit(text)]);
+    }
+    return getHotkeyHandler(hotKeys);
+  }, [handleEscape, handleSubmit, options?.submitOnCtrlEnter, options?.submitOnEnter, text]);

  return {
    value: text,
    onChange: (event: ChangeEvent) => handleChange((event.target as HTMLInputElement).value),
    onBlur: (event: ChangeEvent) => handleSubmit((event.target as HTMLInputElement).value),
-    onKeyDown: (event: KeyboardEvent) => keyHandler(event.key),
+    onKeyDown: keyHandler,
  };
 }
@@ -1,23 +1,21 @@
 import { FocusEvent, KeyboardEvent, useCallback, useEffect, useRef, useState } from 'react';
 import { Input } from '@chakra-ui/react';
-import { millisToString } from 'ontime-utils';
+import { millisToString, parseUserTime } from 'ontime-utils';

 import { useEmitLog } from '../../../stores/logger';
-import { forgivingStringToMillis } from '../../../utils/dateConfig';
-import { cx } from '../../../utils/styleUtils';

-import style from './TimeInput.module.scss';
 interface TimeInputProps<T extends string> {
  name: T;
  submitHandler: (field: T, value: string) => void;
  time?: number;
  placeholder: string;
  disabled?: boolean;
+  align?: 'left' | 'center';
  className?: string;
 }

 export default function TimeInput<T extends string>(props: TimeInputProps<T>) {
-  const { name, submitHandler, time = 0, placeholder, disabled, className } = props;
+  const { name, submitHandler, time = 0, placeholder, disabled, align = 'center', className } = props;
  const { emitError } = useEmitLog();
  const inputRef = useRef<HTMLInputElement | null>(null);
  const [value, setValue] = useState<string>('');
@@ -58,7 +56,7 @@ export default function TimeInput<T extends string>(props: TimeInputProps<T>) {
        submitHandler(name, newValue);
      }

-      const valueInMillis = forgivingStringToMillis(newValue);
+      const valueInMillis = parseUserTime(newValue);
      if (valueInMillis === time) {
        return false;
      }
@@ -117,15 +115,13 @@ export default function TimeInput<T extends string>(props: TimeInputProps<T>) {
    resetValue();
  }, [resetValue, time]);

-  const timeInputClasses = cx([style.timeInput, className]);
-
  return (
    <Input
      disabled={disabled}
      size='sm'
      ref={inputRef}
      data-testid={`time-input-${name}`}
-      className={timeInputClasses}
+      className={className}
      fontSize='1rem'
      type='text'
      placeholder={placeholder}
@@ -136,7 +132,10 @@ export default function TimeInput<T extends string>(props: TimeInputProps<T>) {
      onKeyDown={onKeyDownHandler}
      value={value}
      maxLength={8}
+      maxWidth='7.5em'
+      letterSpacing='1px'
      autoComplete='off'
+      textAlign={align}
    />
  );
 }
@@ -6,7 +6,3 @@ $input-delayed-border-color: $ontime-delay-text;
    border: 1px solid $input-delayed-border-color;
  }
 }
-
-.inputField {
-  max-width: 7.75em;
-}
@@ -28,7 +28,7 @@ export default function TimeInputWithButton<T extends string>(props: PropsWithCh
        submitHandler={submitHandler}
        time={time}
        placeholder={placeholder}
-        className={style.inputField}
+        align='left'
        disabled={disabled}
      />
      {children}
@@ -24,6 +24,8 @@ interface ScheduleProviderProps {
  time?: number;
 }

+const numEventsPerPage = 8;
+
 export const ScheduleProvider = ({
  children,
  events,
@@ -37,7 +39,7 @@ export const ScheduleProvider = ({
  // look for overrides from views
  const hidePast = isStringBoolean(searchParams.get('hidePast'));
  const stopCycle = isStringBoolean(searchParams.get('stopCycle'));
-  const eventsPerPage = Number(searchParams.get('eventsPerPage') ?? 7);
+  const eventsPerPage = Number(searchParams.get('eventsPerPage') ?? numEventsPerPage);

  let selectedEventIndex = events.findIndex((event) => event.id === selectedEventId);

@@ -103,7 +103,7 @@ export const getClockOptions = (timeFormat: string): ParamField[] => [
 ];

 export const getTimerOptions = (timeFormat: string, customFields: CustomFields): ParamField[] => {
-  const secondaryOptions = makeOptionsFromCustomFields(customFields);
+  const secondaryOptions = makeOptionsFromCustomFields(customFields, { note: 'Note' });
  return [
    getTimeOption(timeFormat),
    hideTimerSeconds,
@@ -249,12 +249,11 @@ export const MINIMAL_TIMER_OPTIONS: ParamField[] = [
 export const getLowerThirdOptions = (customFields: CustomFields): ParamField[] => {
  const topSourceOptions = makeOptionsFromCustomFields(customFields, {
    title: 'Title',
-    lowerMsg: 'Lower Third Message',
  });

  const bottomSourceOptions = makeOptionsFromCustomFields(customFields, {
    title: 'Title',
-    lowerMsg: 'Lower Third Message',
+    none: 'None',
  });

  return [
@@ -267,7 +266,7 @@ export const getLowerThirdOptions = (customFields: CustomFields): ParamField[] =
        event: 'Event Load',
        manual: 'Manual',
      },
-      defaultValue: 'event',
+      defaultValue: 'manual',
    },
    {
      id: 'top-src',
@@ -283,7 +282,7 @@ export const getLowerThirdOptions = (customFields: CustomFields): ParamField[] =
      description: 'Select the data source for the bottom element',
      type: 'option',
      values: bottomSourceOptions,
-      defaultValue: 'lowerMsg',
+      defaultValue: 'none',
    },
    {
      id: 'top-colour',
@@ -394,9 +393,9 @@ export const getBackstageOptions = (timeFormat: string, customFields: CustomFiel
    {
      id: 'eventsPerPage',
      title: 'Events per page',
-      description: 'Sets the number of events on the page, can cause overlow',
+      description: 'Sets the number of events on the page, can cause overflow',
      type: 'number',
-      placeholder: '7 (default)',
+      placeholder: '8 (default)',
    },
    {
      id: 'secondary-src',
@@ -431,9 +430,9 @@ export const getPublicOptions = (timeFormat: string, customFields: CustomFields)
    {
      id: 'eventsPerPage',
      title: 'Events per page',
-      description: 'Sets the number of events on the page, can cause overlow',
+      description: 'Sets the number of events on the page, can cause overflow',
      type: 'number',
-      placeholder: '7 (default)',
+      placeholder: '8 (default)',
    },
    {
      id: 'secondary-src',
@@ -1,7 +1,15 @@
 import { useCallback } from 'react';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { isOntimeEvent, MaybeString, OntimeEvent, OntimeRundownEntry, RundownCached } from 'ontime-types';
-import { getLinkedTimes, getPreviousEventNormal, reorderArray, swapEventData } from 'ontime-utils';
+import {
+  dayInMs,
+  getLinkedTimes,
+  getPreviousEventNormal,
+  MILLIS_PER_SECOND,
+  parseUserTime,
+  reorderArray,
+  swapEventData,
+} from 'ontime-utils';

 import { RUNDOWN } from '../api/constants';
 import {
@@ -18,14 +26,13 @@ import {
 } from '../api/rundown';
 import { logAxiosError } from '../api/utils';
 import { useEditorSettings } from '../stores/editorSettings';
-import { forgivingStringToMillis } from '../utils/dateConfig';

 /**
- * @description Set of utilities for events
+ * @description Set of utilities for events //TODO: should this be called useEntryAction and so on
 */
 export const useEventAction = () => {
  const queryClient = useQueryClient();
-  const { defaultPublic, linkPrevious, defaultDuration } = useEditorSettings((state) => state.eventSettings);
+  const { defaultPublic, linkPrevious, defaultDuration, defaultWarnTime, defaultDangerTime } = useEditorSettings();

  /**
   * Calls mutation to add new event
@@ -48,6 +55,8 @@ export const useEventAction = () => {
      defaultPublic: boolean;
      linkPrevious: boolean;
      lastEventId: string;
+      defaultWarnTime: number;
+      defaultDangerTime: number;
    }>;

  /**
@@ -64,6 +73,8 @@ export const useEventAction = () => {
          defaultPublic: options?.defaultPublic ?? defaultPublic,
          lastEventId: options?.lastEventId,
          linkPrevious: options?.linkPrevious ?? linkPrevious,
+          defaultWarnTime,
+          defaultDangerTime,
        };

        if (applicationOptions.linkPrevious && applicationOptions?.lastEventId) {
@@ -83,7 +94,15 @@ export const useEventAction = () => {
        }

        if (newEvent.duration === undefined && newEvent.timeEnd === undefined) {
-          newEvent.duration = forgivingStringToMillis(defaultDuration);
+          newEvent.duration = parseUserTime(defaultDuration);
+        }
+
+        if (newEvent.timeDanger === undefined) {
+          newEvent.timeDanger = parseUserTime(defaultDangerTime);
+        }
+
+        if (newEvent.timeWarning === undefined) {
+          newEvent.timeWarning = parseUserTime(defaultWarnTime);
        }
      }

@@ -98,7 +117,7 @@ export const useEventAction = () => {
        logAxiosError('Failed adding event', error);
      }
    },
-    [_addEventMutation, defaultDuration, defaultPublic, linkPrevious],
+    [_addEventMutation, defaultDangerTime, defaultDuration, defaultPublic, defaultWarnTime, linkPrevious, queryClient],
  );

  /**
@@ -155,7 +174,7 @@ export const useEventAction = () => {

  const updateCustomField = useCallback(
    async (eventId: string, field: string, value: string) => {
-      updateEvent({ id: eventId, custom: { [field]: { value } } });
+      updateEvent({ id: eventId, custom: { [field]: value } });
    },
    [updateEvent],
  );
@@ -198,14 +217,17 @@ export const useEventAction = () => {
      } else if (value.startsWith('+') || value.startsWith('p+') || value.startsWith('p +')) {
        // TODO: is this logic solid?
        const remainingString = value.substring(1);
-        newValMillis = getPreviousEnd() + forgivingStringToMillis(remainingString);
+        newValMillis = getPreviousEnd() + parseUserTime(remainingString);
      } else {
-        newValMillis = forgivingStringToMillis(value);
+        newValMillis = parseUserTime(value);
      }

+      // dont allow timer values over 23:59:59
+      const cappedMillis = Math.min(newValMillis, dayInMs - MILLIS_PER_SECOND);
+
      const newEvent = {
        id: eventId,
-        [field]: newValMillis,
+        [field]: cappedMillis,
      };
      try {
        await _updateEventMutation.mutateAsync(newEvent);
@@ -315,7 +337,7 @@ export const useEventAction = () => {
  const _deleteEventMutation = useMutation({
    mutationFn: requestDelete,
    // we optimistically update here
-    onMutate: async (eventId) => {
+    onMutate: async (eventIds: string[]) => {
      // cancel ongoing queries
      await queryClient.cancelQueries({ queryKey: RUNDOWN });

@@ -324,9 +346,11 @@ export const useEventAction = () => {

      if (previousData) {
        // optimistically update object
-        const newOrder = previousData.order.filter((id) => id !== eventId);
+        const newOrder = previousData.order.filter((id) => !eventIds.includes(id));
        const newRundown = { ...previousData.rundown };
-        delete newRundown[eventId];
+        for (const eventId of eventIds) {
+          delete newRundown[eventId];
+        }

        queryClient.setQueryData(RUNDOWN, {
          order: newOrder,
@@ -355,9 +379,9 @@ export const useEventAction = () => {
   * Deletes an event form the list
   */
  const deleteEvent = useCallback(
-    async (eventId: string) => {
+    async (eventIds: string[]) => {
      try {
-        await _deleteEventMutation.mutateAsync(eventId);
+        await _deleteEventMutation.mutateAsync(eventIds);
      } catch (error) {
        logAxiosError('Error deleting event', error);
      }
@@ -1,46 +0,0 @@
-import { useSyncExternalStore } from 'react';
-
-const STORAGE_EVENT = 'ontime-storage';
-
-function getSnapshot(key: string): string | null {
-  try {
-    return window.localStorage.getItem(`ontime-${key}`);
-  } catch {
-    return null;
-  }
-}
-
-function getParsedJson<T>(localStorageValue: string | null, initialValue: T): T {
-  try {
-    return localStorageValue ? JSON.parse(localStorageValue) : initialValue;
-  } catch {
-    return initialValue;
-  }
-}
-
-export const useLocalStorage = <T>(key: string, initialValue: T) => {
-  const localStorageValue = useSyncExternalStore(subscribe, () => getSnapshot(key));
-  const parsedLocalStorageValue = getParsedJson(localStorageValue, initialValue);
-
-  /**
-   * @description Set value to local storage
-   * @param value
-   */
-  const setLocalStorageValue = (value: T | ((val: T) => T)) => {
-    // Allow value to be a function so we have same API as useState
-    const valueToStore = value instanceof Function ? value(parsedLocalStorageValue) : value;
-
-    localStorage.setItem(`ontime-${key}`, JSON.stringify(valueToStore));
-    window.dispatchEvent(new StorageEvent(STORAGE_EVENT));
-  };
-
-  return [parsedLocalStorageValue, setLocalStorageValue] as const;
-};
-
-function subscribe(callback: () => void) {
-  window.addEventListener(STORAGE_EVENT, callback);
-
-  return () => {
-    window.removeEventListener(STORAGE_EVENT, callback);
-  };
-}
@@ -25,8 +25,6 @@ export const useOperator = () => {
 export const useMessageControl = () => {
  const featureSelector = (state: RuntimeStore) => ({
    timer: state.message.timer,
-    public: state.message.public,
-    lower: state.message.lower,
    external: state.message.external,
    onAir: state.onAir,
  });
@@ -37,10 +35,6 @@ export const useMessageControl = () => {
 export const setMessage = {
  timerText: (payload: string) => socketSendJson('message', { timer: { text: payload } }),
  timerVisible: (payload: boolean) => socketSendJson('message', { timer: { visible: payload } }),
-  publicText: (payload: string) => socketSendJson('message', { public: { text: payload } }),
-  publicVisible: (payload: boolean) => socketSendJson('message', { public: { visible: payload } }),
-  lowerText: (payload: string) => socketSendJson('message', { lower: { text: payload } }),
-  lowerVisible: (payload: boolean) => socketSendJson('message', { lower: { visible: payload } }),
  timerBlink: (payload: boolean) => socketSendJson('message', { timer: { blink: payload } }),
  timerBlackout: (payload: boolean) => socketSendJson('message', { timer: { blackout: payload } }),
 };
@@ -89,13 +83,13 @@ export const useInfoPanel = () => {
  return useRuntimeStore(featureSelector);
 };

-export const useExtraTimerTime = () => {
+export const useAuxTimerTime = () => {
  const featureSelector = (state: RuntimeStore) => state.auxtimer1.current;

  return useRuntimeStore(featureSelector);
 };

-export const useExtraTimerControl = () => {
+export const useAuxTimerControl = () => {
  const featureSelector = (state: RuntimeStore) => ({
    playback: state.auxtimer1.playback,
    direction: state.auxtimer1.direction,
@@ -104,7 +98,7 @@ export const useExtraTimerControl = () => {
  return useRuntimeStore(featureSelector);
 };

-export const setExtraTimer = {
+export const setAuxTimer = {
  start: () => socketSendJson('auxtimer', { '1': SimplePlayback.Start }),
  pause: () => socketSendJson('auxtimer', { '1': SimplePlayback.Pause }),
  stop: () => socketSendJson('auxtimer', { '1': SimplePlayback.Stop }),
@@ -33,5 +33,5 @@ export const useAppMode = create<AppModeStore>()((set) => ({
      return { mode };
    });
  },
-  setCursor: (cursor: string | null) => set(() => ({ cursor })),
+  setCursor: (cursor: string | null) => set({ cursor }),
 }));
@@ -2,55 +2,68 @@ import { create } from 'zustand';

 import { booleanFromLocalStorage } from '../utils/localStorage';

-type EditorSettings = {
-  linkPrevious: boolean;
-  defaultPublic: boolean;
+type EditorSettingsStore = {
  defaultDuration: string;
+  linkPrevious: boolean;
+  defaultWarnTime: string;
+  defaultDangerTime: string;
+  defaultPublic: boolean;
+  setDefaultDuration: (defaultDuration: string) => void;
+  setLinkPrevious: (linkPrevious: boolean) => void;
+  setWarnTime: (warnTime: string) => void;
+  setDangerTime: (dangerTime: string) => void;
+  setDefaultPublic: (defaultPublic: boolean) => void;
 };

-type EditorSettingsStore = {
-  eventSettings: EditorSettings;
-  setLocalEventSettings: (newState: EditorSettings) => void;
-  setLinkPrevious: (linkPrevious: boolean) => void;
-  setDefaultPublic: (defaultPublic: boolean) => void;
-  setDefaultDuration: (defaultDuration: string) => void;
+export const editorSettingsDefaults = {
+  duration: '00:10:00',
+  linkPrevious: true,
+  warnTime: '00:02:00', // 120000 same as backend
+  dangerTime: '00:01:00', // 60000 same as backend
+  isPublic: true,
 };

 enum EditorSettingsKeys {
-  LinkPrevious = 'ontime-link-previous',
-  DefaultPublic = 'ontime-default-public',
  DefaultDuration = 'ontime-default-duration',
+  LinkPrevious = 'ontime-link-previous',
+  DefaultWarnTime = 'ontime-default-warn-time',
+  DefaultDangerTime = 'ontime-default-danger-time',
+  DefaultPublic = 'ontime-default-public',
 }

-export const useEditorSettings = create<EditorSettingsStore>((set) => ({
-  eventSettings: {
-    linkPrevious: booleanFromLocalStorage(EditorSettingsKeys.LinkPrevious, true),
-    defaultPublic: booleanFromLocalStorage(EditorSettingsKeys.DefaultPublic, true),
-    defaultDuration: localStorage.getItem(EditorSettingsKeys.DefaultDuration) ?? '00:10:00',
-  },
+export const useEditorSettings = create<EditorSettingsStore>((set) => {
+  return {
+    defaultDuration: localStorage.getItem(EditorSettingsKeys.DefaultDuration) ?? editorSettingsDefaults.duration,
+    linkPrevious: booleanFromLocalStorage(EditorSettingsKeys.LinkPrevious, editorSettingsDefaults.linkPrevious),
+    defaultWarnTime: localStorage.getItem(EditorSettingsKeys.DefaultWarnTime) ?? editorSettingsDefaults.warnTime,
+    defaultDangerTime: localStorage.getItem(EditorSettingsKeys.DefaultDangerTime) ?? editorSettingsDefaults.dangerTime,
+    defaultPublic: booleanFromLocalStorage(EditorSettingsKeys.DefaultPublic, editorSettingsDefaults.isPublic),

-  setLocalEventSettings: (value) =>
-    set(() => {
-      localStorage.setItem(EditorSettingsKeys.LinkPrevious, String(value.linkPrevious));
-      localStorage.setItem(EditorSettingsKeys.DefaultPublic, String(value.defaultPublic));
-      return { eventSettings: value };
-    }),
+    setDefaultDuration: (defaultDuration) =>
+      set(() => {
+        localStorage.setItem(EditorSettingsKeys.DefaultDuration, String(defaultDuration));
+        return { defaultDuration };
+      }),

-  setLinkPrevious: (linkPrevious) =>
-    set((state) => {
-      localStorage.setItem(EditorSettingsKeys.LinkPrevious, String(linkPrevious));
-      return { eventSettings: { ...state.eventSettings, linkPrevious } };
-    }),
-
-  setDefaultPublic: (defaultPublic) =>
-    set((state) => {
-      localStorage.setItem(EditorSettingsKeys.DefaultPublic, String(defaultPublic));
-      return { eventSettings: { ...state.eventSettings, defaultPublic } };
-    }),
-
-  setDefaultDuration: (defaultDuration) =>
-    set((state) => {
-      localStorage.setItem(EditorSettingsKeys.DefaultDuration, String(defaultDuration));
-      return { eventSettings: { ...state.eventSettings, defaultDuration } };
-    }),
-}));
+    setLinkPrevious: (linkPrevious) =>
+      set(() => {
+        localStorage.setItem(EditorSettingsKeys.LinkPrevious, String(linkPrevious));
+        return { linkPrevious };
+      }),
+    setWarnTime: (defaultWarnTime) =>
+      set(() => {
+        localStorage.setItem(EditorSettingsKeys.DefaultWarnTime, String(defaultWarnTime));
+        return { defaultWarnTime };
+      }),
+    setDangerTime: (defaultDangerTime) =>
+      set(() => {
+        localStorage.setItem(EditorSettingsKeys.DefaultDangerTime, String(defaultDangerTime));
+        return { defaultDangerTime };
+      }),
+    setDefaultPublic: (defaultPublic) =>
+      set(() => {
+        localStorage.setItem(EditorSettingsKeys.DefaultPublic, String(defaultPublic));
+        return { defaultPublic };
+      }),
+  };
+});
@@ -0,0 +1,11 @@
+import { create } from 'zustand';
+
+type EntryCopyStore = {
+  entryCopyId: string | null;
+  setEntryCopyId: (eventId: string | null) => void;
+};
+
+export const useEntryCopy = create<EntryCopyStore>()((set) => ({
+  entryCopyId: null,
+  setEntryCopyId: (entryCopyId: string | null) => set({ entryCopyId }),
+}));
@@ -23,14 +23,6 @@ export const runtimeStorePlaceholder: RuntimeStore = {
      blink: false,
      blackout: false,
    },
-    public: {
-      text: '',
-      visible: false,
-    },
-    lower: {
-      text: '',
-      visible: false,
-    },
    external: {
      text: '',
      visible: false,
@@ -1,263 +1,4 @@
-import { forgivingStringToMillis, millisToDelayString } from '../dateConfig';
-
-describe('test forgivingStringToMillis()', () => {
-  describe('function handles time with no separators', () => {
-    const testData = [
-      { value: '', expect: 0 },
-      { value: '0', expect: 0 },
-      { value: '-0', expect: 0 },
-      { value: '1', expect: 60 * 1000 },
-      { value: '-1', expect: 60 * 1000 },
-      { value: '0h0m0s', expect: 0 },
-      { value: '0h0m1s', expect: 1000 },
-      { value: '0h1m0s', expect: 1000 * 60 },
-      { value: '1h0m0s', expect: 1000 * 60 * 60 },
-      { value: '23h0m0s', expect: 1000 * 60 * 60 * 23 },
-      { value: '12h12m12s', expect: 12 * 1000 + 12 * 60 * 1000 + 12 * 1000 * 60 * 60 },
-      { value: '12H12M12S', expect: 12 * 1000 + 12 * 60 * 1000 + 12 * 1000 * 60 * 60 },
-      { value: '2m', expect: 2 * 60 * 1000 },
-      { value: '1h5s', expect: 1000 * 60 * 60 + 1000 * 5 },
-      { value: '1h2m', expect: 1000 * 60 * 60 + 1000 * 60 * 2 },
-    ];
-
-    for (const s of testData) {
-      it(`handles ${s.value} to left`, () => {
-        expect(typeof forgivingStringToMillis(s.value)).toBe('number');
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-  });
-
-  describe('parses strings correctly', () => {
-    const ts = [
-      { value: '1.1.1', expect: 60 * 60 * 1000 + 60 * 1000 + 1000 },
-      { value: '12.1.1', expect: 12 * 60 * 60 * 1000 + 60 * 1000 + 1000 },
-      { value: '12.55.1', expect: 12 * 60 * 60 * 1000 + 55 * 60 * 1000 + 1000 },
-      { value: '12.55.40', expect: 12 * 60 * 60 * 1000 + 55 * 60 * 1000 + 40 * 1000 },
-    ];
-
-    for (const s of ts) {
-      it(`handles ${s.value} to the left`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-  });
-
-  describe('parses time strings', () => {
-    const ts = [
-      { value: '1h2m3s', expect: 60 * 60 * 1000 + 2 * 60 * 1000 + 3 * 1000 },
-      { value: '1h3s', expect: 60 * 60 * 1000 + 3 * 1000 },
-      { value: '1h2m', expect: 60 * 60 * 1000 + 2 * 60 * 1000 },
-      { value: '10h', expect: 10 * 60 * 60 * 1000 },
-      { value: '10m', expect: 10 * 60 * 1000 },
-      { value: '10s', expect: 10 * 1000 },
-      { value: '120h', expect: 120 * 60 * 60 * 1000 },
-      { value: '120m', expect: 120 * 60 * 1000 },
-      { value: '120s', expect: 120 * 1000 },
-    ];
-
-    for (const s of ts) {
-      it(`handles ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-  });
-
-  describe('handles am/pm', () => {
-    const ampm = [
-      { value: '9:10:11am', expect: 9 * 60 * 60 * 1000 + 10 * 60 * 1000 + 11 * 1000 },
-      { value: '9:10:11a', expect: 9 * 60 * 60 * 1000 + 10 * 60 * 1000 + 11 * 1000 },
-      { value: '9:10:11pm', expect: (12 + 9) * 60 * 60 * 1000 + 10 * 60 * 1000 + 11 * 1000 },
-      { value: '9:10:11p', expect: (12 + 9) * 60 * 60 * 1000 + 10 * 60 * 1000 + 11 * 1000 },
-      { value: '9:10am', expect: 9 * 60 * 60 * 1000 + 10 * 60 * 1000 },
-      { value: '9:10a', expect: 9 * 60 * 60 * 1000 + 10 * 60 * 1000 },
-      { value: '9:10pm', expect: (12 + 9) * 60 * 60 * 1000 + 10 * 60 * 1000 },
-      { value: '9:10p', expect: (12 + 9) * 60 * 60 * 1000 + 10 * 60 * 1000 },
-      { value: '9am', expect: 9 * 60 * 60 * 1000 },
-      { value: '9a', expect: 9 * 60 * 60 * 1000 },
-      { value: '9pm', expect: (12 + 9) * 60 * 60 * 1000 },
-      { value: '9p', expect: (12 + 9) * 60 * 60 * 1000 },
-      { value: '12am', expect: 0 },
-      { value: '12pm', expect: 12 * 60 * 60 * 1000 },
-    ];
-
-    for (const s of ampm) {
-      it(`handles ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-  });
-
-  describe('it infers separators when non existent', () => {
-    const testCases = [
-      { value: '1', expect: 1000 * 60 }, // 00:01:00
-      { value: '12', expect: 1000 * 60 * 12 }, // 00:12:00
-      { value: '123', expect: 1000 * 60 * 23 + 1000 * 60 * 60 }, // 01:23:00
-      { value: '1234', expect: 1000 * 60 * 34 + 1000 * 60 * 60 * 12 }, // 12:34:00
-      { value: '12345', expect: 1000 * 60 * 34 + 1000 * 60 * 60 * 12 + 5 * 1000 }, // 12:34:05
-      { value: '123456', expect: 1000 * 60 * 34 + 1000 * 60 * 60 * 12 + 56 * 1000 }, // 12:34:56
-    ];
-
-    for (const s of testCases) {
-      it(`handles basic strings digits: ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-
-    const sixDigits = [
-      { value: '000000', expect: 0 },
-      { value: '000001', expect: 1000 },
-      { value: '000100', expect: 1000 * 60 },
-      { value: '010000', expect: 1000 * 60 * 60 },
-      { value: '230000', expect: 1000 * 60 * 60 * 23 },
-      { value: '121212', expect: 12 * 1000 + 12 * 60 * 1000 + 12 * 1000 * 60 * 60 },
-    ];
-
-    for (const s of sixDigits) {
-      it(`handles string with 6 digits: ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-
-    const fiveDigits = [
-      { value: '00000', expect: 0 },
-      { value: '00001', expect: 1000 }, // 00:00:01
-      { value: '00010', expect: 1000 * 60 }, // 00:01:00
-      { value: '00100', expect: 1000 * 60 * 10 }, // 00:10:00
-      { value: '01000', expect: 1000 * 60 * 60 }, // 01:00:00
-      { value: '10000', expect: 1000 * 60 * 60 * 10 }, // 10:00:00
-      { value: '23000', expect: 1000 * 60 * 60 * 23 }, // 23:00:00
-      { value: '12121', expect: 1000 + 12 * 60 * 1000 + 12 * 1000 * 60 * 60 }, // 12:12:01
-    ];
-
-    for (const s of fiveDigits) {
-      it(`handles string with 5 digits: ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-
-    const fourDigits = [
-      { value: '0000', expect: 0 },
-      { value: '0001', expect: 1000 * 60 }, // 00:01:00
-      { value: '0010', expect: 1000 * 60 * 10 }, // 00:10:00
-      { value: '0100', expect: 1000 * 60 * 60 }, // 01:00:00
-      { value: '1000', expect: 1000 * 60 * 60 * 10 }, // 10:00:00
-      { value: '2300', expect: 1000 * 60 * 60 * 23 }, // 23:00:00
-      { value: '1212', expect: 12 * 60 * 1000 + 12 * 1000 * 60 * 60 }, // 12:12:00
-    ];
-
-    for (const s of fourDigits) {
-      it(`handles string with 4 digits: ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-
-    const threeDigits = [
-      { value: '000', expect: 0 },
-      { value: '001', expect: 1000 * 60 }, // 00:01:00
-      { value: '010', expect: 1000 * 60 * 10 }, // 00:10:00
-      { value: '100', expect: 1000 * 60 * 60 }, // 01:00:00
-      { value: '230', expect: 2 * 1000 * 60 * 60 + 30 * 1000 * 60 }, // 02:30:00
-      { value: '121', expect: 21 * 60 * 1000 + 1000 * 60 * 60 }, // 01:21:00
-    ];
-
-    for (const s of threeDigits) {
-      it(`handles string with 3 digits: ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-
-    const twoDigits = [
-      { value: '00', expect: 0 },
-      { value: '01', expect: 1000 * 60 }, // 00:01:00
-      { value: '10', expect: 1000 * 60 * 10 }, // 00:10:00
-      { value: '23', expect: 1000 * 60 * 23 }, // 00:23:00
-    ];
-
-    for (const s of twoDigits) {
-      it(`handles string with 2 digits: ${s.value}`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-
-    const singleDigit = [...Array(10).keys()];
-
-    for (const s of singleDigit) {
-      it(`handles string with a single digits ${s}`, () => {
-        expect(forgivingStringToMillis(`${s}`)).toBe(s * 1000 * 60);
-      });
-    }
-  });
-
-  describe('handles overflows', () => {
-    const ts = [
-      // minutes overflow
-      { value: '2.0.0', expect: 1000 * 60 * 120 },
-      { value: '99', expect: 1000 * 60 * 99 },
-      { value: '1.39.0', expect: 1000 * 60 * 99 },
-      // seconds overflow
-      { value: '0.0.120', expect: 120 * 1000 },
-      { value: '0.2.0', expect: 120 * 1000 },
-      { value: '0.0.99', expect: 99 * 1000 },
-      { value: '0.1.39', expect: 99 * 1000 },
-      // hours overflow
-      { value: '25.0.0', expect: 1000 * 60 * 60 * 25 },
-      // hours overflow
-      { value: '50.0.0', expect: 1000 * 60 * 60 * 50 },
-    ];
-
-    for (const s of ts) {
-      it(`handles ${s.value} to the left`, () => {
-        expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-      });
-    }
-  });
-
-  describe('test fillLeft', () => {
-    describe('function handles separators', () => {
-      const testData = [
-        { value: '1:2:3:10', expect: 3723000 },
-        { value: '2,10', expect: 2 * 60 * 60 * 1000 + 60 * 10 * 1000 },
-        { value: '2.10', expect: 2 * 60 * 60 * 1000 + 60 * 10 * 1000 },
-        { value: '2 10', expect: 2 * 60 * 60 * 1000 + 60 * 10 * 1000 },
-      ];
-
-      for (const s of testData) {
-        it(`handles ${s.value}`, () => {
-          expect(typeof forgivingStringToMillis(s.value)).toBe('number');
-          expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-        });
-      }
-    });
-
-    describe('parses strings correctly', () => {
-      const ts = [
-        { value: '1.2', expect: 60 * 60 * 1000 + 2 * 60 * 1000 },
-        { value: '1.70', expect: 60 * 60 * 1000 + 70 * 60 * 1000 },
-      ];
-
-      for (const s of ts) {
-        it(`handles ${s.value}`, () => {
-          expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-        });
-      }
-    });
-
-    describe('handles overflows', () => {
-      const ts = [
-        // minutes overflow
-        { value: '0.120', expect: 120 * 60 * 1000 },
-        { value: '0.99', expect: 99 * 60 * 1000 },
-      ];
-
-      for (const s of ts) {
-        it(`handles ${s.value}`, () => {
-          expect(forgivingStringToMillis(s.value)).toBe(s.expect);
-        });
-      }
-    });
-  });
-});
+import { millisToDelayString } from '../dateConfig';

 describe('millisToDelayString()', () => {
  it('returns null for null values', () => {
@@ -22,7 +22,7 @@ describe('cloneEvent()', () => {
      timeWarning: 120000,
      timeDanger: 60000,
      custom: {
-        lighting: { value: '3' },
+        lighting: '3',
      } as EventCustomFields,
    } as OntimeEvent;

@@ -1,163 +1,11 @@
 import { MaybeNumber } from 'ontime-types';
-import { formatFromMillis, MILLIS_PER_HOUR, MILLIS_PER_MINUTE, MILLIS_PER_SECOND } from 'ontime-utils';
+import { formatFromMillis, MILLIS_PER_HOUR, MILLIS_PER_MINUTE } from 'ontime-utils';

 /**
- * @description safe parse string to int
- * @param {string} valueAsString
- * @return {number}
+ * Parses a value in millis to a string which encodes a delay
+ * @param millis 
+ * @param format 
 */
-const parse = (valueAsString: string): number => {
-  const parsed = parseInt(valueAsString, 10);
-  if (isNaN(parsed)) {
-    return 0;
-  }
-  return Math.abs(parsed);
-};
-
-/**
- * @description Utility function to check if a string contain am/pm indicators
- * @param {string} value
- */
-function checkAmPm(value: string) {
-  let isPM = false;
-  let isAM = false;
-  if (value.toLowerCase().includes('pm')) {
-    isPM = true;
-    value = value.replace(/pm/i, '');
-  } else if (value.toLowerCase().includes('p')) {
-    isPM = true;
-    value = value.replace(/p/i, '');
-  }
-
-  // we need to remove am, but it doesn't actually change anything
-  if (value.toLowerCase().includes('am')) {
-    isAM = true;
-    value = value.replace(/am/i, '');
-  } else if (value.toLowerCase().includes('a')) {
-    isAM = true;
-    value = value.replace(/a/i, '');
-  }
-
-  return { isAM, isPM, value };
-}
-
-/**
- * @description Utility function to check if a string contain h / m / s indicators
- * @param {string} value
- */
-function checkMatchers(value: string) {
-  const hoursMatch = /(\d+)h/i.exec(value);
-  const hoursMatchValue = hoursMatch ? parse(hoursMatch[1]) : 0;
-
-  const minutesMatch = /(\d+)m/i.exec(value);
-  const minutesMatchValue = minutesMatch ? parse(minutesMatch[1]) : 0;
-
-  const secondsMatch = /(\d+)s/i.exec(value);
-  const secondsMatchValue = secondsMatch ? parse(secondsMatch[1]) : 0;
-
-  if (hoursMatchValue > 0 || minutesMatchValue > 0 || secondsMatchValue > 0) {
-    return (
-      hoursMatchValue * MILLIS_PER_HOUR + minutesMatchValue * MILLIS_PER_MINUTE + secondsMatchValue * MILLIS_PER_SECOND
-    );
-  }
-  return { hoursMatchValue };
-}
-
-/**
- * @description Utility function to infer separators from a whole string
- * @param {string} value
- * @param {boolean} isAM
- * @param {boolean} isPM
- */
-function inferSeparators(value: string, isAM: boolean, isPM: boolean) {
-  const length = value.length;
-  let inferredMillis = 0;
-  let addAM = 0;
-  if (length === 1) {
-    if (isPM || isAM) {
-      inferredMillis = parse(value) * MILLIS_PER_HOUR;
-      if (isAM) {
-        // this ensures we dont add 12 hours in the end
-        addAM = inferredMillis;
-      }
-    } else {
-      inferredMillis = parse(value) * MILLIS_PER_MINUTE;
-    }
-  } else if (length === 2) {
-    if (isPM || isAM) {
-      inferredMillis = parse(value) * inferredMillis;
-      if (isAM) {
-        // this ensures we dont add 12 hours in the end
-        addAM = 12;
-      }
-    } else {
-      inferredMillis = parse(value) * MILLIS_PER_MINUTE;
-    }
-  } else if (length === 3) {
-    inferredMillis = parse(value[0]) * MILLIS_PER_HOUR + parse(value.substring(1)) * MILLIS_PER_MINUTE;
-  } else if (length === 4) {
-    inferredMillis = parse(value.substring(0, 2)) * MILLIS_PER_HOUR + parse(value.substring(2)) * MILLIS_PER_MINUTE;
-  } else if (length === 5) {
-    const hours = parse(value.substring(0, 2));
-    const minutes = parse(value.substring(2, 4));
-    const seconds = parse(value.substring(4));
-    inferredMillis = hours * MILLIS_PER_HOUR + minutes * MILLIS_PER_MINUTE + seconds * MILLIS_PER_SECOND;
-  } else if (length >= 6) {
-    const hours = parse(value.substring(0, 2));
-    const minutes = parse(value.substring(2, 4));
-    const seconds = parse(value.substring(4));
-    inferredMillis = hours * MILLIS_PER_HOUR + minutes * MILLIS_PER_MINUTE + seconds * MILLIS_PER_SECOND;
-  }
-  return { inferredMillis, addAM };
-}
-
-/**
- * @description Parses a time string to millis, auto-filling to the left
- * @param {string} value - time string
- * @returns {number} - time string in millis
- */
-export const forgivingStringToMillis = (value: string): number => {
-  if (value === '12am') {
-    return 0;
-  }
-
-  const { isAM, isPM, value: parsingValue } = checkAmPm(value);
-  const maybeMillisFromMatchers = checkMatchers(parsingValue);
-  if (typeof maybeMillisFromMatchers === 'number') {
-    return maybeMillisFromMatchers;
-  }
-
-  let { hoursMatchValue } = maybeMillisFromMatchers;
-
-  let millis = 0;
-
-  // split string at known separators    : , .
-  const separatorRegex = /[\s,:.]+/;
-  const [first, second, third] = parsingValue.split(separatorRegex);
-
-  if (first != null && second != null && third != null) {
-    // if string has three sections, treat as [hours] [minutes] [seconds]
-    millis = parse(first) * MILLIS_PER_HOUR;
-    millis += parse(second) * MILLIS_PER_MINUTE;
-    millis += parse(third) * MILLIS_PER_SECOND;
-  } else if (first != null && second == null && third == null) {
-    // we only have one section, infer separators
-    const { inferredMillis, addAM } = inferSeparators(first, isAM, isPM);
-    millis = inferredMillis;
-    hoursMatchValue = addAM;
-  }
-  if (first != null && second != null && third == null) {
-    millis = parse(first) * MILLIS_PER_HOUR;
-    millis += parse(second) * MILLIS_PER_MINUTE;
-  }
-
-  // Add 12 hours if it is PM
-  if (isPM && hoursMatchValue < 12) {
-    millis += 12 * MILLIS_PER_HOUR;
-  }
-  return millis;
-};
-
 export function millisToDelayString(millis: MaybeNumber, format: 'compact' | 'expanded' = 'compact'): string {
  if (millis == null || millis === 0) {
    return '';
@@ -3,4 +3,6 @@ export function isMacOS() {
  return userAgent.includes('macintosh') || userAgent.includes('mac os');
 }

-export const deviceAlt = isMacOS() ? '⌥' : 'Alt';
+export const deviceAlt = isMacOS() ? 'Option' : 'Alt';
+
+export const deviceMod = isMacOS() ? 'Cmd' : 'Ctrl';
@@ -9,4 +9,5 @@ export const startsWithHttp = /^http:\/\//;
 export const startsWithSlash = /^\//;
 export const isAlphanumeric = /^[a-z0-9]+$/i;
 export const isASCII = /^[ -~]+$/; //https://catonmat.net/my-favorite-regex
+export const isASCIIorEmpty = /^$|^[ -~]+$/; //https://catonmat.net/my-favorite-regex
 export const isNotEmpty = /\S/;
@@ -7,5 +7,5 @@
  gap: 0.25rem;

  overflow: hidden;
-  background-color: black;
+  background-color: $ui-black;
 }
@@ -93,10 +93,10 @@ export default function UrlPresetsForm() {
        <Panel.SubHeader>
          URL presets
          <div className={style.actionButtons}>
-            <Button variant='ontime-ghosted' size='md' onClick={onReset} isDisabled={!canSubmit}>
+            <Button variant='ontime-ghosted' size='sm' onClick={onReset} isDisabled={!canSubmit}>
              Revert to saved
            </Button>
-            <Button variant='ontime-filled' size='md' type='submit' isDisabled={!canSubmit} isLoading={isSubmitting}>
+            <Button variant='ontime-filled' size='sm' type='submit' isDisabled={!canSubmit} isLoading={isSubmitting}>
              Save
            </Button>
          </div>
@@ -126,7 +126,7 @@ export default function ViewSettingsForm() {
            <Panel.ListItem>
              <Panel.Field
                title='Freeze timer on end'
-                description='Timer in views will stop from going negative after reaching'
+                description='Timer in views will stop from going negative and instead stop at 00:00:00'
              />
              <Controller
                control={control}
@@ -8,7 +8,7 @@ import { generateId } from 'ontime-utils';
 import { maybeAxiosError } from '../../../../common/api/utils';
 import useOscSettings, { useOscSettingsMutation } from '../../../../common/hooks-query/useOscSettings';
 import { isKeyEscape } from '../../../../common/utils/keyEvent';
-import { isASCII, isIPAddress, isOnlyNumbers, startsWithSlash } from '../../../../common/utils/regex';
+import { isASCII, isASCIIorEmpty, isIPAddress, isOnlyNumbers, startsWithSlash } from '../../../../common/utils/regex';
 import * as Panel from '../PanelUtils';

 import { cycles } from './integrationUtils';
@@ -221,7 +221,7 @@ export default function OscIntegrations() {
                <th>Enabled</th>
                <th>Cycle</th>
                <th className={style.halfWidth}>Address</th>
-                <th className={style.halfWidth}>Payload</th>
+                <th className={style.halfWidth}>Arguments</th>
                <th />
              </tr>
            </thead>
@@ -277,7 +277,7 @@ export default function OscIntegrations() {
                        {...register(`subscriptions.${index}.payload`, {
                          validate: {
                            oscStringIsAscii: (value) =>
-                              isASCII.test(value) || 'OSC payloads only allow ASCII characters',
+                              isASCIIorEmpty.test(value) || 'OSC arguments only allow ASCII characters',
                          },
                        })}
                      />
@@ -1,17 +1,23 @@
-import { Switch } from '@chakra-ui/react';
+import { Select, Switch } from '@chakra-ui/react';
+import { EndAction, TimerType } from 'ontime-types';
+import { parseUserTime } from 'ontime-utils';

 import TimeInput from '../../../../common/components/input/time-input/TimeInput';
-import { useEditorSettings } from '../../../../common/stores/editorSettings';
-import { forgivingStringToMillis } from '../../../../common/utils/dateConfig';
+import { editorSettingsDefaults, useEditorSettings } from '../../../../common/stores/editorSettings';
 import * as Panel from '../PanelUtils';

 export default function EditorSettingsForm() {
-  const eventSettings = useEditorSettings((state) => state.eventSettings);
-  const setLinkPrevious = useEditorSettings((state) => state.setLinkPrevious);
-  const setDefaultPublic = useEditorSettings((state) => state.setDefaultPublic);
-  const setDefaultDuration = useEditorSettings((state) => state.setDefaultDuration);
+  const eventSettings = useEditorSettings((state) => state);

-  const durationInMs = forgivingStringToMillis(eventSettings.defaultDuration);
+  const setDefaultDuration = eventSettings.setDefaultDuration;
+  const setLinkPrevious = eventSettings.setLinkPrevious;
+  const setWarnTime = eventSettings.setWarnTime;
+  const setDangerTime = eventSettings.setDangerTime;
+  const setDefaultPublic = eventSettings.setDefaultPublic;
+
+  const durationInMs = parseUserTime(eventSettings.defaultDuration);
+  const warnTimeInMs = parseUserTime(eventSettings.defaultWarnTime);
+  const dangerTimeInMs = parseUserTime(eventSettings.defaultDangerTime);

  return (
    <Panel.Section>
@@ -19,24 +25,21 @@ export default function EditorSettingsForm() {
        <Panel.SubHeader>Editor settings</Panel.SubHeader>
        <Panel.Divider />
        <Panel.Section>
-          <Panel.Title>Rundown options</Panel.Title>
+          <Panel.Title>Rundown defaults for new events</Panel.Title>
          <Panel.ListGroup>
            <Panel.ListItem>
-              <Panel.Field
-                title='Default duration'
-                description='When creating a new event, what is the default duration'
-              />
+              <Panel.Field title='Default duration' description='Default duration for new events' />
              <TimeInput<'defaultDuration'>
                name='defaultDuration'
                submitHandler={(_field, value) => setDefaultDuration(value)}
                time={durationInMs}
-                placeholder='00:10:00'
+                placeholder={editorSettingsDefaults.duration}
              />
            </Panel.ListItem>
            <Panel.ListItem>
              <Panel.Field
                title='Link previous'
-                description='New events start time will be linked to the previous event'
+                description='Whether the start time of new events should be linked to the previous event end time'
              />
              <Switch
                variant='ontime'
@@ -45,6 +48,46 @@ export default function EditorSettingsForm() {
                onChange={(event) => setLinkPrevious(event.target.checked)}
              />
            </Panel.ListItem>
+            <Panel.ListItem>
+              <Panel.Field title='Timer type' description='Default type of timer for new events' />
+              <Select variant='ontime' size='sm' width='auto' isDisabled>
+                <option value={TimerType.CountDown}>Count down</option>
+                <option value={TimerType.CountUp}>Count up</option>
+                <option value={TimerType.TimeToEnd}>Time to end</option>
+                <option value={TimerType.Clock}>Clock</option>
+              </Select>
+            </Panel.ListItem>
+            <Panel.ListItem>
+              <Panel.Field title='End Action' description='Default end action for new events' />
+              <Select variant='ontime' size='sm' width='auto' isDisabled>
+                <option value={EndAction.None}>None</option>
+                <option value={EndAction.Stop}>Stop</option>
+                <option value={EndAction.LoadNext}>Load next</option>
+                <option value={EndAction.PlayNext}>Play next</option>
+              </Select>
+            </Panel.ListItem>
+          </Panel.ListGroup>
+          <Panel.ListGroup>
+            <Panel.ListItem>
+              <Panel.Field title='Warning time' description='Default threshold for warning time in an event' />
+              <TimeInput<'warnTime'>
+                name='warnTime'
+                submitHandler={(_field, value) => setWarnTime(value)}
+                time={warnTimeInMs}
+                placeholder={editorSettingsDefaults.warnTime}
+              />
+            </Panel.ListItem>
+            <Panel.ListItem>
+              <Panel.Field title='Danger time' description='Default threshold for danger time in an event' />
+              <TimeInput<'dangerTime'>
+                name='dangerTime'
+                submitHandler={(_field, value) => setDangerTime(value)}
+                time={dangerTimeInMs}
+                placeholder={editorSettingsDefaults.dangerTime}
+              />
+            </Panel.ListItem>
+          </Panel.ListGroup>
+          <Panel.ListGroup>
            <Panel.ListItem>
              <Panel.Field title='Default public' description='New events will be public' />
              <Switch
@@ -169,7 +169,7 @@ function ActionMenu({
        <MenuItem onClick={handleRename}>Rename</MenuItem>
        <MenuItem onClick={handleDuplicate}>Duplicate</MenuItem>
        <MenuItem onClick={handleDownload}>Download</MenuItem>
-        {current && <MenuItem onClick={handleExportCSV}>Export CSV Rundown</MenuItem>}
+        <MenuItem onClick={handleExportCSV}>Export CSV Rundown</MenuItem>
        <MenuItem isDisabled={current} onClick={handleDelete}>
          Delete
        </MenuItem>
@@ -1,13 +1,26 @@
-import { Button } from '@chakra-ui/react';
+import { useRef } from 'react';
+import {
+  AlertDialog,
+  AlertDialogBody,
+  AlertDialogContent,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogOverlay,
+  Button,
+  useDisclosure,
+} from '@chakra-ui/react';

 import useElectronEvent from '../../../../common/hooks/useElectronEvent';
 import * as Panel from '../PanelUtils';

 export default function ShutdownPanel() {
  const { isElectron, sendToElectron } = useElectronEvent();
+  const { isOpen, onOpen, onClose } = useDisclosure();
+  const cancelRef = useRef<HTMLButtonElement | null>(null);

  const sendShutdown = () => {
    sendToElectron('shutdown', 'now');
+    onClose();
  };

  return (
@@ -18,9 +31,29 @@ export default function ShutdownPanel() {
          This will shutdown the Ontime server. <br />
          The runtime state will be lost, but your project is kept for next time.
        </Panel.Paragraph>
-        <Button colorScheme='red' onClick={sendShutdown} isDisabled={!isElectron}>
+        <Button colorScheme='red' onClick={onOpen} maxWidth='350px' isDisabled={!isElectron}>
          Shutdown ontime
        </Button>
+        <AlertDialog variant='ontime' isOpen={isOpen} leastDestructiveRef={cancelRef} onClose={onClose}>
+          <AlertDialogOverlay>
+            <AlertDialogContent>
+              <AlertDialogHeader fontSize='lg' fontWeight='bold'>
+                Ontime Shutdown
+              </AlertDialogHeader>
+              <AlertDialogBody>
+                This will shutdown the Ontime server. <br /> Are you sure?
+              </AlertDialogBody>
+              <AlertDialogFooter>
+                <Button ref={cancelRef} onClick={onClose} variant='ontime-ghosted-white'>
+                  Cancel
+                </Button>
+                <Button colorScheme='red' onClick={sendShutdown} ml={4}>
+                  Shutdown
+                </Button>
+              </AlertDialogFooter>
+            </AlertDialogContent>
+          </AlertDialogOverlay>
+        </AlertDialog>
      </Panel.Section>
    </>
  );
@@ -33,6 +33,7 @@ export default function GSheetSetup(props: GSheetSetupProps) {
  const patchStepData = useSheetStore((state) => state.patchStepData);
  const authenticationStatus = useSheetStore((state) => state.authenticationStatus);
  const setAuthenticationStatus = useSheetStore((state) => state.setAuthenticationStatus);
+  const authenticationError = useSheetStore((state) => state.stepData.authenticate.error);

  /** Check if we are authenticated */
  const getAuthStatus = async () => {
@@ -44,6 +45,7 @@ export default function GSheetSetup(props: GSheetSetupProps) {

  /** check if the current session has been authenticated */
  useEffect(() => {
+    patchStepData({ authenticate: { available: false, error: '' } });
    untilAuthenticated();
  }, []);

@@ -150,7 +152,7 @@ export default function GSheetSetup(props: GSheetSetupProps) {
      </Panel.Title>
      <Panel.ListGroup>
        <Panel.Description>Upload Client Secret provided by Google</Panel.Description>
-        <Panel.Error>{undefined}</Panel.Error>
+        <Panel.Error>{authenticationError}</Panel.Error>
        <Input
          type='file'
          onChange={handleClientSecret}
@@ -1,12 +1,13 @@
 import { ImportCustom } from 'ontime-utils';

-import { convertToImportMap } from '../importMapUtils';
+import { convertToImportMap, NamedImportMap } from '../importMapUtils';

 describe('convertToImportMap', () => {
  it('converts a namedImportMap to a importMap', () => {
    const defaultNamedImporMap = {
      Worksheet: 'event schedule',
      Start: 'time start',
+      'Link start': 'link start',
      End: 'time end',
      Duration: 'duration',
      Cue: 'cue',
@@ -26,7 +27,7 @@ describe('convertToImportMap', () => {
        { ontimeName: 'EmptyImportName', importName: '' },
        { ontimeName: '', importName: 'EmptyOntimeName' },
      ] as ImportCustom[],
-    };
+    } as NamedImportMap;

    const importMap = convertToImportMap(defaultNamedImporMap);
    expect(importMap.custom).toStrictEqual({
@@ -6,6 +6,7 @@ export type NamedImportMap = typeof namedImportMap;
 export const namedImportMap = {
  Worksheet: 'event schedule',
  Start: 'time start',
+  'Link start': 'link start',
  End: 'time end',
  Duration: 'duration',
  Cue: 'cue',
@@ -21,6 +22,15 @@ export const namedImportMap = {
  custom: [] as ImportCustom[],
 };

+function isNamedImportMap(obj: unknown): obj is NamedImportMap {
+  if (typeof obj !== 'object' || obj === null) {
+    return false;
+  }
+
+  const keys = Object.keys(namedImportMap);
+  return keys.every((key) => Object.hasOwn(obj, key));
+}
+
 export function convertToImportMap(namedImportMap: NamedImportMap): ImportMap {
  const custom = namedImportMap.custom.reduce((accumulator, { ontimeName, importName }) => {
    if (ontimeName && importName) {
@@ -32,6 +42,7 @@ export function convertToImportMap(namedImportMap: NamedImportMap): ImportMap {
  return {
    worksheet: namedImportMap.Worksheet,
    timeStart: namedImportMap.Start,
+    linkStart: namedImportMap['Link start'],
    timeEnd: namedImportMap.End,
    duration: namedImportMap.Duration,
    cue: namedImportMap.Cue,
@@ -52,10 +63,22 @@ export function persistImportMap(options: NamedImportMap) {
  localStorage.setItem('ontime-import-options', JSON.stringify(options));
 }

-export function getPersistedOptions(): NamedImportMap {
+function getPersistImportMap(): unknown {
  const options = localStorage.getItem('ontime-import-options');
  if (!options) {
-    return namedImportMap;
+    throw new Error('no import options found');
  }
  return JSON.parse(options);
 }
+
+export function getPersistedOptions(): NamedImportMap {
+  try {
+    const options = getPersistImportMap();
+    if (!isNamedImportMap(options)) {
+      return namedImportMap;
+    }
+    return options;
+  } catch {
+    return namedImportMap;
+  }
+}
@@ -1,12 +1,27 @@
-  .center {
-    text-align: center;
-  }
+.center {
+  text-align: center;
+}

-  .nowrap {
-    white-space: nowrap;
-  }
+.nowrap {
+  white-space: nowrap;
+}

-  tr .secondaryRow {
-    background-color: $white-7;
-    padding-left: 2em;
-  }
+tr .secondaryRow {
+  background-color: $white-7;
+  padding-left: 2em;
+}
+
+.linkStartActive {
+  color: $active-indicator;
+  transform: rotate(-45deg);
+}
+
+.flex {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.subdued {
+  opacity: $opacity-disabled;
+}
@@ -1,4 +1,5 @@
 import { Fragment } from 'react';
+import { IoLink } from '@react-icons/all-files/io5/IoLink';
 import { CustomFields, isOntimeBlock, isOntimeEvent, OntimeRundown } from 'ontime-types';
 import { millisToString } from 'ontime-utils';

@@ -83,7 +84,10 @@ export default function PreviewRundown(props: PreviewRundownProps) {
                </td>
                <td className={style.nowrap}>{event.cue}</td>
                <td>{event.title}</td>
-                <td>{millisToString(event.timeStart)}</td>
+                <td className={style.flex}>
+                  <span className={event.linkStart ? style.subdued : undefined}>{millisToString(event.timeStart)}</span>
+                  {event.linkStart && <IoLink className={style.linkStartActive} />}
+                </td>
                <td>{millisToString(event.timeEnd)}</td>
                <td>{millisToString(event.duration)}</td>
                <td>{millisToString(event.timeWarning)}</td>
@@ -101,7 +105,7 @@ export default function PreviewRundown(props: PreviewRundownProps) {
                  fieldHeaders.map((field) => {
                    let value = '';
                    if (field in event.custom) {
-                      value = event.custom[field].value;
+                      value = event.custom[field];
                    }
                    return <td key={field}>{value}</td>;
                  })}
@@ -25,9 +25,9 @@ export default function useGoogleSheet() {
  /** whether the current session has been authenticated */
  const verifyAuth = async (): Promise<{ authenticated: AuthenticationStatus; sheetId: string } | void> => {
    try {
-      return verifyAuthenticationStatus();
-    } catch (_error) {
-      /** we do not handle errors here */
+      return await verifyAuthenticationStatus();
+    } catch (error) {
+      patchStepData({ authenticate: { available: false, error: maybeAxiosError(error) } });
    }
  };

@@ -37,18 +37,18 @@ export default function useGoogleSheet() {
    sheetId: string,
  ): Promise<{ verification_url: string; user_code: string } | void> => {
    try {
-      return requestConnection(file, sheetId);
-    } catch (_error) {
-      /** we do not handle errors here */
+      return await requestConnection(file, sheetId);
+    } catch (error) {
+      patchStepData({ authenticate: { available: false, error: maybeAxiosError(error) } });
    }
  };

  /** requests the revoking of an existing authenticated session */
  const revoke = async (): Promise<{ authenticated: AuthenticationStatus } | void> => {
    try {
-      return revokeAuthentication();
-    } catch (_error) {
-      /** we do not handle errors here */
+      return await revokeAuthentication();
+    } catch (error) {
+      patchStepData({ authenticate: { available: false, error: maybeAxiosError(error) } });
    }
  };

@@ -1,3 +1,5 @@
+@import "./MessageControl.module.scss";
+
 .inputItems {
  display: grid;
  grid-template-columns: 1fr auto;
@@ -6,10 +8,5 @@
 }

 .label {
-  font-size: $inner-section-text-size;
-  color: $label-gray;
-
-  &.active {
-    color: $action-text-color;
-  }
+  @extend .label;
 }
@@ -10,3 +10,19 @@
  gap: $element-spacing;
  margin-top: -0.5rem;
 }
+
+.singleAction {
+  display: flex;
+  flex-direction: column;
+  gap: $element-spacing;
+  margin-top: $element-inner-spacing;
+}
+
+.label {
+  font-size: $inner-section-text-size;
+  color: $label-gray;
+
+  &.active {
+    color: $action-text-color;
+  }
+}
@@ -17,29 +17,14 @@ export default function MessageControl() {
  const message = useMessageControl();
  const blink = message.timer.blink;
  const blackout = message.timer.blackout;
+
  return (
    <div className={style.messageContainer}>
-      <InputRow
-        label='Public / Backstage screen message'
-        placeholder='Shown in public and backstage screens'
-        text={message.public.text || ''}
-        visible={message.public.visible || false}
-        changeHandler={(newValue) => setMessage.publicText(newValue)}
-        actionHandler={() => setMessage.publicVisible(!message.public.visible)}
-      />
-      <InputRow
-        label='Lower third message'
-        placeholder='Shown in lower third'
-        text={message.lower.text || ''}
-        visible={message.lower.visible || false}
-        changeHandler={(newValue) => setMessage.lowerText(newValue)}
-        actionHandler={() => setMessage.lowerVisible(!message.lower.visible)}
-      />
      <InputRow
        label='Timer'
        placeholder='Message shown in stage timer'
-        text={message.timer.text || ''}
-        visible={message.timer.visible || false}
+        text={message.timer.text}
+        visible={message.timer.visible}
        changeHandler={(newValue) => setMessage.timerText(newValue)}
        actionHandler={() => setMessage.timerVisible(!message.timer.visible)}
      />
@@ -69,8 +54,8 @@ export default function MessageControl() {
        label='External Message (read only)'
        placeholder={enDash}
        readonly
-        text={message.external.text || ''}
-        visible={message.external.visible || false}
+        text={message.external.text}
+        visible={message.external.visible}
        changeHandler={noop}
        actionHandler={noop}
      />
@@ -2,7 +2,8 @@ import { Playback } from 'ontime-types';

 import { usePlaybackControl } from '../../../common/hooks/useSocket';

-import { ExtraTimer } from './extra-timer/ExtraTimer';
+import AddTime from './add-time/AddTime';
+import { AuxTimer } from './aux-timer/AuxTimer';
 import PlaybackButtons from './playback-buttons/PlaybackButtons';
 import PlaybackTimer from './playback-timer/PlaybackTimer';

@@ -13,13 +14,15 @@ export default function PlaybackControl() {

  return (
    <div className={style.mainContainer}>
-      <PlaybackTimer playback={data.playback as Playback} />
+      <PlaybackTimer playback={data.playback as Playback}>
+        <AddTime playback={data.playback} />
+      </PlaybackTimer>
      <PlaybackButtons
        playback={data.playback}
        numEvents={data.numEvents}
        selectedEventIndex={data.selectedEventIndex}
      />
-      <ExtraTimer />
+      <AuxTimer />
    </div>
  );
 }
@@ -0,0 +1,16 @@
+.addTime {
+  grid-area: addtime;
+  display: flex;
+  flex-direction: column;
+  gap: $element-inner-spacing;
+}
+
+.addButtons {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: $element-inner-spacing;
+}
+
+.tallButtons {
+  height: 28px;
+}
@@ -0,0 +1,58 @@
+import { Tooltip } from '@chakra-ui/react';
+import { useLocalStorage } from '@mantine/hooks';
+import { IoAdd } from '@react-icons/all-files/io5/IoAdd';
+import { IoRemove } from '@react-icons/all-files/io5/IoRemove';
+import { Playback } from 'ontime-types';
+import { MILLIS_PER_HOUR, MILLIS_PER_SECOND, parseUserTime } from 'ontime-utils';
+
+import TimeInput from '../../../../common/components/input/time-input/TimeInput';
+import { setPlayback } from '../../../../common/hooks/useSocket';
+import { tooltipDelayMid } from '../../../../ontimeConfig';
+import TapButton from '../tap-button/TapButton';
+
+import style from './AddTime.module.scss';
+
+interface AddTimeProps {
+  playback: Playback;
+}
+
+export default function AddTime(props: AddTimeProps) {
+  const { playback } = props;
+  const [time, setTime] = useLocalStorage({ key: 'add-time', defaultValue: 300_000 }); // 5 minutes
+
+  const handleTimeChange = (_field: string, value: string) => {
+    const newTime = parseUserTime(value);
+    // cap add time to 1 hour
+    setTime(Math.min(newTime, MILLIS_PER_HOUR));
+  };
+
+  const handleAddTime = (direction: 'add' | 'remove') => {
+    // API expects input in seconds
+    if (direction === 'add') {
+      setPlayback.addTime(time / MILLIS_PER_SECOND);
+    } else {
+      setPlayback.addTime((-1 * time) / MILLIS_PER_SECOND);
+    }
+  };
+
+  const canAddTime = playback === Playback.Play || playback === Playback.Pause;
+  const doDisableButtons = !canAddTime || time === 0;
+
+  return (
+    <div className={style.addTime}>
+      <TimeInput name='addtime' submitHandler={handleTimeChange} time={time} placeholder='Add time' />
+      <div className={style.addButtons}>
+        <Tooltip label='Remove time' openDelay={tooltipDelayMid} shouldWrapChildren>
+          <TapButton onClick={() => handleAddTime('remove')} disabled={doDisableButtons} className={style.tallButtons}>
+            <IoRemove />
+          </TapButton>
+        </Tooltip>
+        <Tooltip label='Add time' openDelay={tooltipDelayMid} shouldWrapChildren>
+          <TapButton onClick={() => handleAddTime('add')} disabled={doDisableButtons} className={style.tallButtons}>
+            <IoAdd />
+          </TapButton>
+        </Tooltip>
+      </div>
+    </div>
+  );
+}
@@ -4,18 +4,18 @@ import { IoPause } from '@react-icons/all-files/io5/IoPause';
 import { IoPlay } from '@react-icons/all-files/io5/IoPlay';
 import { IoStop } from '@react-icons/all-files/io5/IoStop';
 import { Playback, SimpleDirection, SimplePlayback } from 'ontime-types';
+import { parseUserTime } from 'ontime-utils';

 import TimeInput from '../../../../common/components/input/time-input/TimeInput';
-import { setExtraTimer, useExtraTimerControl, useExtraTimerTime } from '../../../../common/hooks/useSocket';
-import { forgivingStringToMillis } from '../../../../common/utils/dateConfig';
+import { setAuxTimer, useAuxTimerControl, useAuxTimerTime } from '../../../../common/hooks/useSocket';
 import TapButton from '../tap-button/TapButton';

-import style from './ExtraTimer.module.scss';
+import style from './AuxTimer.module.scss';

-export function ExtraTimer() {
-  const { playback, direction } = useExtraTimerControl();
+export function AuxTimer() {
+  const { playback, direction } = useAuxTimerControl();

-  const { start, pause, stop, setDirection } = setExtraTimer;
+  const { start, pause, stop, setDirection } = setAuxTimer;

  const toggleDirection = () => {
    const newDirection = direction === SimpleDirection.CountDown ? SimpleDirection.CountUp : SimpleDirection.CountDown;
@@ -30,7 +30,7 @@ export function ExtraTimer() {

  return (
    <div className={style.extraRow}>
-      <ExtraTimeInput />
+      <AuxTimerInput />
      <TapButton onClick={toggleDirection} aspect='tight'>
        {direction === SimpleDirection.CountDown && <IoArrowDown data-testid='aux-timer-direction' />}
        {direction === SimpleDirection.CountUp && <IoArrowUp data-testid='aux-timer-direction' />}
@@ -59,12 +59,12 @@ export function ExtraTimer() {
  );
 }

-function ExtraTimeInput() {
-  const time = useExtraTimerTime();
-  const { setDuration } = setExtraTimer;
+function AuxTimerInput() {
+  const time = useAuxTimerTime();
+  const { setDuration } = setAuxTimer;

  const handleTimeUpdate = (_field: string, value: string) => {
-    const newTime = forgivingStringToMillis(value);
+    const newTime = parseUserTime(value);
    setDuration(newTime / 1000); //frontend api is seconds based;
  };

@@ -1,16 +1,17 @@
 .timeContainer {
  display: grid;
  grid-template-areas:
-    'ind clk clk btn'
-    '... sta fin btn';
+    'indicators timer  addtime'
+    'status     status addtime';
  grid-template-rows: 1fr auto;
-  grid-template-columns: 1.25rem 1fr 1fr 5rem;
+  grid-template-columns: 1.25rem 1fr 6.5rem;
  gap: $element-inner-spacing;
-  justify-items: start;
 }

+// ---------> INDICATORS
+
 .indicators {
-  grid-area: ind;
+  grid-area: indicators;
  width: 100%;
  height: 100%;
  display: flex;
@@ -18,72 +19,46 @@
  justify-content: space-evenly;
 }

-.indRoll,
-.indDelay,
-.indNegative {
+.indicatorRoll,
+.indicatorDelay,
+.indicatorNegative {
  background-color: $black-10;
 }

-.indRoll,
-.indRollActive,
-.indDelay,
-.indDelayActive {
+.indicatorRoll,
+.indicatorDelay {
  margin: 0 auto;
-  border-radius: 6px;
-  width: 12px;
-  height: 12px;
+  border-radius: 5px;
+  width: 10px;
+  height: 10px;
 }

-.indRollActive {
+.indicatorRoll[data-active='true'] {
  background-color: $ontime-roll;
 }

-.indNegative,
-.indNegativeActive {
-  margin: 0 auto;
-  width: 90%;
-  height: 0.25rem;
-}
-
-.indNegativeActive {
-  background-color: $playback-negative;
-}
-
-.indDelayActive {
+.indicatorDelay[data-active='true'] {
  background-color: $ontime-delay;
 }

-.btn {
-  grid-area: btn;
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-template-rows: 1fr 1fr;
-  width: 100%;
-  gap: $element-inner-spacing;
+.indicatorNegative {
+  margin: 0 auto;
+  width: 90%;
+  height: 0.25rem;
+
+  &[data-active='true'] {
+    background-color: $playback-negative;
+  }
 }

-.minus {
-  grid-area: min;
-  display: flex;
-  flex-direction: column;
-}
+// ---------> LABELS

-.start,
-.finish,
-.roll {
+.status {
+  grid-area: status;
  height: 1.5rem;
-}
-
-.start {
-  grid-area: sta;
-}
-
-.finish {
-  grid-area: fin;
-}
-
-.roll {
-  grid-area: 2 / 2 / 2 / 4 ;
+  display: flex;
+  gap: $section-spacing;
+  margin-left: 1.5rem;
 }

 .tag {
@@ -1,10 +1,9 @@
+import { PropsWithChildren } from 'react';
 import { Tooltip } from '@chakra-ui/react';
 import { Playback } from 'ontime-types';
 import { dayInMs, millisToMinutes, millisToSeconds, millisToString } from 'ontime-utils';

-import { setPlayback, useTimer } from '../../../../common/hooks/useSocket';
-import { tooltipDelayMid } from '../../../../ontimeConfig';
-import TapButton from '../tap-button/TapButton';
+import { useTimer } from '../../../../common/hooks/useSocket';
 import TimerDisplay from '../timer-display/TimerDisplay';

 import style from './PlaybackTimer.module.scss';
@@ -13,8 +12,30 @@ interface PlaybackTimerProps {
  playback: Playback;
 }

-export default function PlaybackTimer(props: PlaybackTimerProps) {
-  const { playback } = props;
+function resolveAddedTimeLabel(addedTime: number) {
+  function resolveClosestUnit(ms: number) {
+    if (ms < 6000) {
+      return `${millisToSeconds(ms)} seconds`;
+    } else if (ms < 12000) {
+      return '1 minute';
+    } else {
+      return `${millisToMinutes(ms)} minutes`;
+    }
+  }
+
+  if (addedTime > 0) {
+    return `Added ${resolveClosestUnit(addedTime)}`;
+  }
+
+  if (addedTime < 0) {
+    return `Removed ${resolveClosestUnit(addedTime)}`;
+  }
+
+  return '';
+}
+
+export default function PlaybackTimer(props: PropsWithChildren<PlaybackTimerProps>) {
+  const { playback, children } = props;
  const timer = useTimer();

  const started = millisToString(timer.startedAt);
@@ -22,88 +43,43 @@ export default function PlaybackTimer(props: PlaybackTimerProps) {
  const finish = millisToString(expectedFinish);

  const isRolling = playback === Playback.Roll;
-  const isStopped = playback === Playback.Stop;
  const isWaiting = timer.secondaryTimer !== null && timer.secondaryTimer > 0 && timer.current === null;
-  const disableButtons = isStopped || isRolling;
  const isOvertime = timer.current !== null && timer.current < 0;
  const hasAddedTime = Boolean(timer.addedTime);

  const rollLabel = isRolling ? 'Roll mode active' : '';

-  const resolveAddedTimeLabel = () => {
-    function resolveClosestUnit(ms: number) {
-      if (ms < 6000) {
-        return `${millisToSeconds(ms)} seconds`;
-      } else if (ms < 12000) {
-        return '1 minute';
-      } else {
-        return `${millisToMinutes(ms)} minutes`;
-      }
-    }
-
-    if (timer.addedTime > 0) {
-      return `Added ${resolveClosestUnit(timer.addedTime)}`;
-    }
-
-    if (timer.addedTime < 0) {
-      return `Removed ${resolveClosestUnit(timer.addedTime)}`;
-    }
-
-    return '';
-  };
-
-  const addedTimeLabel = resolveAddedTimeLabel();
+  const addedTimeLabel = resolveAddedTimeLabel(timer.addedTime);

  return (
    <div className={style.timeContainer}>
      <div className={style.indicators}>
        <Tooltip label={rollLabel}>
-          <div className={isRolling ? style.indRollActive : style.indRoll} />
+          <div className={style.indicatorRoll} data-active={isRolling} />
        </Tooltip>
-        <div className={isOvertime ? style.indNegativeActive : style.indNegative} />
+        <div className={style.indicatorNegative} data-active={isOvertime} />
        <Tooltip label={addedTimeLabel}>
-          <div className={hasAddedTime ? style.indDelayActive : style.indDelay} />
+          <div className={style.indicatorDelay} data-active={hasAddedTime} />
        </Tooltip>
      </div>
      <TimerDisplay time={isWaiting ? timer.secondaryTimer : timer.current} />
-      {isWaiting ? (
-        <div className={style.roll}>
+      <div className={style.status}>
+        {isWaiting ? (
          <span className={style.rolltag}>Roll: Countdown to start</span>
-        </div>
-      ) : (
-        <>
-          <div className={style.start}>
-            <span className={style.tag}>Started at</span>
-            <span className={style.time}>{started}</span>
-          </div>
-          <div className={style.finish}>
-            <span className={style.tag}>Expect end</span>
-            <span className={style.time}>{finish}</span>
-          </div>
-        </>
-      )}
-      <div className={style.btn}>
-        <Tooltip label='Remove 1 minute' openDelay={tooltipDelayMid} shouldWrapChildren={disableButtons}>
-          <TapButton onClick={() => setPlayback.addTime(-60)} disabled={disableButtons} aspect='square'>
-            -1
-          </TapButton>
-        </Tooltip>
-        <Tooltip label='Add 1 minute' openDelay={tooltipDelayMid} shouldWrapChildren={disableButtons}>
-          <TapButton onClick={() => setPlayback.addTime(60)} disabled={disableButtons} aspect='square'>
-            +1
-          </TapButton>
-        </Tooltip>
-        <Tooltip label='Remove 5 minutes' openDelay={tooltipDelayMid} shouldWrapChildren={disableButtons}>
-          <TapButton onClick={() => setPlayback.addTime(-5 * 60)} disabled={disableButtons} aspect='square'>
-            -5
-          </TapButton>
-        </Tooltip>
-        <Tooltip label='Add 5 minutes' openDelay={tooltipDelayMid} shouldWrapChildren={disableButtons}>
-          <TapButton onClick={() => setPlayback.addTime(+5 * 60)} disabled={disableButtons} aspect='square'>
-            +5
-          </TapButton>
-        </Tooltip>
+        ) : (
+          <>
+            <span className={style.start}>
+              <span className={style.tag}>Started at</span>
+              <span className={style.time}>{started}</span>
+            </span>
+            <span className={style.finish}>
+              <span className={style.tag}>Expect end</span>
+              <span className={style.time}>{finish}</span>
+            </span>
+          </>
+        )}
      </div>
+      {children}
    </div>
  );
 }
@@ -1,7 +1,7 @@
@use '../../../../theme/viewerDefs' as *;

 .timer {
-  grid-area: clk;
+  grid-area: timer;
  white-space: nowrap;
  max-width: 18.75rem;
  min-width: 5em;
@@ -1,10 +1,10 @@
-import { useRef } from 'react';
+import { useCallback, useEffect, useRef } from 'react';
+import { useLocalStorage } from '@mantine/hooks';
 import { ColumnDef, flexRender, getCoreRowModel, useReactTable } from '@tanstack/react-table';
 import Color from 'color';
 import { isOntimeBlock, isOntimeDelay, isOntimeEvent, OntimeRundown, OntimeRundownEntry } from 'ontime-types';

 import useFollowComponent from '../../common/hooks/useFollowComponent';
-import { useLocalStorage } from '../../common/hooks/useLocalStorage';
 import { getAccessibleColour } from '../../common/utils/styleUtils';

 import BlockRow from './cuesheet-table-elements/BlockRow';
@@ -27,14 +27,23 @@ interface CuesheetProps {
 export default function Cuesheet({ data, columns, handleUpdate, selectedId }: CuesheetProps) {
  const { followSelected, showSettings, showDelayBlock, showPrevious } = useCuesheetSettings();

-  const [columnVisibility, setColumnVisibility] = useLocalStorage('table-hidden', {});
-  const [columnOrder, saveColumnOrder] = useLocalStorage<string[]>('table-order', initialColumnOrder);
-  const [columnSizing, setColumnSizing] = useLocalStorage('table-sizes', {});
+  const [columnVisibility, setColumnVisibility] = useLocalStorage({ key: 'table-hidden', defaultValue: {} });
+  const [columnOrder, saveColumnOrder] = useLocalStorage<string[]>({
+    key: 'table-order',
+    defaultValue: initialColumnOrder,
+  });
+  const [columnSizing, setColumnSizing] = useLocalStorage({ key: 'table-sizes', defaultValue: {} });

  const selectedRef = useRef<HTMLTableRowElement | null>(null);
  const tableContainerRef = useRef<HTMLDivElement | null>(null);
  useFollowComponent({ followRef: selectedRef, scrollRef: tableContainerRef, doFollow: followSelected });

+  // keep column order in sync with columns
+  useEffect(() => {
+    const order = columns.map((col) => col.id as string);
+    saveColumnOrder(order);
+  }, [columns, saveColumnOrder]);
+
  const table = useReactTable({
    data,
    columns,
@@ -64,6 +73,26 @@ export default function Cuesheet({ data, columns, handleUpdate, selectedId }: Cu
    setColumnSizing({});
  };

+  const reorder = useCallback(
+    (fromId: string, toId: string) => {
+      // get index of from
+      const fromIndex = columnOrder.indexOf(fromId);
+
+      // get index of to
+      const toIndex = columnOrder.indexOf(toId);
+
+      if (toIndex === -1) {
+        return;
+      }
+
+      const reorderedCols = [...columnOrder];
+      const reorderedItem = reorderedCols.splice(fromIndex, 1);
+      reorderedCols.splice(toIndex, 0, reorderedItem[0]);
+      saveColumnOrder(reorderedCols);
+    },
+    [columnOrder, saveColumnOrder],
+  );
+
  const headerGroups = table.getHeaderGroups();
  const rowModel = table.getRowModel();
  const allLeafColumns = table.getAllLeafColumns();
@@ -83,7 +112,7 @@ export default function Cuesheet({ data, columns, handleUpdate, selectedId }: Cu
      )}
      <div ref={tableContainerRef} className={style.cuesheetContainer}>
        <table className={style.cuesheet}>
-          <CuesheetHeader headerGroups={headerGroups} />
+          <CuesheetHeader headerGroups={headerGroups} saveColumnOrder={reorder} />
          <tbody>
            {rowModel.rows.map((row) => {
              const key = row.original.id;
@@ -1,4 +1,5 @@
 .tableWrapper {
+  background-color: $ui-black;
  width: 100%;
  height: 100vh;
  padding: 1rem 0.5rem;
@@ -53,7 +53,7 @@ export default function CuesheetWrapper() {
        return;
      }

-      const previousValue = event.custom[accessor]?.value;
+      const previousValue = event.custom[accessor];

      if (previousValue === payload) {
        return;
@@ -1,23 +1,19 @@
-import { memo, useEffect } from 'react';
 import { Tooltip } from '@chakra-ui/react';
 import {
-  closestCenter,
+  closestCorners,
  DndContext,
  DragEndEvent,
-  KeyboardSensor,
  PointerSensor,
  TouchSensor,
  useSensor,
  useSensors,
 } from '@dnd-kit/core';
-import { horizontalListSortingStrategy, SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable';
+import { horizontalListSortingStrategy, SortableContext } from '@dnd-kit/sortable';
 import { flexRender, HeaderGroup } from '@tanstack/react-table';
 import { OntimeRundownEntry } from 'ontime-types';

-import { useLocalStorage } from '../../../common/hooks/useLocalStorage';
 import { getAccessibleColour } from '../../../common/utils/styleUtils';
 import { tooltipDelayFast } from '../../../ontimeConfig';
-import { initialColumnOrder } from '../cuesheetCols';

 import { SortableCell } from './SortableCell';

@@ -25,17 +21,11 @@ import style from '../Cuesheet.module.scss';

 interface CuesheetHeaderProps {
  headerGroups: HeaderGroup<OntimeRundownEntry>[];
+  saveColumnOrder: (fromId: string, toId: string) => void;
 }

-function CuesheetHeader(props: CuesheetHeaderProps) {
-  const { headerGroups } = props;
-  const [columnOrder, saveColumnOrder] = useLocalStorage<string[]>('table-order', initialColumnOrder);
-
-  useEffect(() => {
-    if (!localStorage.getItem('table-order')) {
-      saveColumnOrder(initialColumnOrder);
-    }
-  }, [saveColumnOrder]);
+export default function CuesheetHeader(props: CuesheetHeaderProps) {
+  const { headerGroups, saveColumnOrder } = props;

  const handleOnDragEnd = (event: DragEndEvent) => {
    const { delta, active, over } = event;
@@ -45,21 +35,7 @@ function CuesheetHeader(props: CuesheetHeaderProps) {
    // cancel if we do not have an over id
    if (over?.id == null) return;

-    // get index of from
-    const fromIndex = columnOrder.indexOf(active.id as string);
-
-    // get index of to
-    const toIndex = columnOrder.indexOf(over.id as string);
-
-    if (toIndex === -1) {
-      return;
-    }
-
-    const reorderedCols = [...columnOrder];
-    const reorderedItem = reorderedCols.splice(fromIndex, 1);
-    reorderedCols.splice(toIndex, 0, reorderedItem[0]);
-
-    saveColumnOrder(reorderedCols);
+    saveColumnOrder(active.id as string, over.id as string);
  };

  const sensors = useSensors(
@@ -75,9 +51,6 @@ function CuesheetHeader(props: CuesheetHeaderProps) {
        tolerance: 50,
      },
    }),
-    useSensor(KeyboardSensor, {
-      coordinateGetter: sortableKeyboardCoordinates,
-    }),
  );

  return (
@@ -86,7 +59,7 @@ function CuesheetHeader(props: CuesheetHeaderProps) {
        const key = headerGroup.id;

        return (
-          <DndContext key={key} sensors={sensors} collisionDetection={closestCenter} onDragEnd={handleOnDragEnd}>
+          <DndContext key={key} sensors={sensors} collisionDetection={closestCorners} onDragEnd={handleOnDragEnd}>
            <tr key={headerGroup.id}>
              <th className={style.indexColumn}>
                <Tooltip label='Event Order' openDelay={tooltipDelayFast}>
@@ -119,5 +92,3 @@ function CuesheetHeader(props: CuesheetHeaderProps) {
    </thead>
  );
 }
-
-export default memo(CuesheetHeader);
@@ -1,4 +1,5 @@
-import { ChangeEvent, memo, useCallback, useEffect, useState } from 'react';
+import { ChangeEvent, memo, useCallback, useEffect, useRef, useState } from 'react';
+import { getHotkeyHandler } from '@mantine/hooks';

 import { AutoTextArea } from '../../../common/components/input/auto-text-area/AutoTextArea';

@@ -12,12 +13,24 @@ const EditableCell = (props: EditableCellProps) => {

  // We need to keep and update the state of the cell normally
  const [value, setValue] = useState(initialValue);
-
+  const ref = useRef<HTMLAreaElement>();
  const onChange = useCallback((event: ChangeEvent<HTMLTextAreaElement>) => setValue(event.target.value), []);

  // We'll only update the external data when the input is blurred
  const onBlur = useCallback(() => handleUpdate(value), [handleUpdate, value]);

+  //TODO: maybe we can unify this with `useReactiveTextInput`
+  const onKeyDown = getHotkeyHandler([
+    ['mod + Enter', () => ref.current?.blur()],
+    [
+      'Escape',
+      () => {
+        setValue(initialValue);
+        setTimeout(() => ref.current?.blur());
+      },
+    ],
+  ]);
+
  // If the initialValue is changed external, sync it up with our state
  useEffect(() => {
    setValue(initialValue);
@@ -27,9 +40,11 @@ const EditableCell = (props: EditableCellProps) => {
    <AutoTextArea
      size='sm'
      value={value}
+      inputref={ref}
      onChange={onChange}
      onBlur={onBlur}
      rows={1}
+      onKeyDown={onKeyDown}
      transition='none'
      spellCheck={false}
      style={{ padding: 0 }}
@@ -49,7 +49,7 @@ function MakeCustomField({ row, column, table }: CellContext<OntimeRundownEntry,
  }

  // events dont necessarily contain all custom fields
-  const initialValue = event.custom[column.id]?.value ?? '';
+  const initialValue = event.custom[column.id] ?? '';

  return <EditableCell value={initialValue} handleUpdate={update} />;
 }
@@ -87,7 +87,7 @@ export const makeTable = (headerData: ProjectData, rundown: OntimeRundown, custo
        // for custom fields, we need to extract the value from the custom object
        if (field.startsWith('custom-')) {
          const fieldLabel = field.split('custom-')[1];
-          const value = entry.custom[fieldLabel]?.value;
+          const value = entry.custom[fieldLabel];
          row.push(parseField(fieldLabel, value));
        } else {
          // @ts-expect-error -- it is ok, we will just not have the data for other fields
@@ -1,7 +1,7 @@
@use './EditorMixin' as editor;

 $min-playback-width: 27rem;
-$max-playback-width: 35rem;
+$max-playback-width: 30rem;
 $panel-gap: 0.5rem;

 .corner {
@@ -9,11 +9,11 @@ $panel-gap: 0.5rem;
 }

 .mainContainer {
-  background: $ui-black;
+  background-color: $ui-black;
  width: 100%;
  height: 100%;
  color: $ui-white;
-  padding: 1rem 0.5rem;
+  padding: 0.5rem;

  display: grid;
  grid-template-columns: auto;
@@ -1,6 +1,7 @@
 import { lazy, useCallback, useEffect } from 'react';
 import { IconButton, useDisclosure } from '@chakra-ui/react';
 import { IoApps } from '@react-icons/all-files/io5/IoApps';
+import { IoClose } from '@react-icons/all-files/io5/IoClose';
 import { IoSettingsOutline } from '@react-icons/all-files/io5/IoSettingsOutline';

 import ProductionNavigationMenu from '../../common/components/navigation-menu/ProductionNavigationMenu';
@@ -62,6 +63,15 @@ export default function Editor() {

  useWindowTitle('Editor');

+  // listen to shutdown request from electron process
+  useEffect(() => {
+    if (window.process?.type === 'renderer') {
+      window.ipcRenderer.on('user-request-shutdown', () => {
+        setLocation('shutdown');
+      });
+    }
+  }, [setLocation]);
+
  return (
    <div className={styles.mainContainer} data-testid='event-editor'>
      <ProductionNavigationMenu isMenuOpen={isMenuOpen} onMenuClose={onClose} />
@@ -75,9 +85,9 @@ export default function Editor() {
        />
        <IconButton
          aria-label='Toggle settings'
-          variant='ontime-subtle-white'
+          variant={isSettingsOpen ? 'ontime-subtle' : 'ontime-subtle-white'}
          size='lg'
-          icon={<IoSettingsOutline />}
+          icon={isSettingsOpen ? <IoClose /> : <IoSettingsOutline />}
          onClick={toggleSettings}
        />
      </EditorOverview>
@@ -2,6 +2,7 @@
  width: 100vw;
  height: 100vh;

+  background-color: $ui-black;
  color: $ui-white;
 }

@@ -173,7 +173,7 @@ export default function Operator() {

            const mainField = main ? entry?.[main] || entry.title : entry.title;
            const secondaryField = getPropertyValue(entry, secondary) ?? '';
-            const subscribedData = entry.custom[subscribe]?.value;
+            const subscribedData = entry.custom[subscribe];

            return (
              <OperatorEvent
@@ -95,7 +95,7 @@ function TitlesOverview() {
 }

 function TimerOverview() {
-  const {current} = useTimer();
+  const { current } = useTimer();

  const display = millisToString(current);

@@ -116,7 +116,7 @@ function RuntimeOverview() {
  const { clock, offset } = useRuntimePlaybackOverview();

  const offsetText = getOffsetText(offset);
-  const offsetClasses = offset === null ? undefined : offset > 0 ? style.behind : style.ahead;
+  const offsetClasses = offset === null ? undefined : offset <= 0 ? style.behind : style.ahead;

  return (
    <>
@@ -0,0 +1,22 @@
+import { dayInMs } from 'ontime-utils';
+
+import { calculateEndAndDaySpan } from '../overviewUtils';
+
+describe('calculateEndAndDaySpan', () => {
+  it('should return [null, 0] when end is null', () => {
+    const result = calculateEndAndDaySpan(null);
+    expect(result).toEqual([null, 0]);
+  });
+
+  it('should return [end, 0] when end is less than or equal to dayInMs', () => {
+    const end = dayInMs / 2;
+    const result = calculateEndAndDaySpan(end);
+    expect(result).toEqual([end, 0]);
+  });
+
+  it('should return [end % dayInMs, Math.floor(end / dayInMs)] when end is greater than dayInMs', () => {
+    const end = dayInMs * 1.5;
+    const result = calculateEndAndDaySpan(end);
+    expect(result).toEqual([end % dayInMs, Math.floor(end / dayInMs)]);
+  });
+});
@@ -13,20 +13,14 @@ export function formatedTime(time: MaybeNumber) {
 }

 /**
- * Calculates a day span from a number range
- * @param end
- * @returns
+ * Calculates how long a time is and how many days it spans
 */
 export function calculateEndAndDaySpan(end: MaybeNumber): [MaybeNumber, number] {
-  let maybeEnd = end;
-  let maybeDaySpan = 0;
-  if (end !== null) {
-    if (end > dayInMs) {
-      maybeEnd = end % dayInMs;
-      maybeDaySpan = Math.floor(end / dayInMs);
-    }
+  if (end !== null && end > dayInMs) {
+    return [end % dayInMs, Math.floor(end / dayInMs)];
  }
-  return [maybeEnd, maybeDaySpan];
+
+  return [end, 0];
 }

 /**
@@ -38,10 +32,5 @@ export function getOffsetText(offset: MaybeNumber): string {
  if (offset === null) {
    return enDash;
  }
-  const isAhead = offset <= 0;
-  let offsetText = millisToString(Math.abs(offset), { fallback: enDash });
-  if (offsetText !== enDash) {
-    offsetText = isAhead ? `+${offsetText}` : `${enDash}${offsetText}`;
-  }
-  return offsetText;
+  return millisToString(offset, { fallback: enDash });
 }
@@ -1,14 +1,15 @@
 import { Fragment, lazy, useCallback, useEffect, useRef, useState } from 'react';
 import { closestCenter, DndContext, DragEndEvent, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
 import { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
+import { useHotkeys } from '@mantine/hooks';
 import { isOntimeEvent, MaybeNumber, Playback, RundownCached, SupportedEvent } from 'ontime-types';
-import { getFirstNormal, getNextNormal, getPreviousNormal } from 'ontime-utils';
+import { getFirstNormal, getLastNormal, getNextNormal, getPreviousNormal } from 'ontime-utils';

 import { useEventAction } from '../../common/hooks/useEventAction';
 import useFollowComponent from '../../common/hooks/useFollowComponent';
 import { useRundownEditor } from '../../common/hooks/useSocket';
 import { AppMode, useAppMode } from '../../common/stores/appModeStore';
-import { useEditorSettings } from '../../common/stores/editorSettings';
+import { useEntryCopy } from '../../common/stores/entryCopyStore';
 import { cloneEvent } from '../../common/utils/eventsManager';

 import QuickAddBlock from './quick-add-block/QuickAddBlock';
@@ -27,10 +28,9 @@ export default function Rundown({ data }: RundownProps) {
  const [statefulEntries, setStatefulEntries] = useState(order);

  const featureData = useRundownEditor();
-  const { addEvent, reorderEvent } = useEventAction();
-  const eventSettings = useEditorSettings((state) => state.eventSettings);
-  const defaultPublic = eventSettings.defaultPublic;
-  const linkPrevious = eventSettings.linkPrevious;
+  const { addEvent, reorderEvent, deleteEvent } = useEventAction();
+
+  const { entryCopyId, setEntryCopyId } = useEntryCopy();

  // cursor
  const { cursor, mode: appMode, setCursor } = useAppMode();
@@ -41,9 +41,21 @@ export default function Rundown({ data }: RundownProps) {
  // DND KIT
  const sensors = useSensors(useSensor(PointerSensor));

+  const deleteAtCursor = useCallback(
+    (cursor: string | null) => {
+      if (!cursor) return;
+      const previous = getPreviousNormal(rundown, order, cursor).entry?.id ?? null;
+      deleteEvent([cursor]);
+      setCursor(previous);
+    },
+    [deleteEvent, order, rundown, setCursor],
+  );
+
  const insertAtCursor = useCallback(
-    (type: SupportedEvent | 'clone', cursor: string | null) => {
-      if (cursor === null) {
+    (type: SupportedEvent | 'clone', cursor: string | null, above = false) => {
+      const adjustedCursor = above ? getPreviousNormal(rundown, order, cursor ?? '').entry?.id ?? null : cursor;
+
+      if (adjustedCursor === null) {
        // we cant clone without selection
        if (type === 'clone') {
          return;
@@ -54,7 +66,7 @@ export default function Rundown({ data }: RundownProps) {
      }

      if (type === 'clone') {
-        const cursorEvent = rundown[cursor];
+        const cursorEvent = rundown[adjustedCursor];
        if (cursorEvent?.type === SupportedEvent.Event) {
          const newEvent = cloneEvent(cursorEvent, cursorEvent.id);
          addEvent(newEvent);
@@ -64,113 +76,90 @@ export default function Rundown({ data }: RundownProps) {
          type: SupportedEvent.Event,
        };
        const options = {
-          after: cursor,
-          defaultPublic,
-          lastEventId: cursor,
-          linkPrevious,
+          after: adjustedCursor,
+          lastEventId: adjustedCursor,
        };
        addEvent(newEvent, options);
      } else {
-        addEvent({ type }, { after: cursor });
+        addEvent({ type }, { after: adjustedCursor });
      }
    },
-    [addEvent, rundown, defaultPublic, linkPrevious],
+    [rundown, order, addEvent],
  );

-  // Handle keyboard shortcuts
-  const handleKeyDown = useCallback(
-    (event: KeyboardEvent) => {
-      // handle held key
-      if (event.repeat) return;
+  const selectEntry = useCallback(
+    (cursor: string | null, direction: 'up' | 'down') => {
+      if (order.length < 1) {
+        return;
+      }
+      let newCursor: string | undefined;
+      if (cursor === null) {
+        // there is no cursor, we select the first or last depending on direction if it exists
+        newCursor = direction === 'up' ? getLastNormal(rundown, order)?.id : getFirstNormal(rundown, order)?.id;
+      } else {
+        // otherwise we select the next or previous
+        newCursor =
+          direction === 'up'
+            ? getPreviousNormal(rundown, order, cursor).entry?.id
+            : getNextNormal(rundown, order, cursor).entry?.id;
+      }

-      const modKeysAlt = event.altKey && !event.ctrlKey && !event.shiftKey;
-      const modKeysCtrlAlt = event.altKey && event.ctrlKey && !event.shiftKey;
-
-      if (modKeysAlt) {
-        switch (event.code) {
-          case 'ArrowDown': {
-            if (order.length < 1) {
-              return;
-            }
-            const nextEvent =
-              cursor === null ? getFirstNormal(rundown, order) : getNextNormal(rundown, order, cursor)?.nextEvent;
-            if (nextEvent) {
-              setCursor(nextEvent.id);
-            }
-            break;
-          }
-          case 'ArrowUp': {
-            if (order.length < 1) {
-              return;
-            }
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- we check for this before
-            const previousEvent =
-              cursor === null
-                ? getFirstNormal(rundown, order)
-                : getPreviousNormal(rundown, order, cursor).previousEvent;
-            if (previousEvent) {
-              setCursor(previousEvent.id);
-            }
-            break;
-          }
-          case 'KeyE': {
-            event.preventDefault();
-            insertAtCursor(SupportedEvent.Event, cursor);
-            break;
-          }
-          case 'KeyD': {
-            event.preventDefault();
-            insertAtCursor(SupportedEvent.Delay, cursor);
-            break;
-          }
-          case 'KeyB': {
-            event.preventDefault();
-            insertAtCursor(SupportedEvent.Block, cursor);
-            break;
-          }
-          case 'KeyC': {
-            event.preventDefault();
-            insertAtCursor('clone', cursor);
-            break;
-          }
-        }
-      } else if (modKeysCtrlAlt) {
-        if (order.length < 2 || cursor == null) {
-          return;
-        }
-        // Alt + Ctrl + Arrow Down
-        if (event.code == 'ArrowDown') {
-          const { nextEvent, nextIndex } = getNextNormal(rundown, order, cursor);
-          if (nextEvent && nextIndex !== null) {
-            reorderEvent(cursor, nextIndex - 1, nextIndex);
-          }
-          // Alt + Ctrl + Arrow Up
-        } else if (event.code == 'ArrowUp') {
-          const { previousEvent, previousIndex } = getPreviousNormal(rundown, order, cursor);
-          if (previousEvent && previousIndex !== null) {
-            reorderEvent(cursor, previousIndex + 1, previousIndex);
-          }
-        }
+      if (newCursor) {
+        setCursor(newCursor);
      }
    },
-    [order, cursor, rundown, setCursor, insertAtCursor, reorderEvent],
+    [order, rundown, setCursor],
  );

+  const moveEntry = useCallback(
+    (cursor: string | null, direction: 'up' | 'down') => {
+      if (order.length < 2 || cursor == null) {
+        return;
+      }
+      const { index } =
+        direction === 'up' ? getPreviousNormal(rundown, order, cursor) : getNextNormal(rundown, order, cursor);
+
+      if (index !== null) {
+        const offsetIndex = direction === 'up' ? index + 1 : index - 1;
+        reorderEvent(cursor, offsetIndex, index);
+      }
+    },
+    [order, reorderEvent, rundown],
+  );
+
+  // shortcuts
+  useHotkeys([
+    ['alt + ArrowDown', () => selectEntry(cursor, 'down'), { preventDefault: true }],
+    ['alt + ArrowUp', () => selectEntry(cursor, 'up'), { preventDefault: true }],
+    ['alt + mod + ArrowDown', () => moveEntry(cursor, 'down'), { preventDefault: true }],
+    ['alt + mod + ArrowUp', () => moveEntry(cursor, 'up'), { preventDefault: true }],
+
+    ['Escape', () => setCursor(null), { preventDefault: true }],
+
+    ['mod + Backspace', () => deleteAtCursor(cursor), { preventDefault: true }],
+
+    ['alt + E', () => insertAtCursor(SupportedEvent.Event, cursor), { preventDefault: true }],
+    ['alt + shift + E', () => insertAtCursor(SupportedEvent.Event, cursor, true), { preventDefault: true }],
+
+    ['alt + B', () => insertAtCursor(SupportedEvent.Block, cursor), { preventDefault: true }],
+    ['alt + shift + B', () => insertAtCursor(SupportedEvent.Block, cursor, true), { preventDefault: true }],
+
+    ['alt + D', () => insertAtCursor(SupportedEvent.Delay, cursor), { preventDefault: true }],
+    ['alt + shift + D', () => insertAtCursor(SupportedEvent.Delay, cursor, true), { preventDefault: true }],
+
+    ['mod + C', () => setEntryCopyId(cursor), { preventDefault: true }],
+    ['mod + V', () => insertAtCursor('clone', entryCopyId), { preventDefault: true }],
+    ['mod + shift + V', () => insertAtCursor('clone', entryCopyId, true), { preventDefault: true }],
+
+    ['alt + backspace', () => deleteAtCursor(cursor), { preventDefault: true }],
+  ]);
+
  // we copy the state from the store here
  // to workaround async updates on the drag mutations
  useEffect(() => {
    setStatefulEntries(order);
  }, [order]);

-  // listen to keys
-  useEffect(() => {
-    document.addEventListener('keydown', handleKeyDown);
-
-    return () => {
-      document.removeEventListener('keydown', handleKeyDown);
-    };
-  }, [handleKeyDown]);
-
  useEffect(() => {
    // in run mode, we follow selection
    if (appMode !== AppMode.Run || !featureData?.selectedEventId) {
@@ -4,7 +4,6 @@ import { MaybeNumber, OntimeEvent, OntimeRundownEntry, Playback, SupportedEvent
 import { useEventAction } from '../../common/hooks/useEventAction';
 import useMemoisedFn from '../../common/hooks/useMemoisedFn';
 import { useAppMode } from '../../common/stores/appModeStore';
-import { useEditorSettings } from '../../common/stores/editorSettings';
 import { useEmitLog } from '../../common/stores/logger';
 import { cloneEvent } from '../../common/utils/eventsManager';

@@ -59,22 +58,20 @@ export default function RundownEntry(props: RundownEntryProps) {
  const { addEvent, updateEvent, batchUpdateEvents, deleteEvent, swapEvents } = useEventAction();
  const cursor = useAppMode((state) => state.cursor);
  const setCursor = useAppMode((state) => state.setCursor);
-  const { selectedEvents, clearSelectedEvents } = useEventSelection();
-
-  const eventSettings = useEditorSettings((state) => state.eventSettings);
-  const defaultPublic = eventSettings.defaultPublic;
-  const linkPrevious = eventSettings.linkPrevious;
+  const { selectedEvents, unselect, clearSelectedEvents } = useEventSelection();

  const removeOpenEvent = useCallback(() => {
-    if (selectedEvents.has(data.id)) {
-      clearSelectedEvents();
-    }
-
+    unselect(data.id);
    // clear cursor if we are deleting the event that is currently selected
    if (cursor === data.id) {
      setCursor(null);
    }
-  }, [selectedEvents, data.id, cursor, clearSelectedEvents, setCursor]);
+  }, [unselect, data.id, cursor, setCursor]);
+
+  const clearMultiSelection = useCallback(() => {
+    clearSelectedEvents();
+    setCursor(null);
+  }, [clearSelectedEvents, setCursor]);

  // Create / delete new events
  type FieldValue = {
@@ -88,9 +85,7 @@ export default function RundownEntry(props: RundownEntryProps) {
        const newEvent = { type: SupportedEvent.Event };
        const options = {
          after: data.id,
-          defaultPublic,
          lastEventId: previousEventId,
-          linkPrevious,
        };
        return addEvent(newEvent, options);
      }
@@ -98,8 +93,6 @@ export default function RundownEntry(props: RundownEntryProps) {
        const newEvent = { type: SupportedEvent.Event };
        const options = {
          after: previousEventId,
-          defaultPublic,
-          linkPrevious,
        };
        return addEvent(newEvent, options);
      }
@@ -120,10 +113,12 @@ export default function RundownEntry(props: RundownEntryProps) {
        return swapEvents({ from: value as string, to: data.id });
      }
      case 'delete': {
-        if (selectedEvents.has(data.id)) {
-          removeOpenEvent();
+        if (selectedEvents.size > 1) {
+          clearMultiSelection();
+          return deleteEvent(Array.from(selectedEvents));
        }
-        return deleteEvent(data.id);
+        removeOpenEvent();
+        return deleteEvent([data.id]);
      }
      case 'clone': {
        const newEvent = cloneEvent(data as OntimeEvent, data.id);
@@ -143,7 +138,7 @@ export default function RundownEntry(props: RundownEntryProps) {
        if (selectedEvents.size > 1) {
          const changes: Partial<OntimeEvent> = { [field]: value };
          batchUpdateEvents(changes, Array.from(selectedEvents));
-          return clearSelectedEvents();
+          return;
        }
        if (field in data) {
          // @ts-expect-error -- not sure how to type this
@@ -36,7 +36,7 @@

  flex: 1 2 auto; /* flex-grow: 1, flex-shrink: 2, flex-basis: auto */
  min-width: 38rem;
-  max-width: 45rem;
+  max-width: 60rem;
 }

 .side {
@@ -1,7 +1,9 @@
 import { memo } from 'react';
 import { IoArrowUp } from '@react-icons/all-files/io5/IoArrowUp';

+import { ContextMenu } from '../../common/components/context-menu/ContextMenu';
 import ErrorBoundary from '../../common/components/error-boundary/ErrorBoundary';
+import { useAppMode } from '../../common/stores/appModeStore';
 import { handleLinks } from '../../common/utils/linkUtils';
 import { cx } from '../../common/utils/styleUtils';

@@ -12,6 +14,8 @@ import style from './RundownExport.module.scss';

 const RundownExport = () => {
  const isExtracted = window.location.pathname.includes('/rundown');
+  const appMode = useAppMode((state) => state.mode);
+  const hideSideBar = isExtracted && appMode === 'run';

  const classes = cx([style.rundownExport, isExtracted && style.extracted]);

@@ -21,14 +25,18 @@ const RundownExport = () => {
        <div className={style.list}>
          <ErrorBoundary>
            {!isExtracted && <IoArrowUp className={style.corner} onClick={(event) => handleLinks(event, 'rundown')} />}
-            <RundownWrapper />
-          </ErrorBoundary>
-        </div>
-        <div className={style.side}>
-          <ErrorBoundary>
-            <EventEditor />
+            <ContextMenu>
+              <RundownWrapper />
+            </ContextMenu>
          </ErrorBoundary>
        </div>
+        {!hideSideBar && (
+          <div className={style.side}>
+            <ErrorBoundary>
+              <EventEditor />
+            </ErrorBoundary>
+          </div>
+        )}
      </div>
    </div>
  );
@@ -18,10 +18,10 @@ $block-cursor-color: $orange-400;

@mixin block-styling() {
  box-sizing: content-box;
-  border: 1px solid $white-10;
-  font-family: $ontime-font-family;
+  border: 1px solid $white-7;
  border-radius: $block-border-radius;
-  margin: 0.25rem 0.125rem;
+  margin-block: 0.25rem;
+  margin-right: 0.125rem;
  position: relative;
  color: $block-text-color;

@@ -3,6 +3,7 @@
 .block {
  @include block-spacing;
  @include block-styling;
+  margin-left: 0.5rem;

  background-color: $block-bg2;

@@ -1,14 +1,14 @@
 import { useRef } from 'react';
-import { IconButton } from '@chakra-ui/react';
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
 import { IoReorderTwo } from '@react-icons/all-files/io5/IoReorderTwo';
-import { IoTrash } from '@react-icons/all-files/io5/IoTrash';
 import { OntimeBlock } from 'ontime-types';

 import { cx } from '../../../common/utils/styleUtils';
 import EditableBlockTitle from '../common/EditableBlockTitle';

+import BlockDelete from './BlockDelete';
+
 import style from './BlockBlock.module.scss';

 interface BlockBlockProps {
@@ -19,6 +19,7 @@ interface BlockBlockProps {

 export default function BlockBlock(props: BlockBlockProps) {
  const { data, hasCursor, onDelete } = props;
+
  const handleRef = useRef<null | HTMLSpanElement>(null);

  const {
@@ -45,14 +46,7 @@ export default function BlockBlock(props: BlockBlockProps) {
        <IoReorderTwo />
      </span>
      <EditableBlockTitle title={data.title} eventId={data.id} placeholder='Block title' />
-      <IconButton
-        aria-label='Delete'
-        size='sm'
-        icon={<IoTrash />}
-        variant='ontime-subtle'
-        color='#FA5656'
-        onClick={onDelete}
-      />
+      <BlockDelete onDelete={onDelete} />
    </div>
  );
 }
@@ -0,0 +1,27 @@
+import { IconButton } from '@chakra-ui/react';
+import { IoTrash } from '@react-icons/all-files/io5/IoTrash';
+
+import { AppMode, useAppMode } from '../../../common/stores/appModeStore';
+
+interface BlockDeleteProps {
+  onDelete: () => void;
+}
+
+export default function BlockDelete(props: BlockDeleteProps) {
+  const { onDelete } = props;
+  const mode = useAppMode((state) => state.mode);
+
+  const isRunMode = mode === AppMode.Run;
+
+  return (
+    <IconButton
+      aria-label='Delete'
+      size='sm'
+      icon={<IoTrash />}
+      variant='ontime-subtle'
+      color='#FA5656'
+      onClick={onDelete}
+      isDisabled={isRunMode}
+    />
+  );
+}
@@ -1,4 +1,4 @@
-import { useCallback } from 'react';
+import { useCallback, useRef } from 'react';
 import { Input } from '@chakra-ui/react';

 import useReactiveTextInput from '../../../common/components/input/text-input/useReactiveTextInput';
@@ -17,7 +17,7 @@ interface TitleEditorProps {
 export default function EditableBlockTitle(props: TitleEditorProps) {
  const { title, eventId, placeholder, className } = props;
  const { updateEvent } = useEventAction();
-
+  const ref = useRef<HTMLInputElement | null>(null);
  const submitCallback = useCallback(
    (text: string) => {
      if (text === title) {
@@ -30,7 +30,7 @@ export default function EditableBlockTitle(props: TitleEditorProps) {
    [title, updateEvent, eventId],
  );

-  const { value, onChange, onBlur, onKeyDown } = useReactiveTextInput(title, submitCallback, {
+  const { value, onChange, onBlur, onKeyDown } = useReactiveTextInput(title, submitCallback, ref, {
    submitOnEnter: true,
  });

@@ -40,6 +40,7 @@ export default function EditableBlockTitle(props: TitleEditorProps) {
    <Input
      data-testid='block__title'
      variant='ontime-ghosted'
+      ref={ref}
      value={value}
      className={classes}
      placeholder={placeholder}
@@ -3,6 +3,7 @@
 .delay {
  @include block-spacing;
  @include block-styling;
+  margin-left: 0.5rem;

  background-color: $block-bg2;

@@ -50,7 +50,7 @@ export default function DelayBlock(props: DelayBlockProps) {
  };

  const cancelDelayHandler = () => {
-    deleteEvent(data.id);
+    deleteEvent([data.id]);
  };

  const blockClasses = cx([style.delay, hasCursor ? style.hasCursor : null]);
@@ -113,6 +113,7 @@ export default function EventBlock(props: EventBlockProps) {
                value: false,
              }),
          },
+          { withDivider: true, label: 'Delete', icon: IoTrash, onClick: () => actionHandler('delete') },
        ]
      : [
          {
@@ -242,13 +243,7 @@ export default function EventBlock(props: EventBlockProps) {
      onContextMenu={onContextMenu}
      id='event-block'
    >
-      <RundownIndicators
-        timeStart={timeStart}
-        timeEnd={timeEnd}
-        previousStart={previousStart}
-        previousEnd={previousEnd}
-        delay={delay}
-      />
+      <RundownIndicators timeStart={timeStart} previousStart={previousStart} previousEnd={previousEnd} delay={delay} />

      <div className={style.binder} style={{ ...binderColours }} tabIndex={-1}>
        <span className={style.drag} ref={handleRef} {...dragAttributes} {...dragListeners}>
@@ -1,5 +1,5 @@
 import { MaybeNumber } from 'ontime-types';
-import { dayInMs, millisToString, removeLeadingZero, removeTrailingZero } from 'ontime-utils';
+import { checkIsNextDay, dayInMs, millisToString, removeLeadingZero, removeTrailingZero } from 'ontime-utils';

 export function formatDelay(timeStart: number, delay: number): string | undefined {
  if (!delay) return;
@@ -14,20 +14,23 @@ export function formatOverlap(
  previousStart: MaybeNumber,
  previousEnd: MaybeNumber,
  timeStart: number,
-  timeEnd: number,
 ): string | undefined {
-  if (previousEnd === null) return;
+  const noPreviousElement = previousEnd === null || previousStart === null;
+  if (noPreviousElement) return;

  const overlap = previousEnd - timeStart;
  if (overlap === 0) return;

-  if (previousStart && timeStart < previousEnd) {
-    const overlap = timeEnd - previousStart;
-    if (overlap > 0) {
-      const overlapString = removeLeadingZero(millisToString(Math.abs(overlap)));
-      return `Overlap ${overlapString}`;
-    }
-    const gap = timeStart + dayInMs - previousEnd;
+  const previousCrossMidnight = previousStart > previousEnd;
+  const isNextDay = previousCrossMidnight
+    ? checkIsNextDay(previousEnd, timeStart) || previousEnd == 0 // exception for when previousEnd is precisely midnight
+    : checkIsNextDay(previousStart, timeStart);
+
+  const correctedPreviousEnd = previousCrossMidnight ? previousEnd + dayInMs : previousEnd;
+
+  if (isNextDay) {
+    const gap = dayInMs - correctedPreviousEnd + timeStart;
+    if (gap === 0) return;
    const gapString = removeLeadingZero(millisToString(Math.abs(gap)));
    return `Gap ${gapString} (next day)`;
  }
@@ -6,16 +6,15 @@ import style from './RundownIndicators.module.scss';

 interface RundownIndicatorProps {
  timeStart: number;
-  timeEnd: number;
  previousStart: MaybeNumber;
  previousEnd: MaybeNumber;
  delay: number;
 }

 export default function RundownIndicators(props: RundownIndicatorProps) {
-  const { timeStart, timeEnd, previousStart, previousEnd, delay } = props;
+  const { timeStart, previousStart, previousEnd, delay } = props;

-  const hasOverlap = formatOverlap(previousStart, previousEnd, timeStart, timeEnd);
+  const hasOverlap = formatOverlap(previousStart, previousEnd, timeStart);
  const hasDelay = formatDelay(timeStart, delay);

  return (
@@ -1,3 +1,5 @@
+import { MILLIS_PER_HOUR } from 'ontime-utils';
+
 import { formatDelay, formatOverlap } from '../EventBlock.utils';

 describe('formatDelay()', () => {
@@ -14,35 +16,47 @@ describe('formatOverlap()', () => {
    const previousStart = 0;
    const previousEnd = 60000; // 1 min
    const timeStart = 30000; // 30 sec
-    const timeEnd = 90000; // 1:30 min
-    const result = formatOverlap(previousStart, previousEnd, timeStart, timeEnd);
+    const result = formatOverlap(previousStart, previousEnd, timeStart);
    expect(result).toEqual('Overlap 0:30');
  });

+  it('bug #949 recognises an overlap between two times', () => {
+    const previousStart = 46800000; // 13:00:00
+    const previousEnd = 48600000; // 13:30:00
+    const timeStart = 48300000; // 13:25:00
+    const result = formatOverlap(previousStart, previousEnd, timeStart);
+    expect(result).toEqual('Overlap 5:00');
+  });
+
  it('handles events the day after, without overlap', () => {
-    const previousStart = new Date(0).setUTCHours(11);
-    const previousEnd = new Date(0).setUTCHours(12);
-    const timeStart = new Date(0).setUTCHours(6);
-    const timeEnd = new Date(0).setUTCHours(10);
-    const result = formatOverlap(previousStart, previousEnd, timeStart, timeEnd);
+    const previousStart = 11 * MILLIS_PER_HOUR;
+    const previousEnd = 12 * MILLIS_PER_HOUR;
+    const timeStart = 6 * MILLIS_PER_HOUR;
+    const result = formatOverlap(previousStart, previousEnd, timeStart);
    expect(result).toBe('Gap 18:00:00 (next day)');
  });

-  it('handles events the day after, with overlap', () => {
-    const previousStart = new Date(0).setUTCHours(9);
-    const previousEnd = new Date(0).setUTCHours(10);
-    const timeStart = new Date(0).setUTCHours(6);
-    const timeEnd = new Date(0).setUTCHours(11);
-    const result = formatOverlap(previousStart, previousEnd, timeStart, timeEnd);
-    expect(result).toBe('Overlap 02:00:00');
-  });
-
  it('handles events the day after, with gap', () => {
-    const previousStart = new Date(0).setUTCHours(17);
-    const previousEnd = new Date(0).setUTCHours(23);
-    const timeStart = new Date(0).setUTCHours(9);
-    const timeEnd = new Date(0).setUTCHours(11);
-    const result = formatOverlap(previousStart, previousEnd, timeStart, timeEnd);
+    const previousStart = 17 * MILLIS_PER_HOUR;
+    const previousEnd = 23 * MILLIS_PER_HOUR;
+    const timeStart = 9 * MILLIS_PER_HOUR;
+    const result = formatOverlap(previousStart, previousEnd, timeStart);
    expect(result).toBe('Gap 10:00:00 (next day)');
  });
+
+  it('handles events the day after, with previous ending at midnight', () => {
+    const previousStart = 23 * MILLIS_PER_HOUR; // 23:00:00
+    const previousEnd = 0; // 00:00:00
+    const timeStart = 1 * MILLIS_PER_HOUR; // 01:00:00
+    const result = formatOverlap(previousStart, previousEnd, timeStart);
+    expect(result).toBe('Gap 01:00:00 (next day)');
+  });
+
+  it('handles events the day after, with previous ending over midnight', () => {
+    const previousStart = 23 * MILLIS_PER_HOUR;
+    const previousEnd = 1 * MILLIS_PER_HOUR;
+    const timeStart = 2 * MILLIS_PER_HOUR;
+    const result = formatOverlap(previousStart, previousEnd, timeStart);
+    expect(result).toBe('Gap 01:00:00');
+  });
 });
@@ -45,7 +45,6 @@
  font-size: calc(1rem - 3px);
  color: $label-gray;
  margin-bottom: 0.25rem;
-  text-transform: capitalize;
 }

 .decorated {
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
jwetzell	8d526c7d31	Merge pull request #1019 from cpvalente/cleanup-server-setup remove redundant path evaluation	2024-05-30 07:57:23 -05:00
Carlos Valente	686c6108bf	refactor: improve payload type for OSC (#954 ) --------- Co-authored-by: Joel Wetzell <jwetzell@yahoo.com> Co-authored-by: arc-alex <ac@omnivox.dk>	2024-05-30 13:02:22 +02:00
Carlos Valente	ea3d33ca93	fix: correct key on shortcuts	2024-05-30 12:15:57 +02:00
jwetzell	6bf94ff645	remove redundant path evaluation	2024-05-29 16:25:15 -05:00
Carlos Valente	930cd71ffd	chore: upgrade electron	2024-05-29 08:33:44 +02:00
Carlos Valente	45cf1cf199	chore: bump version to 3.0.4	2024-05-28 22:49:29 +02:00
Carlos Valente	354f464263	chore: user feedback	2024-05-28 22:49:29 +02:00
Carlos Valente	c46a00febc	chore: expand download links	2024-05-28 22:49:29 +02:00
Carlos Valente	e991e151db	refactor: improve dnd activation strategy	2024-05-28 22:45:10 +02:00
Carlos Valente	b5993b91e1	fix: column reordering refactor: migrate local storage hook	2024-05-28 22:45:10 +02:00
arc-alex	4beac19c4a	Clear upload folder on startup	2024-05-28 22:44:55 +02:00
Carlos Valente	be852f4546	refactor: allow hiding sidebar	2024-05-27 15:52:02 +02:00
Carlos Valente	84e224dd71	refactor: unify time parsing logic	2024-05-27 15:51:45 +02:00
Carlos Valente	7cbb2112ed	refactor: simplify parsing logic	2024-05-27 15:51:45 +02:00
Carlos Valente	ce910c9cc6	refactor: extract parseUserTime	2024-05-27 15:51:45 +02:00
Alex Christoffer Rasmussen	9d04954d87	fix change api isPublic (#1008 )	2024-05-27 13:01:10 +02:00
Alex Christoffer Rasmussen	345ea6722e	add notes to secondaryOptions in timer view (#1004 )	2024-05-27 12:22:01 +02:00
Alex Christoffer Rasmussen	f43221cf7a	don't notify when aux timer is paused (#1003 )	2024-05-27 11:51:07 +02:00
Carlos Valente	a09aa922bb	refactor: delete several events	2024-05-26 21:36:49 +02:00
Carlos Valente	16f31a07b7	chore: upgrade dependencies	2024-05-26 21:36:49 +02:00
Carlos Valente	77d111650a	refactor: reduce scope of context	2024-05-26 21:36:49 +02:00
jwetzell	72891a69f4	Merge pull request #998 from cpvalente/fix/smart-time-parsing address some issues in am/pm time parsing	2024-05-26 11:07:43 -05:00
Carlos Valente	b8d5a30caf	style: input text alignment	2024-05-25 15:19:01 +02:00
jwetzell	9cbd4c085b	slim back tests even further and list out	2024-05-24 06:51:51 -05:00
jwetzell	afe0323384	use let not var	2024-05-24 06:12:46 -05:00
jwetzell	1907abc512	pare back am/pm tests	2024-05-24 05:53:07 -05:00
jwetzell	834aafe06d	remove need for hardcoded 12am test	2024-05-23 20:29:05 -05:00
jwetzell	98418014d3	lowercase time string before beginning to parse	2024-05-23 20:16:41 -05:00
jwetzell	3d13e784ea	fix parsing am/pm times	2024-05-23 19:45:12 -05:00
jwetzell	e397500d07	dynamically build am/pm tests	2024-05-23 19:17:36 -05:00
jwetzell	c7c0241859	add new am/pm test cases for dateConfig util	2024-05-23 17:39:42 -05:00
Carlos Valente	71a7fe96d1	style: fix input overflow	2024-05-23 22:13:42 +02:00
jwetzell	d0f958c13d	Merge pull request #990 from cpvalente/fix/docker-build fix docker multi-architecture build	2024-05-23 08:15:07 -05:00
jwetzell	7ee98fb062	remove node setup and build from docker action	2024-05-21 16:06:28 -05:00
jwetzell	c2b66a4215	rework dockerfile to remove need for turbo	2024-05-21 16:06:15 -05:00
jwetzell	1d0ee10c00	remove build:docker from turbo	2024-05-21 16:05:49 -05:00
Carlos Valente	248c952ec7	chore: bump version to 3.0.3	2024-05-21 20:59:58 +02:00
jwetzell	3cda6b222e	Merge pull request #983 from thelan/docker-multistage Multistage docker build	2024-05-21 08:10:21 -05:00
Julien Recurt	d161411416	Updating Dockerfile for multistage build based on feedbacks	2024-05-21 11:27:02 +02:00
Leon Eckardt	97b8e6a290	fix #984 Expected End of timeline is not calculated correctly (#985 )	2024-05-20 22:28:23 +02:00
Carlos Valente	036d4051fc	fix: account for skip in rundown calculations	2024-05-20 22:13:28 +02:00
Carlos Valente	7cefe07594	refactor: cap added time	2024-05-20 21:17:37 +02:00
Carlos Valente	d05cc88748	refactor: unify time constants	2024-05-20 21:17:37 +02:00
Carlos Valente	119e6caca3	refactor: cap timer values	2024-05-20 21:17:37 +02:00
Carlos Valente	bb199128aa	style: rundown takes available space	2024-05-20 21:12:31 +02:00
Carlos Valente	dade6f6692	style: tweaks to shortcut panel	2024-05-20 21:12:31 +02:00
Carlos Valente	6bedd7ab1d	style: consistent spacing in editor	2024-05-20 21:12:31 +02:00
Carlos Valente	eb2c4d0780	refactor: recover day after indicator	2024-05-20 21:11:52 +02:00
Carlos Valente	4069038ed5	chore: forgiving test	2024-05-20 19:32:28 +02:00
Carlos Valente	ac430602b4	chore: upgrade vite dependencies	2024-05-20 19:32:28 +02:00
Carlos Valente	082449bede	fix: handle finish when adding time	2024-05-20 19:32:28 +02:00
Carlos Valente	cfbd540a14	style: expose bg override variable	2024-05-20 19:29:57 +02:00
Julien Recurt	a431fab3c4	exclude compose generated volumes directory	2024-05-19 21:16:39 +02:00
Julien Recurt	770d975610	Update DEVELOPMENT.md	2024-05-19 20:44:42 +02:00
Julien Recurt	6f95aac798	Adding multistage build	2024-05-19 20:40:35 +02:00
Carlos Valente	dae6f84af0	fix: excel parsing	2024-05-17 19:44:47 +02:00
Carlos Valente	ad46fac2d7	chore: add tests to support docs	2024-05-15 21:28:02 +02:00
Carlos Valente	37786c3528	chore: bump version to 3.0.2	2024-05-13 14:15:18 +02:00
Carlos Valente	c6d36d2497	refactor: forgiving test	2024-05-13 08:25:57 +02:00
Carlos Valente	2394eced93	refactor: forgiving test	2024-05-13 08:08:43 +02:00
Carlos Valente	13aeeb278d	fix: filename may not exist	2024-05-13 08:08:43 +02:00
Carlos Valente	af5d6e1aee	fix: prevent stale selection	2024-05-13 08:06:28 +02:00
Carlos Valente	bc036bdae7	refactor: forviging test Allow a scenario where the operation execution happens in the next millisecond	2024-05-12 20:15:59 +02:00
Carlos Valente	266a84e5d3	chore: update keywords	2024-05-12 20:15:59 +02:00
Carlos Valente	92c3148e49	chore: bump version to 3.0.1	2024-05-12 20:15:59 +02:00
Carlos Valente	efd05bcc34	refactor: simplify overview logic	2024-05-12 17:16:33 +02:00
Carlos Valente	3c7e061e51	refactor: improve detection of day after fix: prevent mutation of initial object refactor: download project file Update apps/client/src/features/rundown/event-block/EventBlock.utils.ts Co-authored-by: Alex Christoffer Rasmussen <ac@omnivox.dk> Update apps/client/src/features/rundown/event-block/__tests__/EventBlock.utils.test.ts Co-authored-by: Alex Christoffer Rasmussen <ac@omnivox.dk>	2024-05-12 17:16:33 +02:00
Carlos Valente	07074260a4	refactor: improve integration updates	2024-05-12 17:03:13 +02:00
Carlos Valente	c57b0423af	refactor: leading updates in timers	2024-05-12 17:03:13 +02:00
Carlos Valente	52145d5e1e	chore: update element order	2024-05-11 14:58:28 +02:00
Alex Christoffer Rasmussen	b2668e61a5	refactor: improve logging from http integration (#946 )	2024-05-11 14:23:07 +02:00
Carlos Valente	7da3480dfe	style: improve readability of shortcuts	2024-05-11 14:22:29 +02:00
Carlos Valente	e8cfdbe3b9	refactor: simplify tests	2024-05-11 14:22:29 +02:00
Carlos Valente	fd052355c3	style: uniform button size	2024-05-11 14:22:29 +02:00
Carlos Valente	00f04fb78c	refactor: download project file	2024-05-10 22:35:12 +02:00
Carlos Valente	6f80de58ca	fix: prevent mutation of initial object	2024-05-10 21:59:01 +02:00
Carlos Valente	5977266332	chore: update readme	2024-05-07 21:34:49 +02:00
Carlos Valente	a40fa0dbf8	chore: version bump	2024-05-07 21:00:42 +02:00
arc-alex	e92f59ac55	await and display errors	2024-05-07 15:49:07 +02:00
Carlos Valente	077c67e912	chore: sign macos dist	2024-05-07 12:42:47 +02:00
Alex Christoffer Rasmussen	9644cbde92	fix: demo page, update docs link and fix data destructuring (#932 )	2024-05-02 12:17:08 +02:00
Charalambos Makridakis	8b0e03e980	#914 Refactor: Luxon-Depenency, formatFromMillis() (#924 )	2024-04-29 23:20:12 +02:00
Carlos Valente	0966659596	chore: version bump	2024-04-29 22:44:24 +02:00
Carlos Valente	1123e29499	fix: explicit rundown order in tests	2024-04-29 22:41:02 +02:00
Carlos Valente	3d2248cceb	style: remove unnecessary padding	2024-04-29 22:41:02 +02:00
Carlos Valente	043ba38916	chore: update typeface	2024-04-29 22:41:02 +02:00
Carlos Valente	5b6d4c5b28	style: toggle settings button	2024-04-29 22:41:02 +02:00
Carlos Valente	07e8bedff4	style: text formatting in menu	2024-04-29 22:41:02 +02:00
Carlos Valente	6e61a7ecf9	refactor: runtime side effects	2024-04-29 22:40:39 +02:00
Alex Christoffer Rasmussen	accdf2c396	Fix: custom fields with undefined colour is not accepted by `parseCustomFields` (#925 )	2024-04-29 22:33:58 +02:00
Alex Christoffer Rasmussen	5e39c9b51f	Feat: export custom fileds to sheets (#926 ) * export custom keys to sheets * use `:` in place of `-`	2024-04-29 15:15:18 +02:00
Carlos Valente	b52fb0f9ee	chore: update automation scripts	2024-04-28 22:11:42 +02:00
Carlos Valente	54f30e69a1	chore: version bump	2024-04-27 22:39:04 +02:00
Carlos Valente	189cee0104	fix: state stale in integrations	2024-04-27 22:34:08 +02:00
Alex Christoffer Rasmussen	9e04a1dcfa	shortcuts using useHotkeys from mantine/hooks (#907 ) --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com> Co-authored-by: Carlos Valente <carlosvalente@pm.me>	2024-04-27 18:00:41 +02:00
Carlos Valente	0c3c08ac98	refactor: custom fields casing	2024-04-27 15:36:29 +02:00
Carlos Valente	95b437e18c	refactor(build): remove legal	2024-04-27 10:18:10 +02:00
Carlos Valente	75b5118b0f	refactor: user alerts on destructive actions	2024-04-27 10:18:10 +02:00
Carlos Valente	dcbb92c470	style: prevent overflow on defaults	2024-04-26 19:40:21 +02:00
Carlos Valente	8da8a08464	refactor: invert offset	2024-04-26 19:39:05 +02:00
Carlos Valente	8b5034efbf	refactor: added time is time ahead	2024-04-26 19:39:05 +02:00
Alex Christoffer Rasmussen	74418ce17e	Link start times from excel import (#903 ) * add test for linking start time in excel import * link ids * add link to UI * ensure times with cachedRundown --------- Co-authored-by: Carlos Valente <carlosvalente@pm.me>	2024-04-26 18:09:59 +02:00
Carlos Valente	d8a8f0ad92	style: use user given capitalisation	2024-04-26 15:05:17 +02:00
Carlos Valente	817ebcdd26	Event defaults (#910 ) * chore: cleanup outdated comment * style: align blocks * style: use ui-black background * chore: clarify docs * feat: event defaults * chore: cleanup	2024-04-24 20:13:51 +02:00
Carlos Valente	c4f51192de	chore: test custom field renaming	2024-04-23 22:05:56 +02:00
Carlos Valente	5cf5b2fae3	chore: cleanup	2024-04-23 22:05:56 +02:00
Carlos Valente	8f249b9d51	refactor: rundown must be in order	2024-04-19 20:49:37 +02:00
Carlos Valente	bef69e7d0f	fix: obfuscation logic for operator pin	2024-04-19 20:38:01 +02:00
Carlos Valente	dd81b92584	refactor: simplify l3	2024-04-19 20:38:01 +02:00
Alex Christoffer Rasmussen	b14ac07568	excel import leading and trailing whitespace (#902 ) * add test for leading and trailing whitespace * trim whitespace	2024-04-19 20:36:06 +02:00
Carlos Valente	c4136a0ec7	refactor: simplify custom field shape	2024-04-19 12:06:19 +02:00
Carlos Valente	cf14b0b427	refactor: consolidate language of AuxTimer (#896 )	2024-04-17 21:31:10 +02:00
Carlos Valente	16a169b22c	Beta 2 review (#897 ) * style: subdue secondary buttons * refactor: remove public message	2024-04-17 21:25:03 +02:00
Carlos Valente	8af5feb9af	Delete block (#895 )	2024-04-17 21:24:27 +02:00
Carlos Valente	88b45fd952	fix: shutdown from menu (#893 )	2024-04-16 21:21:01 +02:00
jwetzell	a8e9962eed	make application menu aware of what port should be used in link items (#890 )	2024-04-16 21:20:41 +02:00
Carlos Valente	70c93a69fe	Custom add (#889 )	2024-04-14 21:52:12 +02:00
Carlos Valente	0ef1b44d9e	chore: update README	2024-04-14 12:55:03 +02:00
cv	84839824fb	fix: link to managing custom fields	2024-04-14 12:55:03 +02:00
Carlos Valente	b63e3ed8f3	chore: update readme (#888 ) * chore: update readme * docs: funding	2024-04-13 11:30:51 +02:00