1 files changed, 150 insertions, 150 deletions

diff --git a/apps/web/src/constants/actions.ts b/apps/web/src/constants/actions.ts
index 644bb0ec..5f1883f1 100644
--- a/apps/web/src/constants/actions.ts
+++ b/apps/web/src/constants/actions.ts
@@ -3,49 +3,49 @@
  */
 
 import {
-	useEffect,
-	useRef,
-	useState,
-	useCallback,
-	MutableRefObject,
+  useEffect,
+  useRef,
+  useState,
+  useCallback,
+  MutableRefObject,
 } from "react";
 
 // Simple event emitter for action changes
 class ActionEmitter {
-	private listeners: Array<(actions: Action[]) => void> = [];
+  private listeners: Array<(actions: Action[]) => void> = [];
 
-	subscribe(listener: (actions: Action[]) => void) {
-		this.listeners.push(listener);
-		return () => {
-			this.listeners = this.listeners.filter((l) => l !== listener);
-		};
-	}
+  subscribe(listener: (actions: Action[]) => void) {
+    this.listeners.push(listener);
+    return () => {
+      this.listeners = this.listeners.filter((l) => l !== listener);
+    };
+  }
 
-	emit(actions: Action[]) {
-		this.listeners.forEach((listener) => listener(actions));
-	}
+  emit(actions: Action[]) {
+    this.listeners.forEach((listener) => listener(actions));
+  }
 }
 
 const actionEmitter = new ActionEmitter();
 
 export type Action =
-	| "toggle-play" // Toggle play/pause state
-	| "stop-playback" // Stop playback
-	| "seek-forward" // Seek forward in playback
-	| "seek-backward" // Seek backward in playback
-	| "frame-step-forward" // Step forward by one frame
-	| "frame-step-backward" // Step backward by one frame
-	| "jump-forward" // Jump forward by 5 seconds
-	| "jump-backward" // Jump backward by 5 seconds
-	| "goto-start" // Go to timeline start
-	| "goto-end" // Go to timeline end
-	| "split-element" // Split element at current time
-	| "delete-selected" // Delete selected elements
-	| "select-all" // Select all elements
-	| "duplicate-selected" // Duplicate selected element
-	| "toggle-snapping" // Toggle snapping
-	| "undo" // Undo last action
-	| "redo"; // Redo last undone action
+  | "toggle-play" // Toggle play/pause state
+  | "stop-playback" // Stop playback
+  | "seek-forward" // Seek forward in playback
+  | "seek-backward" // Seek backward in playback
+  | "frame-step-forward" // Step forward by one frame
+  | "frame-step-backward" // Step backward by one frame
+  | "jump-forward" // Jump forward by 5 seconds
+  | "jump-backward" // Jump backward by 5 seconds
+  | "goto-start" // Go to timeline start
+  | "goto-end" // Go to timeline end
+  | "split-element" // Split element at current time
+  | "delete-selected" // Delete selected elements
+  | "select-all" // Select all elements
+  | "duplicate-selected" // Duplicate selected element
+  | "toggle-snapping" // Toggle snapping
+  | "undo" // Undo last action
+  | "redo"; // Redo last undone action
 
 /**
  * Defines the arguments, if present for a given type that is required to be passed on
@@ -59,14 +59,14 @@ export type Action =
  * will know if you got something wrong if there is a type error in this file
  */
 type ActionArgsMap = {
-	"seek-forward": { seconds: number } | undefined; // Args needed for seeking forward (default: 1)
-	"seek-backward": { seconds: number } | undefined; // Args needed for seeking backward (default: 1)
-	"jump-forward": { seconds: number } | undefined; // Args needed for jumping forward (default: 5)
-	"jump-backward": { seconds: number } | undefined; // Args needed for jumping backward (default: 5)
+  "seek-forward": { seconds: number } | undefined; // Args needed for seeking forward (default: 1)
+  "seek-backward": { seconds: number } | undefined; // Args needed for seeking backward (default: 1)
+  "jump-forward": { seconds: number } | undefined; // Args needed for jumping forward (default: 5)
+  "jump-backward": { seconds: number } | undefined; // Args needed for jumping backward (default: 5)
 };
 
 type KeysWithValueUndefined<T> = {
-	[K in keyof T]: undefined extends T[K] ? K : never;
+  [K in keyof T]: undefined extends T[K] ? K : never;
 }[keyof T];
 
 /**
@@ -79,8 +79,8 @@ export type ActionWithArgs = keyof ActionArgsMap;
  */
 
 export type ActionWithOptionalArgs =
-	| ActionWithNoArgs
-	| KeysWithValueUndefined<ActionArgsMap>;
+  | ActionWithNoArgs
+  | KeysWithValueUndefined<ActionArgsMap>;
 
 /**
  * Actions which do not require arguments for their invocation
@@ -91,18 +91,18 @@ export type ActionWithNoArgs = Exclude<Action, ActionWithArgs>;
  * Resolves the argument type for a given Action
  */
 type ArgOfHoppAction<A extends Action> = A extends ActionWithArgs
