From c8a8ecc40d152f8bd8be1666208393b7893afa03 Mon Sep 17 00:00:00 2001
From: Nuwan <nuwanchaturanga@gmail.com>
Date: Tue, 29 Oct 2024 09:22:55 +0530
Subject: [PATCH] fix minor css issue in instrument list

---
 jam-ui/cypress/e2e/friends/friends-page.cy.js             | 2 +-
 jam-ui/src/components/profile/JKProfileInstrumentsList.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/jam-ui/cypress/e2e/friends/friends-page.cy.js b/jam-ui/cypress/e2e/friends/friends-page.cy.js
index ca9307aa9..0a6694b95 100644
--- a/jam-ui/cypress/e2e/friends/friends-page.cy.js
+++ b/jam-ui/cypress/e2e/friends/friends-page.cy.js
@@ -146,7 +146,7 @@ describe('Friends page with data', () => {
         closeSidePanel();
       });
 
-      it('click more button', () => {
+      it.only('click more button', () => {
         //open side panel by clicking more button
         cy.get('[data-testid=peopleListTable] > tbody tr')
           .first()
diff --git a/jam-ui/src/components/profile/JKProfileInstrumentsList.js b/jam-ui/src/components/profile/JKProfileInstrumentsList.js
index 2f871cc17..850df34ed 100644
--- a/jam-ui/src/components/profile/JKProfileInstrumentsList.js
+++ b/jam-ui/src/components/profile/JKProfileInstrumentsList.js
@@ -24,7 +24,7 @@ const JKPersonInstrumentsList = ({ instruments, showIcons, showAll, toggleMoreDe
     <div data-testid="instrumentList" className='d-flex flex-column'>
       {instrumentsToShow &&
         instrumentsToShow.map(instrument => (
-          <div key={instrument.instrument_id} className="mb-1 d-flex" data-testid="instrument">
+          <div key={instrument.instrument_id} className="mb-1 d-flex text-nowrap" data-testid="instrument">
             <div className="mr-1" style={{ flexGrow: 1, flexBasis: '10%'}}>
               <JKInstrumentIcon instrumentId={instrument.instrument_id} instrumentName={instrument.description} />
             </div>