Ignore:
Timestamp:
02/18/26 22:33:00 (5 months ago)
Author:
Dimitar Arsov <dimitararsov04@…>
Branches:
main
Children:
ed8f998
Parents:
d1ee039
Message:

hide actions from unauthenticated users

File:
1 edited

Legend:

Unmodified
Added
Removed

  • frontend/src/pages/LandingPage.tsx

    rd1ee039 r615dcee  
    1414} from "../utils/types";
    1515import { toEmbedUrl } from "../utils/utils";
     16import { useAuth } from "../context/authContext";
    1617
    1718const CATEGORIES: { value: SearchCategory; label: string }[] = [
    … …  
    2526  const navigate = useNavigate();
    2627  const { play, currentSong } = usePlayer();
     28  const { user } = useAuth();
    2729  const [songs, setSongs] = useState<Song[]>([]);
    2830  const [loading, setLoading] = useState<boolean>(true);
    2931
    30   // search state
    3132  const [searchInput, setSearchInput] = useState("");
    3233  const [activeQuery, setActiveQuery] = useState("");
    … …  
    3637  const [hasSearched, setHasSearched] = useState(false);
    3738
    38   // playlist dropdown state
    3939  const [openPlaylistDropdown, setOpenPlaylistDropdown] = useState<
    4040    number | null
    … …  
    415415                            {song.releasedBy}
    416416                          </p>
    417                           <div className="flex items-center justify-between mt-4 pt-3 border-t border-white/10">
    418                             {/* Like button */}
    419                             <button
    420                               onClick={(e) => {
    421                                 e.stopPropagation();
    422                                 toggleLike(song.id);
    423                               }}
    424                               className="text-gray-400 hover:text-[#1db954] transition-colors cursor-pointer"
    425                               aria-label={
    426                                 song.isLikedByCurrentUser
    427                                   ? "Unlike song"
    428                                   : "Like song"
    429                               }
    430                             >
    431                               {song.isLikedByCurrentUser ? (
    432                                 <svg
    433                                   className="w-6 h-6 fill-[#1db954]"
    434                                   viewBox="0 0 24 24"
    435                                 >
    436                                   <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" />
    437                                 </svg>
    438                               ) : (
    439                                 <svg
    440                                   className="w-6 h-6"
    441                                   fill="none"
    442                                   stroke="currentColor"
    443                                   viewBox="0 0 24 24"
    444                                 >
    445                                   <path
    446                                     strokeLinecap="round"
    447                                     strokeLinejoin="round"
    448                                     strokeWidth={2}
    449                                     d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"
    450                                   />
    451                                 </svg>
    452                               )}
    453                             </button>
    454 
    455                             {/* Add to playlist button */}
    456                             <div className="relative">
     417                          {user && (
     418                            <div className="flex items-center justify-between mt-4 pt-3 border-t border-white/10">
     419                              {/* Like button */}
    457420                              <button
    458421                                onClick={(e) => {
    459422                                  e.stopPropagation();
    460                                   togglePlaylistDropdown(song.id);
     423                                  toggleLike(song.id);
    461424                                }}
    462425                                className="text-gray-400 hover:text-[#1db954] transition-colors cursor-pointer"
    463                                 aria-label="Add to playlist"
     426                                aria-label={
     427                                  song.isLikedByCurrentUser
     428                                    ? "Unlike song"
     429                                    : "Like song"
     430                                }
    464431                              >
    465                                 <svg
    466                                   className="w-6 h-6"
    467                                   fill="none"
    468                                   stroke="currentColor"
    469                                   viewBox="0 0 24 24"
     432                                {song.isLikedByCurrentUser ? (
     433                                  <svg
     434                                    className="w-6 h-6 fill-[#1db954]"
     435                                    viewBox="0 0 24 24"
     436                                  >
     437                                    <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" />
     438                                  </svg>
     439                                ) : (
     440                                  <svg
     441                                    className="w-6 h-6"
     442                                    fill="none"
     443                                    stroke="currentColor"
     444                                    viewBox="0 0 24 24"
     445                                  >
     446                                    <path
     447                                      strokeLinecap="round"
     448                                      strokeLinejoin="round"
     449                                      strokeWidth={2}
     450                                      d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"
     451                                    />
     452                                  </svg>
     453                                )}
     454                              </button>
     455
     456                              {/* Add to playlist button */}
     457                              <div className="relative">
     458                                <button
     459                                  onClick={(e) => {
     460                                    e.stopPropagation();
     461                                    togglePlaylistDropdown(song.id);
     462                                  }}
     463                                  className="text-gray-400 hover:text-[#1db954] transition-colors cursor-pointer"
     464                                  aria-label="Add to playlist"
    470465                                >
    471                                   <path
    472                                     strokeLinecap="round"
    473                                     strokeLinejoin="round"
    474                                     strokeWidth={2}
    475                                     d="M12 4v16m8-8H4"
    476                                   />
    477                                 </svg>
    478                               </button>
    479 
    480                               <PlaylistDropdown
    481                                 songId={song.id}
    482                                 isOpen={openPlaylistDropdown === song.id}
    483                                 onClose={() => setOpenPlaylistDropdown(null)}
    484                                 direction="above"
    485                               />
     466                                  <svg
     467                                    className="w-6 h-6"
     468                                    fill="none"
     469                                    stroke="currentColor"
     470                                    viewBox="0 0 24 24"
     471                                  >
     472                                    <path
     473                                      strokeLinecap="round"
     474                                      strokeLinejoin="round"
     475                                      strokeWidth={2}
     476                                      d="M12 4v16m8-8H4"
     477                                    />
     478                                  </svg>
     479                                </button>
     480
     481                                <PlaylistDropdown
     482                                  songId={song.id}
     483                                  isOpen={openPlaylistDropdown === song.id}
     484                                  onClose={() => setOpenPlaylistDropdown(null)}
     485                                  direction="above"
     486                                />
     487                              </div>
    486488                            </div>
    487                           </div>
     489                          )}
    488490                        </div>
    489491                      </div>
Note: See TracChangeset for help on using the changeset viewer.