-	? ActionArgsMap[A]
-	: undefined;
+  ? ActionArgsMap[A]
+  : undefined;
 
 /**
  * Resolves the action function for a given Action, used by action handler function defs
  */
 type ActionFunc<A extends Action> = A extends ActionWithArgs
-	? (arg: ArgOfHoppAction<A>, trigger?: InvocationTriggers) => void
-	: (_?: undefined, trigger?: InvocationTriggers) => void;
+  ? (arg: ArgOfHoppAction<A>, trigger?: InvocationTriggers) => void
+  : (_?: undefined, trigger?: InvocationTriggers) => void;
 
 type BoundActionList = {
-	[A in Action]?: Array<ActionFunc<A>>;
+  [A in Action]?: Array<ActionFunc<A>>;
 };
 
 const boundActions: BoundActionList = {};
@@ -110,34 +110,34 @@ const boundActions: BoundActionList = {};
 let currentActiveActions: Action[] = [];
 
 function updateActiveActions() {
-	const newActions = Object.keys(boundActions) as Action[];
-	currentActiveActions = newActions;
-	actionEmitter.emit(newActions);
+  const newActions = Object.keys(boundActions) as Action[];
+  currentActiveActions = newActions;
+  actionEmitter.emit(newActions);
 }
 
 export function bindAction<A extends Action>(
-	action: A,
-	handler: ActionFunc<A>,
+  action: A,
+  handler: ActionFunc<A>
 ) {
-	if (boundActions[action]) {
-		boundActions[action]?.push(handler);
-	} else {
-		// 'any' assertion because TypeScript doesn't seem to be able to figure out the links.
-		boundActions[action] = [handler] as any;
-	}
+  if (boundActions[action]) {
+    boundActions[action]?.push(handler);
+  } else {
+    // 'any' assertion because TypeScript doesn't seem to be able to figure out the links.
+    boundActions[action] = [handler] as any;
+  }
 
-	updateActiveActions();
+  updateActiveActions();
 }
 
 export type InvocationTriggers = "keypress" | "mouseclick";
 
 type InvokeActionFunc = {
-	(
-		action: ActionWithOptionalArgs,
-		args?: undefined,
-		trigger?: InvocationTriggers,
-	): void;
-	<A extends ActionWithArgs>(action: A, args: ActionArgsMap[A]): void;
+  (
+    action: ActionWithOptionalArgs,
+    args?: undefined,
+    trigger?: InvocationTriggers
+  ): void;
+  <A extends ActionWithArgs>(action: A, args: ActionArgsMap[A]): void;
 };
 
 /**
@@ -148,27 +148,27 @@ type InvokeActionFunc = {
  * @param trigger Optionally supply the trigger that invoked the action (keypress/mouseclick)
  */
 export const invokeAction: InvokeActionFunc = <A extends Action>(
-	action: A,
-	args?: ArgOfHoppAction<A>,
-	trigger?: InvocationTriggers,
+  action: A,
+  args?: ArgOfHoppAction<A>,
+  trigger?: InvocationTriggers
 ) => {
-	boundActions[action]?.forEach((handler) => (handler as any)(args, trigger));
+  boundActions[action]?.forEach((handler) => (handler as any)(args, trigger));
 };
 
 export function unbindAction<A extends Action>(
-	action: A,
-	handler: ActionFunc<A>,
+  action: A,
+  handler: ActionFunc<A>
 ) {
-	// 'any' assertion because TypeScript doesn't seem to be able to figure out the links.
-	boundActions[action] = boundActions[action]?.filter(
-		(x) => x !== handler,
-	) as any;
+  // 'any' assertion because TypeScript doesn't seem to be able to figure out the links.
+  boundActions[action] = boundActions[action]?.filter(
+    (x) => x !== handler
+  ) as any;
 
-	if (boundActions[action]?.length === 0) {
-		delete boundActions[action];
-	}
+  if (boundActions[action]?.length === 0) {
+    delete boundActions[action];
+  }
 
-	updateActiveActions();
+  updateActiveActions();
 }
 
 /**
@@ -177,7 +177,7 @@ export function unbindAction<A extends Action>(
  * @param action The action to check
  */
 export function isActionBound(action: Action): boolean {
-	return !!boundActions[action];
+  return !!boundActions[action];
 }
 
 /**
@@ -189,65 +189,65 @@ export function isActionBound(action: Action): boolean {
  * @param isActive A ref that indicates whether the action is active
  */
 export function useActionHandler<A extends Action>(
-	action: A,
-	handler: ActionFunc<A>,
-	isActive: MutableRefObject<boolean> | boolean | undefined = undefined,
+  action: A,
+  handler: ActionFunc<A>,
+  isActive: MutableRefObject<boolean> | boolean | undefined = undefined
 ) {
-	const handlerRef = useRef(handler);
-	const [isBound, setIsBound] = useState(false);
+  const handlerRef = useRef(handler);
+  const [isBound, setIsBound] = useState(false);
 
-	// Update handler ref when handler changes
-	useEffect(() => {
-		handlerRef.current = handler;
-	}, [handler]);
+  // Update handler ref when handler changes
+  useEffect(() => {
+    handlerRef.current = handler;
+  }, [handler]);
 
-	// Create a stable handler wrapper
-	const stableHandler = useCallback(
-		(args: any, trigger?: InvocationTriggers) => {
-			(handlerRef.current as any)(args, trigger);
-		},
-		[],
-	) as ActionFunc<A>;
+  // Create a stable handler wrapper
+  const stableHandler = useCallback(
+    (args: any, trigger?: InvocationTriggers) => {
+      (handlerRef.current as any)(args, trigger);
+    },
+    []
+  ) as ActionFunc<A>;
 
-	useEffect(() => {
-		const shouldBind =
-			isActive === undefined ||
-			(typeof isActive === "boolean" ? isActive : isActive.current);
+  useEffect(() => {
+    const shouldBind =
+      isActive === undefined ||
+      (typeof isActive === "boolean" ? isActive : isActive.current);
 
-		if (shouldBind && !isBound) {
-			bindAction(action, stableHandler);
-			setIsBound(true);
-		} else if (!shouldBind && isBound) {
-			unbindAction(action, stableHandler);
-			setIsBound(false);
-		}
+    if (shouldBind && !isBound) {
+      bindAction(action, stableHandler);
+      setIsBound(true);
+    } else if (!shouldBind && isBound) {
+      unbindAction(action, stableHandler);
+      setIsBound(false);
+    }
 
-		return () => {
-			if (isBound) {
-				unbindAction(action, stableHandler);
-				setIsBound(false);
-			}
-		};
-	}, [action, stableHandler, isActive, isBound]);
+    return () => {
+      if (isBound) {
+        unbindAction(action, stableHandler);
+        setIsBound(false);
+      }
+    };
+  }, [action, stableHandler, isActive, isBound]);
 
-	// Handle ref-based isActive changes
-	useEffect(() => {
-		if (isActive && typeof isActive === "object" && "current" in isActive) {
-			// Poll for ref changes
-			const interval = setInterval(() => {
-				const shouldBind = isActive.current;
-				if (shouldBind !== isBound) {
-					if (shouldBind) {
-						bindAction(action, stableHandler);
-					} else {
-						unbindAction(action, stableHandler);
-					}
-					setIsBound(shouldBind);
-				}
-			}, 100);
-			return () => clearInterval(interval);
-		}
-	}, [action, stableHandler, isActive, isBound]);
+  // Handle ref-based isActive changes
+  useEffect(() => {
+    if (isActive && typeof isActive === "object" && "current" in isActive) {
+      // Poll for ref changes
+      const interval = setInterval(() => {
+        const shouldBind = isActive.current;
+        if (shouldBind !== isBound) {
+          if (shouldBind) {
+            bindAction(action, stableHandler);
+          } else {
+            unbindAction(action, stableHandler);
+          }
+          setIsBound(shouldBind);
+        }
+      }, 100);
+      return () => clearInterval(interval);
+    }
+  }, [action, stableHandler, isActive, isBound]);
 }
 
 /**
@@ -255,18 +255,18 @@ export function useActionHandler<A extends Action>(
  * and re-renders when the list changes
  */
 export function useActiveActions(): Action[] {
-	const [activeActions, setActiveActions] = useState<Action[]>([]);
+  const [activeActions, setActiveActions] = useState<Action[]>([]);
 
-	useEffect(() => {
-		// Set initial value
-		setActiveActions(currentActiveActions);
+  useEffect(() => {
+    // Set initial value
+    setActiveActions(currentActiveActions);
 
-		// Subscribe to changes
-		const unsubscribe = actionEmitter.subscribe(setActiveActions);
-		return unsubscribe;
-	}, []);
+    // Subscribe to changes
+    const unsubscribe = actionEmitter.subscribe(setActiveActions);
+    return unsubscribe;
+  }, []);
 
-	return activeActions;
+  return activeActions;
 }
 
 /**
@@ -274,20 +274,20 @@ export function useActiveActions(): Action[] {
  * and re-renders when the binding state changes
  */
 export function useIsActionBound(action: Action): boolean {
-	const [isBound, setIsBound] = useState(() => isActionBound(action));
+  const [isBound, setIsBound] = useState(() => isActionBound(action));
 
-	useEffect(() => {
-		const updateBoundState = () => {
-			setIsBound(isActionBound(action));
-		};
+  useEffect(() => {
+    const updateBoundState = () => {
+      setIsBound(isActionBound(action));
+    };
 
-		// Set initial value
-		updateBoundState();
+    // Set initial value
+    updateBoundState();
 
-		// Subscribe to changes
-		const unsubscribe = actionEmitter.subscribe(updateBoundState);
-		return unsubscribe;
-	}, [action]);
+    // Subscribe to changes
+    const unsubscribe = actionEmitter.subscribe(updateBoundState);
+    return unsubscribe;
+  }, [action]);
 
-	return isBound;
+  return isBound;
 }