Normalize types

src/renderer/components/audio-player/AudioPlayer.tsx

@@ -154,14 +154,14 @@ export const AudioPlayer = forwardRef(
           ref={player1Ref}
           height={0}
           muted={muted}
-          playing={currentPlayer === 1 && status === PlayerStatus.Playing}
+          playing={currentPlayer === 1 && status === PlayerStatus.PLAYING}
           progressInterval={isTransitioning ? 10 : 250}
           url={player1?.streamUrl}
           volume={volume}
           width={0}
           onEnded={handleOnEnded}
           onProgress={
-            playbackStyle === PlaybackStyle.Gapless
+            playbackStyle === PlaybackStyle.GAPLESS
               ? handleGapless1
               : handleCrossfade1
           }
@@ -170,14 +170,14 @@ export const AudioPlayer = forwardRef(
           ref={player2Ref}
           height={0}
           muted={muted}
-          playing={currentPlayer === 2 && status === PlayerStatus.Playing}
+          playing={currentPlayer === 2 && status === PlayerStatus.PLAYING}
           progressInterval={isTransitioning ? 10 : 250}
           url={player2?.streamUrl}
           volume={volume}
           width={0}
           onEnded={handleOnEnded}
           onProgress={
-            playbackStyle === PlaybackStyle.Gapless
+            playbackStyle === PlaybackStyle.GAPLESS
               ? handleGapless2
               : handleCrossfade2
           }

src/renderer/features/player/components/CenterControls.tsx

@@ -2,7 +2,7 @@ import { useEffect, useMemo, useState } from 'react';
 import format from 'format-duration';
 import { useTranslation } from 'react-i18next';
 import {
-  RiPauseFill,
+  RiPauseLine,
   RiPlayFill,
   RiRewindFill,
   RiSkipBackFill,
@@ -88,8 +88,8 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
   useEffect(() => {
     let interval: any;
 
-    if (status === PlayerStatus.Playing && !isSeeking) {
-      if (settings.type === PlaybackType.Web) {
+    if (status === PlayerStatus.PLAYING && !isSeeking) {
+      if (settings.type === PlaybackType.WEB) {
         interval = setInterval(() => {
           setCurrentTime(currentPlayerRef.getCurrentTime());
         }, 1000);
@@ -119,15 +119,15 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
           />
           <PlayerButton
             icon={
-              status === PlayerStatus.Paused ? (
+              status === PlayerStatus.PAUSED ? (
                 <RiPlayFill size={20} />
               ) : (
-                <RiPauseFill size={20} />
+                <RiPauseLine size={20} stroke="20px" />
               )
             }
             tooltip={{
               label:
-                status === PlayerStatus.Paused
+                status === PlayerStatus.PAUSED
                   ? `${t('player.play')}`
                   : `${t('player.pause')}`,
             }}

src/renderer/features/player/components/LeftControls.tsx

@@ -67,7 +67,7 @@ export const LeftControls = () => {
           to="/nowplaying"
           weight={500}
         >
-          {album || '—'}
+          {album?.name || '—'}
         </Text>
       </MetadataStack>
     </LeftControlsContainer>

src/renderer/features/player/components/Playerbar.tsx

@@ -65,7 +65,7 @@ export const Playerbar = () => {
           <RightControls />
         </RightGridItem>
       </PlayerbarControlsGrid>
-      {settings.type === PlaybackType.Web && (
+      {settings.type === PlaybackType.WEB && (
         <AudioPlayer
           ref={playersRef}
           autoNext={autoNext}

src/renderer/features/settings/hooks/useDefaultSettings.ts

@@ -16,12 +16,12 @@ export type PlayerSettings = PlayerState['settings'];
 const DEFAULT_SETTINGS: WebSettings = {
   player: {
     crossfadeDuration: 5,
-    crossfadeStyle: CrossfadeStyle.EqualPower,
+    crossfadeStyle: CrossfadeStyle.EQUALPOWER,
     muted: false,
-    repeat: PlayerRepeat.All,
+    repeat: PlayerRepeat.ALL,
     shuffle: false,
-    style: PlaybackStyle.Gapless,
-    type: isElectron() ? PlaybackType.Local : PlaybackType.Web,
+    style: PlaybackStyle.GAPLESS,
+    type: isElectron() ? PlaybackType.LOCAL : PlaybackType.WEB,
     volume: 0.5,
   },
 };

src/renderer/store/usePlayerStore.ts

@@ -122,7 +122,7 @@ export const usePlayerStore = create<PlayerSlice>()(
       index: 0,
       player: 1,
       song: {} as Song,
-      status: PlayerStatus.Paused,
+      status: PlayerStatus.PAUSED,
       time: 0,
     },
     getPlayerData: () => {
@@ -171,14 +171,14 @@ export const usePlayerStore = create<PlayerSlice>()(
     pause: () => {
       set(
         produce((state) => {
-          state.current.status = PlayerStatus.Paused;
+          state.current.status = PlayerStatus.PAUSED;
         })
       );
     },
     play: () => {
       set(
         produce((state) => {
-          state.current.status = PlayerStatus.Playing;
+          state.current.status = PlayerStatus.PLAYING;
         })
       );
     },
@@ -228,12 +228,12 @@ export const usePlayerStore = create<PlayerSlice>()(
     },
     settings: {
       crossfadeDuration: 5,
-      crossfadeStyle: CrossfadeStyle.EqualPower,
+      crossfadeStyle: CrossfadeStyle.EQUALPOWER,
       muted: false,
-      repeat: PlayerRepeat.None,
+      repeat: PlayerRepeat.NONE,
       shuffle: false,
-      style: PlaybackStyle.Gapless,
-      type: PlaybackType.Local,
+      style: PlaybackStyle.GAPLESS,
+      type: PlaybackType.LOCAL,
       volume: 50,
     },
   }))