feat: add recall preset

src/pages/DspPage/DspPage.tsx

@@ -8,6 +8,7 @@ import { NotificationType } from '../../types/types';
 import './DspPage.css';
 import GateSection from '../../components/dsp408/GateSection/GateSection';
 import { invoke } from '@tauri-apps/api/core';
+import LoadingOverlay from '../../components/LoadingOverlay/LoadingOverlay';
 
 function DSPPage({
   dsp,
@@ -22,7 +23,8 @@ function DSPPage({
 }) {
   const [activeSidebar, setActiveSidebar] = useState('overview');
   const [sidebarExpanded, setSidebarExpanded] = useState(false);
-
+  const [selectedPreset, setSelectedPreset] = useState(dsp.state?.presets.current_index ?? 0);
+  const [presetLoading, setPresetLoading] = useState(false);
   const sidebarItems = [
     {
       id: 'overview',
@@ -130,21 +132,27 @@ function DSPPage({
       icon: <KnobGainIcon />,
     },
   ];
-
-  const presets = dsp.state?.presets.names?.map((name, index) => ({
-    id: index === 0 ? 'f00' : `u${String(index).padStart(2, '0')}`,
-    name,
-  })) ?? [
-    {
-      id: 'f00',
-      name: 'Factory Preset',
-    },
-    ...Array.from({ length: 20 }, (_, index) => ({
-      id: `u${String(index + 1).padStart(2, '0')}`,
-      name: 'Default Preset',
-    })),
-  ];
-  const selectedPreset = dsp.state?.presets.current_index ?? 0;
+  const presets = dsp.state?.presets.names
+    ? [
+        {
+          id: 'f00',
+          name: 'Factory Preset',
+        },
+        ...dsp.state.presets.names.map((name, index) => ({
+          id: `u${String(index + 1).padStart(2, '0')}`,
+          name,
+        })),
+      ]
+    : [
+        {
+          id: 'f00',
+          name: 'Factory Preset',
+        },
+        ...Array.from({ length: 20 }, (_, index) => ({
+          id: `u${String(index + 1).padStart(2, '0')}`,
+          name: 'Default Preset',
+        })),
+      ];
 
   const recallPreset = async (presetIndex: number) => {
     try {
@@ -166,6 +174,38 @@ function DSPPage({
     }
   };
 
+  const setCurrentPresetName = async (name: string) => {
+    try {
+      const success = await invoke<boolean>('set_current_preset_name', {
+        id: dsp.id,
+        name,
+      });
+
+      if (success) {
+        notify(`Preset renamed`, 'success', dsp.name);
+      } else {
+        notify('Failed to rename preset', 'error', dsp.name);
+      }
+
+      return success;
+    } catch (err) {
+      notify(`Preset rename failed: ${String(err)}`, 'error', dsp.name);
+      return false;
+    }
+  };
+
+  const onAppChange = async (id: string) => {
+    const presetIndex = presets.findIndex((preset) => preset.id === id);
+    if (presetIndex === -1) return;
+
+    setPresetLoading(true);
+    const success = await recallPreset(presetIndex);
+    if (success) {
+      setSelectedPreset(presetIndex);
+    }
+    setPresetLoading(false);
+  };
+
   const renderTab = () => {
     switch (activeSidebar) {
       case 'overview':
@@ -191,18 +231,19 @@ function DSPPage({
         appName={dsp.name}
         appOptions={presets}
         selectedAppId={presets[selectedPreset]?.id}
-        onAppChange={(id) => {
-          const presetIndex = presets.findIndex((preset) => preset.id === id);
-
-          if (presetIndex !== -1) {
-            recallPreset(presetIndex);
-          }
-        }}
+        onAppChange={onAppChange}
+        onAppRename={setCurrentPresetName}
         expanded={sidebarExpanded}
         onToggle={() => setSidebarExpanded((v) => !v)}
       />
 
-      <div className="dsp-content">{renderTab()}</div>
+      <LoadingOverlay
+        active={presetLoading}
+        label="Recalling preset…"
+        overlayClassName="dsp-loading-overlay"
+      >
+        <div className="dsp-content">{renderTab()}</div>
+      </LoadingOverlay>
     </div>
   );
 }