refactor(30-01): wrap JKSessionAudioInputs with React.memo

- Add memo to React import
- Wrap component with memo(function JKSessionAudioInputs)
- Add displayName for React DevTools
- Prevents unnecessary re-renders when parent re-renders with same props

jam-ui/src/components/client/JKSessionAudioInputs.js

@@ -1,8 +1,8 @@
-import React from 'react';
+import React, { memo } from 'react';
 import JKSessionMyTrack from './JKSessionMyTrack.js';
 import { getInstrumentIcon45, convertClientInstrumentToServer } from '../../helpers/utils';
 
-const JKSessionAudioInputs = ({ myTracks, chat, mixerHelper, isRemote = false, mixType = 'default' }) => {
+const JKSessionAudioInputs = memo(function JKSessionAudioInputs({ myTracks, chat, mixerHelper, isRemote = false, mixType = 'default' }) {
   return (
     <div className='d-flex' style={{ gap: '0.5rem' }}>
       <div>
@@ -58,6 +58,8 @@ const JKSessionAudioInputs = ({ myTracks, chat, mixerHelper, isRemote = false, m
       </div>
     </div>
   );
-};
+});
+
+JKSessionAudioInputs.displayName = 'JKSessionAudioInputs';
 
 export default JKSessionAudioInputs;