From eb455dffde8caae9f8c6d69eceea9fb493ec2759 Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Sun, 10 Apr 2022 20:10:19 -0700
Subject: [PATCH] Fix playerbar artist title styles

---
 src/components/player/PlayerBar.tsx | 5 ++---
 src/components/player/styled.tsx    | 4 ++--
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/player/PlayerBar.tsx b/src/components/player/PlayerBar.tsx
index 482ec74..cad6e03 100644
--- a/src/components/player/PlayerBar.tsx
+++ b/src/components/player/PlayerBar.tsx
@@ -1,6 +1,5 @@
 import React, { useEffect, useState, useRef, useMemo } from 'react';
 import axios from 'axios';
-import { nanoid } from 'nanoid/non-secure';
 import { useQueryClient } from 'react-query';
 import settings from 'electron-settings';
 import { FlexboxGrid, Grid, Row, Col, Whisper, Icon } from 'rsuite';
@@ -313,6 +312,7 @@ const PlayerBar = () => {
                             height: '23px',
                             display: 'flex',
                             alignItems: 'center',
+                            color: '#888e94',
                           }}
                         >
                           <span
@@ -324,7 +324,7 @@ const PlayerBar = () => {
                           >
                             {playQueue.current?.artist.length > 0 ? (
                               playQueue.current?.artist?.map((artist: Artist, i: number) => (
-                                <React.Fragment key={nanoid()}>
+                                <React.Fragment key={artist.id}>
                                   <SecondaryTextWrapper subtitle="true">
                                     {i > 0 && <>{', '}</>}
                                   </SecondaryTextWrapper>
@@ -336,7 +336,6 @@ const PlayerBar = () => {
                                     <LinkButton
                                       tabIndex={0}
                                       subtitle="true"
-                                      disabled={false}
                                       onClick={() => {
                                         if (artist?.id) {
                                           history.push(`/library/artist/${artist?.id}`);
diff --git a/src/components/player/styled.tsx b/src/components/player/styled.tsx
index fc664da..68cac99 100644
--- a/src/components/player/styled.tsx
+++ b/src/components/player/styled.tsx
@@ -1,4 +1,4 @@
-import { Button, Icon, Slider } from 'rsuite';
+import { Icon, Slider } from 'rsuite';
 import styled from 'styled-components';
 
 export const PlayerContainer = styled.div`
@@ -69,7 +69,7 @@ export const CoverArtContainer = styled.div<{ expand: boolean }>`
   }
 `;
 
-export const LinkButton = styled(Button)<{ subtitle?: string }>`
+export const LinkButton = styled.a<{ playing?: string; subtitle?: string }>`
   border-radius: 0px;
   background: transparent;
   max-width: 100%;