feat: add transitions, track mixing, and voiceover controls

1 files changed, 56 insertions, 1 deletions

diff --git a/apps/web/src/voiceover/voiceover-store.ts b/apps/web/src/voiceover/voiceover-store.ts
index 44ccae6c..e4024c1e 100644
--- a/apps/web/src/voiceover/voiceover-store.ts
+++ b/apps/web/src/voiceover/voiceover-store.ts
@@ -6,18 +6,37 @@
  */
 
 import { create } from "zustand";
+import { persist } from "zustand/middleware";
 import type { MediaTime } from "@/wasm";
+import {
+	DEFAULT_VOICE_OVER_ENHANCEMENTS,
+	type VoiceOverEnhancementSettings,
+} from "@/voiceover/enhancements";
 
-export type VoiceOverStatus = "idle" | "recording";
+export type VoiceOverStatus = "idle" | "recording" | "processing";
 
 interface VoiceOverStore {
 	status: VoiceOverStatus;
 	startedAtMs: number | null;
 	playheadStartTime: MediaTime | null;
 	startRecording: ({ playheadTime }: { playheadTime: MediaTime }) => void;
+	processRecording: () => void;
 	stopRecording: () => void;
 }
 
+interface VoiceOverPreferencesStore {
+	selectedDeviceId: string | null;
+	enhancements: VoiceOverEnhancementSettings;
+	setSelectedDeviceId: ({ deviceId }: { deviceId: string | null }) => void;
+	setEnhancementEnabled: ({
+		id,
+		enabled,
+	}: {
+		id: keyof VoiceOverEnhancementSettings;
+		enabled: boolean;
+	}) => void;
+}
+
 export const useVoiceOverStore = create<VoiceOverStore>()((set) => ({
 	status: "idle",
 	startedAtMs: null,
@@ -31,6 +50,13 @@ export const useVoiceOverStore = create<VoiceOverStore>()((set) => ({
 		});
 	},
 
+	processRecording: () => {
+		set({
+			status: "processing",
+			startedAtMs: null,
+		});
+	},
+
 	stopRecording: () => {
 		set({
 			status: "idle",
@@ -39,3 +65,32 @@ export const useVoiceOverStore = create<VoiceOverStore>()((set) => ({
 		});
 	},
 }));
+
+export const useVoiceOverPreferencesStore = create<VoiceOverPreferencesStore>()(
+	persist(
+		(set) => ({
+			selectedDeviceId: null,
+			enhancements: DEFAULT_VOICE_OVER_ENHANCEMENTS,
+
+			setSelectedDeviceId: ({ deviceId }) => {
+				set({ selectedDeviceId: deviceId });
+			},
+
+			setEnhancementEnabled: ({ id, enabled }) => {
+				set((state) => ({
+					enhancements: {
+						...state.enhancements,
+						[id]: enabled,
+					},
+				}));
+			},
+		}),
+		{
+			name: "voiceover-preferences-store",
+			partialize: (state) => ({
+				selectedDeviceId: state.selectedDeviceId,
+				enhancements: state.enhancements,
+			}),
+		},
+	),
+);