From 4dea95e855ebd485b2ab5e24b8a483d72e1e67c7 Mon Sep 17 00:00:00 2001
From: Nuwan <nuwanchaturanga@gmail.com>
Date: Thu, 5 Mar 2026 18:38:32 +0530
Subject: [PATCH] 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 | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/jam-ui/src/components/client/JKSessionAudioInputs.js b/jam-ui/src/components/client/JKSessionAudioInputs.js
index 16a722f6e..939f93cf7 100644
--- a/jam-ui/src/components/client/JKSessionAudioInputs.js
+++ b/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;