apricote/Listory
1
0
Fork 0
mirror of https://github.com/apricote/Listory.git synced 2026-01-13 21:21:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat(frontend): show recent listens

Browse source
This commit is contained in:
Julian Tölle 2020-05-02 21:46:41 +02:00
parent 32dcd84964
commit 49bff95ea5
12 changed files with 217 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

23
frontend/src/components/NavBar.tsx
View file

@ -1,6 +1,6 @@
import React from "react";
import { Link } from "react-router-dom";
import { User } from "../api/user";
import { User } from "../api/entities/user";
import { useAuth } from "../hooks/use-auth";
import { SpotifyLogo } from "../icons/Spotify";
@ -12,12 +12,17 @@ export const NavBar: React.FC = () => {
<div className="flex items-center flex-shrink-0 text-white mr-6">
<span className="font-semibold text-xl tracking-tight">Listory</span>
</div>
<div className="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
<div className="w-full block flex-grow lg:flex lg:items-center lg:w-auto ">
<div className="text-sm lg:flex-grow">
{user && (
<Link to="/">
<NavItem>Home</NavItem>
</Link>
<>
<Link to="/">
<NavItem>Home</NavItem>
</Link>
<Link to="/listens">
<NavItem>Your Listens</NavItem>
</Link>
</>
)}
</div>
<div>
@ -38,10 +43,14 @@ export const NavBar: React.FC = () => {
const NavUserInfo: React.FC<{ user: User }> = ({ user }) => {
return (
<div className="flex items-center mr-4">
<div className="flex items-center mr-4 mt-4 lg:mt-0">
<span className="text-green-200 text-sm">{user.displayName}</span>
{user.photo && (
<img className="w-6 h-6 rounded-full ml-4" src={user.photo}></img>
<img
className="w-6 h-6 rounded-full ml-4"
src={user.photo}
alt="Profile picture of logged in user"
></img>
)}
</div>
);