Ignore:
Timestamp:
02/07/26 21:16:37 (5 months ago)
Author:
Filip Gavrilovski <filipgavrilovski28@…>
Branches:
main
Children:
799f27d
Parents:
8675f75
Message:

clickable items now take the user to the respective pages; added artist username and album id to dto-s

File:
1 edited

Legend:

Unmodified
Added
Removed

  • frontend/src/components/Sidebar.tsx

    r8675f75 r8ccb07e  
    9797                                                        <div
    9898                                                                key={song.id}
    99                                                                 onClick={() => navigate(`/songs/${song.id}`)}
    10099                                                                className="flex items-center gap-3 p-2 rounded-lg hover:bg-white/5 cursor-pointer transition-colors group relative"
    101100                                                        >
    … …  
    109108                                                                />
    110109                                                                <div className="flex-1 min-w-0">
    111                                                                         <p className="text-sm font-medium text-white truncate">
     110                                                                        <p
     111                                                                                onClick={() => navigate(`/songs/${song.id}`)}
     112                                                                                className="text-sm font-medium text-white truncate hover:underline cursor-pointer"
     113                                                                        >
    112114                                                                                {song.title}
    113115                                                                        </p>
    114                                                                         <p className="text-xs text-gray-400 truncate">
    115                                                                                 {song.artist}
    116                                                                         </p>
     116                                                                        <div className="flex items-center gap-1 text-xs text-gray-400">
     117                                                                                <span
     118                                                                                        onClick={(e) => {
     119                                                                                                e.stopPropagation();
     120                                                                                                if (song.artistUsername) {
     121                                                                                                        navigate(`/users/${song.artistUsername}`);
     122                                                                                                }
     123                                                                                        }}
     124                                                                                        className={`truncate ${
     125                                                                                                song.artistUsername
     126                                                                                                        ? "hover:underline cursor-pointer hover:text-white"
     127                                                                                                        : ""
     128                                                                                        }`}
     129                                                                                >
     130                                                                                        {song.artist}
     131                                                                                </span>
     132                                                                                {song.album && (
     133                                                                                        <>
     134                                                                                                <span>•</span>
     135                                                                                                <span
     136                                                                                                        onClick={(e) => {
     137                                                                                                                e.stopPropagation();
     138                                                                                                                if (song.albumId) {
     139                                                                                                                        navigate(`/collection/album/${song.albumId}`);
     140                                                                                                                }
     141                                                                                                        }}
     142                                                                                                        className={`truncate ${
     143                                                                                                                song.albumId
     144                                                                                                                        ? "hover:underline cursor-pointer hover:text-white"
     145                                                                                                                        : ""
     146                                                                                                        }`}
     147                                                                                                >
     148                                                                                                        {song.album}
     149                                                                                                </span>
     150                                                                                        </>
     151                                                                                )}
     152                                                                        </div>
    117153                                                                </div>
    118154                                                                {song.link && (
Note: See TracChangeset for help on using the changeset viewer.