fix: render instrument description in tooltip instead of object

Error: "Objects are not valid as a React child (found: object with keys
{id, description, created_at, updated_at, popularity})"

Root cause:
- JKSessionMyTrack.js line 191 was rendering {track?.instrument} directly
- track.instrument is an object, not a string
- React cannot render objects as children - they must be primitives

This error appeared when JamTrack stems were displayed on the session
screen after selecting a JamTrack. The stems use JKSessionMyTrack
components which have instrument tooltips.

Solution:
Changed tooltip content from:
  {track?.instrument}
To:
  {track?.instrument?.description || track?.instrument?.name || 'Unknown Instrument'}

This extracts the description string from the instrument object, with
fallbacks to name or a default string.

Fixes crash when hovering over JamTrack stem instruments.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Nuwan 2026-01-15 14:32:28 +05:30
parent d9139ebcbd
commit 5fd80ae007
1 changed files with 1 additions and 1 deletions

View File

@ -188,7 +188,7 @@ const JKSessionMyTrack = ({
target={`instrument-tooltip-${clientId}-${track?.client_track_id || 'chat'}`}
trigger="hover click"
>
{track?.instrument}
{track?.instrument?.description || track?.instrument?.name || 'Unknown Instrument'}
</UncontrolledTooltip>
)}
<div className="track-controls">