FEAT: thêm tính năng midi key khác sử dụng cho midi note

app/static/js/app.jsx

@@ -7778,8 +7778,10 @@ const App = () => {
   const [audioDevices, setAudioDevices] = useState([]);
   const [midiDevices, setMidiDevices] = useState([]);
   const [selectedMidiInputId, setSelectedMidiInputId] = useState('');
+  const selectedMidiInputIdRef = useRef('');
   const handleMidiInputSelect = (id) => {
     setSelectedMidiInputId(id);
+    selectedMidiInputIdRef.current = id;
     if (window.SonicRecorderManager) {
       window.SonicRecorderManager.setSelectedMidiInputId(id);
     }
@@ -7794,9 +7796,13 @@ const App = () => {
     if (navigator.requestMIDIAccess) {
       navigator.requestMIDIAccess().then(access => {
         const inputs = [];
-        for (let input of access.inputs.values()) {
-          inputs.push(input);
+
+        function attachMidiHandler(input) {
           input.onmidimessage = msg => {
+            // Filter by selected MIDI input device
+            const selId = selectedMidiInputIdRef.current;
+            if (selId && selId !== 'ALL' && input.id !== selId) return;
+
             console.log(`[DevLog] [Raw MIDI] Received from "${input.name}" (ID: ${input.id}) - Data:`, Array.from(msg.data));
             if (msg.data.length < 3) return;
                const cmd = msg.data[0] >> 4;
@@ -7902,11 +7908,20 @@ const App = () => {
             }
           };
         }
+
+        for (let input of access.inputs.values()) {
+          inputs.push(input);
+          attachMidiHandler(input);
+        }
         setMidiDevices(inputs);
         access.onstatechange = () => {
           const inputs = [];
           for (let input of access.inputs.values()) {
             inputs.push(input);
+            // Re-attach handler to ensure new devices get it
+            if (!input.onmidimessage) {
+              attachMidiHandler(input);
+            }
           }
           setMidiDevices(inputs);
         };