refactor: add Seconds and Gain Type aliases, replace enum with const,…

package.json

@@ -10,7 +10,9 @@
     "lint:fix": "eslint . --fix",
     "format": "prettier --write \"src/**/*.{ts,tsx,json,css}\"",
     "format:check": "prettier --check \"src/**/*.{ts,tsx,json,css}\"",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "check": "npm run lint && npm run format:check && npm run build",
+    "fix": "npm run lint:fix && npm run format && npm run build"
   },
   "dependencies": {
     "react": "^19.2.0",

src/App.css

@@ -38,13 +38,13 @@
   box-sizing: border-box;
 }
 
-.library-tabs{
+.library-tabs {
   display: flex;
   width: 100%;
   border-bottom: 1px solid var(--border-color);
 }
 
-.library-tab{
+.library-tab {
   flex: 1;
   padding: var(--space-3) 0;
   font-size: var(--fs-base);

src/components/MusicLibrary.tsx

@@ -1,9 +1,9 @@
-import { useState } from 'react'
+import { useState } from 'react';
 
-type Tab = 'music' | 'sfx'
+type Tab = 'music' | 'sfx';
 
 export default function MusicLibrary() {
-  const [activeTab, setActiveTab] = useState<Tab>('music')
+  const [activeTab, setActiveTab] = useState<Tab>('music');
 
   return (
     <div className="music-library">

src/components/NowPlaying.tsx

@@ -51,11 +51,7 @@ export default function NowPlaying() {
       <div className="np-content">
         {/* Album Cover */}
         <div className="np-album-cover-wrapper">
-          <img 
-            src={mockSong.coverUrl} 
-            alt={`${mockSong.album} cover`}
-            className="np-album-cover"
-          />
+          <img src={mockSong.coverUrl} alt={`${mockSong.album} cover`} className="np-album-cover" />
         </div>
 
         {/* Main Section */}
@@ -91,14 +87,14 @@ export default function NowPlaying() {
 
           {/* Controls */}
           <div className="np-controls">
-            <button 
+            <button
               className={`np-btn np-play-btn ${isPlaying ? 'active' : ''}`}
               onClick={handlePlay}
               title="Play"
             >
               ▶ Play
             </button>
-            <button 
+            <button
               className={`np-btn np-pause-btn ${!isPlaying ? 'active' : ''}`}
               onClick={handlePause}
               title="Pause"

types/AudioEvent.ts

@@ -1,13 +1,13 @@
 import type { Fade } from "./Fade";
-import type { ID } from "./UtilTypes";
+import type { ID, Seconds } from "./UtilTypes";
 
 export interface AudioEvent {
     id: ID;
     clipId: ID;
     trackId: ID;
     buffer: AudioBuffer;
-    startAbsTime: number;
-    offsetIntoBuffer: number;
-    duration: number;
+    startAbsTime: Seconds;
+    offsetIntoBuffer: Seconds;
+    duration: Seconds;
     fades: Fade[];
 }

types/Clip.ts

@@ -1,12 +1,12 @@
 import type { Fade } from "./Fade";
-import type { ID } from "./UtilTypes";
+import type { ID, Seconds } from "./UtilTypes";
 
 export interface Clip {
     id: ID;
     bufferID: ID;
-    startTime: number;
-    duration: number;
-    offset: number; // offset from start of project
+    startTime: Seconds;
+    duration: Seconds;
+    offset: Seconds; // offset from start of project
     fades: Fade[];
     title: string;
 }

types/Fade.ts

@@ -1,9 +1,16 @@
-export type FadeType = 'LINEAR' | 'EXPONENTIAL';
+import type {Seconds, Gain} from "./UtilTypes"
+
+export const FadeType = {
+    LINEAR: 0,
+    EXPONENTIAL: 1,
+} as const;
+
+export type FadeType = (typeof FadeType)[keyof typeof FadeType];
 
 export interface Fade {
     type: FadeType;
-    startOffset: number;
-    endOffset: number;
-    startGain: number;
-    endGain: number;
+    startOffset: Seconds;
+    endOffset: Seconds;
+    startGain: Gain;
+    endGain: Gain;
 }

types/Track.ts

@@ -1,10 +1,10 @@
-import type { ID } from "./UtilTypes";
+import type { ID, Seconds, Gain } from "./UtilTypes";
 import type { Clip } from "./Clip"
 
 export interface Track {
     id: ID;
     clips: Clip[];
-    gain: number;
+    gain: Gain;
     muted: boolean;
-    getEventsBetween(windowStart: number, windowEnd: number): number[];
+    getEventsBetween(windowStart: Seconds, windowEnd: Seconds): Seconds[];
 }

types/UtilTypes.ts

@@ -1 +1,3 @@
-export type ID = string;
+export type ID = string;
+export type Seconds = number;
+export type Gain = number;