From d9004980e6a8dfc4fd164d1bf9aa5422d207c788 Mon Sep 17 00:00:00 2001
From: Nuwan <nuwanchaturanga@gmail.com>
Date: Sat, 7 Dec 2024 09:19:23 +0530
Subject: [PATCH] fix presentation styles of jamtracks in jamtracks list page

---
 .../components/jamtracks/JKJamTrackPreview.js |  4 +--
 .../jamtracks/JKJamTracksAutoComplete.js      | 25 ++++---------------
 2 files changed, 7 insertions(+), 22 deletions(-)

diff --git a/jam-ui/src/components/jamtracks/JKJamTrackPreview.js b/jam-ui/src/components/jamtracks/JKJamTrackPreview.js
index 3d225d36b..e432081db 100644
--- a/jam-ui/src/components/jamtracks/JKJamTrackPreview.js
+++ b/jam-ui/src/components/jamtracks/JKJamTrackPreview.js
@@ -19,8 +19,8 @@ const JKJamTrackPreview = ({ jamTrack }) => {
             <Col className={ index + 1 > 6 && !expanded ? 'd-none' : null}>
               <JKJamTrackTrack track={track} />
             </Col>
-            {(index + 1) % 3 === 0 && <div className="w-100" />}
-            {(index + 1) === jamTrack.tracks.length && (index + 1) % 3 !== 0 && <div className="col" />}
+            {(index + 1) % 2 === 0 && <div className="w-100" />}
+            {(index + 1) === jamTrack.tracks.length && (index + 1) % 2 !== 0 && <div className="col" />}
           </Fragment>
         ))}
       </Row>
diff --git a/jam-ui/src/components/jamtracks/JKJamTracksAutoComplete.js b/jam-ui/src/components/jamtracks/JKJamTracksAutoComplete.js
index e79998002..4385e9f58 100644
--- a/jam-ui/src/components/jamtracks/JKJamTracksAutoComplete.js
+++ b/jam-ui/src/components/jamtracks/JKJamTracksAutoComplete.js
@@ -46,7 +46,7 @@ const JKJamTracksAutoComplete = ({
           });
           setArtists(updatedArtists);
         }
-        if(data.jamtracks){
+        if (data.jamtracks) {
           const updatedSongs = data.jamtracks.map(song => {
             song.type = 'song';
             return song;
@@ -132,15 +132,9 @@ const JKJamTracksAutoComplete = ({
                 onMouseOver={highlight}
                 onMouseOut={unhighlight}
                 onClick={() => handleOnClick(track)}
+                style={{ cursor: 'pointer' }}
               >
-                <div
-                  style={{
-                    display: 'flex',
-                    alignContent: 'flex-start'
-                  }}
-                >
-                  <div>Artist: {track.original_artist}</div>
-                </div>
+                Artist: {track.original_artist}
               </ListGroupItem>
             ))}
             {songs.map(track => (
@@ -149,18 +143,9 @@ const JKJamTracksAutoComplete = ({
                 onMouseOver={highlight}
                 onMouseOut={unhighlight}
                 onClick={() => handleOnClick(track)}
+                style={{ cursor: 'pointer' }}
               >
-                <div
-                  style={{
-                    display: 'flex',
-                    justifyContent: 'flex-start',
-                    columnGap: '10px',
-                    alignContent: 'flex-start'
-                  }}
-                >
-                  <div style={{ width: '50%' }}>Song: {track.name}</div>
-                  <div>{track.original_artist}</div>
-                </div>
+                Song: {track.name} by {track.original_artist}
               </ListGroupItem>
             ))}
           </ListGroup>