modularity

src/components/EngineControls.tsx

@@ -1,4 +1,5 @@
-import { ENGINE_CONTROLS, SAMPLE_RATES, getComplexityLabel } from '../config/effects'
+import { ENGINE_CONTROLS } from '../config/effects'
+import { getComplexityLabel, getBitDepthLabel, getSampleRateLabel } from '../utils/formatters'
 import type { EffectValues } from '../types/effects'
 
 interface EngineControlsProps {
@@ -10,9 +11,11 @@ export function EngineControls({ values, onChange }: EngineControlsProps) {
   const formatValue = (id: string, value: number): string => {
     switch (id) {
       case 'sampleRate':
-        return `${SAMPLE_RATES[value]}Hz`
+        return getSampleRateLabel(value)
       case 'complexity':
         return getComplexityLabel(value)
+      case 'bitDepth':
+        return getBitDepthLabel(value)
       default:
         const param = ENGINE_CONTROLS[0].parameters.find(p => p.id === id)
         return `${value}${param?.unit || ''}`