Merge branch 'development' into fix-structured-lyrics

This commit is contained in:
Kendall Garner 2024-02-01 22:13:41 -08:00
commit 9e4664a54c
No known key found for this signature in database
GPG Key ID: 18D2767419676C87
2 changed files with 19 additions and 21 deletions

View File

@ -6,7 +6,6 @@ import isElectron from 'is-electron';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { IoIosPause } from 'react-icons/io'; import { IoIosPause } from 'react-icons/io';
import { import {
RiMenuAddFill,
RiPlayFill, RiPlayFill,
RiRepeat2Line, RiRepeat2Line,
RiRepeatOneLine, RiRepeatOneLine,
@ -17,6 +16,7 @@ import {
RiSpeedFill, RiSpeedFill,
RiStopFill, RiStopFill,
} from 'react-icons/ri'; } from 'react-icons/ri';
import { BsDice3 } from 'react-icons/bs';
import styled from 'styled-components'; import styled from 'styled-components';
import { Text } from '/@/renderer/components'; import { Text } from '/@/renderer/components';
import { useCenterControls } from '../hooks/use-center-controls'; import { useCenterControls } from '../hooks/use-center-controls';
@ -171,17 +171,16 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
<ControlsContainer> <ControlsContainer>
<ButtonsContainer> <ButtonsContainer>
<PlayerButton <PlayerButton
icon={<RiStopFill size={15} />} icon={<RiStopFill size={20} />}
tooltip={{ tooltip={{
label: t('player.stop', { postProcess: 'sentenceCase' }), label: t('player.stop', { postProcess: 'sentenceCase' }),
openDelay: 500,
}} }}
variant="tertiary" variant="tertiary"
onClick={handleStop} onClick={handleStop}
/> />
<PlayerButton <PlayerButton
$isActive={shuffle !== PlayerShuffle.NONE} $isActive={shuffle !== PlayerShuffle.NONE}
icon={<RiShuffleFill size={15} />} icon={<RiShuffleFill size={20} />}
tooltip={{ tooltip={{
label: label:
shuffle === PlayerShuffle.NONE shuffle === PlayerShuffle.NONE
@ -190,29 +189,26 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
postProcess: 'sentenceCase', postProcess: 'sentenceCase',
}) })
: t('player.shuffle', { postProcess: 'sentenceCase' }), : t('player.shuffle', { postProcess: 'sentenceCase' }),
openDelay: 500,
}} }}
variant="tertiary" variant="tertiary"
onClick={handleToggleShuffle} onClick={handleToggleShuffle}
/> />
<PlayerButton <PlayerButton
icon={<RiSkipBackFill size={15} />} icon={<RiSkipBackFill size={20} />}
tooltip={{ tooltip={{
label: t('player.previous', { postProcess: 'sentenceCase' }), label: t('player.previous', { postProcess: 'sentenceCase' }),
openDelay: 500,
}} }}
variant="secondary" variant="secondary"
onClick={handlePrevTrack} onClick={handlePrevTrack}
/> />
{skip?.enabled && ( {skip?.enabled && (
<PlayerButton <PlayerButton
icon={<RiRewindFill size={15} />} icon={<RiRewindFill size={20} />}
tooltip={{ tooltip={{
label: t('player.skip', { label: t('player.skip', {
context: 'back', context: 'back',
postProcess: 'sentenceCase', postProcess: 'sentenceCase',
}), }),
openDelay: 500,
}} }}
variant="secondary" variant="secondary"
onClick={() => handleSkipBackward(skip?.skipBackwardSeconds)} onClick={() => handleSkipBackward(skip?.skipBackwardSeconds)}
@ -232,30 +228,27 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
status === PlayerStatus.PAUSED status === PlayerStatus.PAUSED
? t('player.play', { postProcess: 'sentenceCase' }) ? t('player.play', { postProcess: 'sentenceCase' })
: t('player.pause', { postProcess: 'sentenceCase' }), : t('player.pause', { postProcess: 'sentenceCase' }),
openDelay: 500,
}} }}
variant="main" variant="main"
onClick={handlePlayPause} onClick={handlePlayPause}
/> />
{skip?.enabled && ( {skip?.enabled && (
<PlayerButton <PlayerButton
icon={<RiSpeedFill size={15} />} icon={<RiSpeedFill size={20} />}
tooltip={{ tooltip={{
label: t('player.skip', { label: t('player.skip', {
context: 'forward', context: 'forward',
postProcess: 'sentenceCase', postProcess: 'sentenceCase',
}), }),
openDelay: 500,
}} }}
variant="secondary" variant="secondary"
onClick={() => handleSkipForward(skip?.skipForwardSeconds)} onClick={() => handleSkipForward(skip?.skipForwardSeconds)}
/> />
)} )}
<PlayerButton <PlayerButton
icon={<RiSkipForwardFill size={15} />} icon={<RiSkipForwardFill size={20} />}
tooltip={{ tooltip={{
label: t('player.next', { postProcess: 'sentenceCase' }), label: t('player.next', { postProcess: 'sentenceCase' }),
openDelay: 500,
}} }}
variant="secondary" variant="secondary"
onClick={handleNextTrack} onClick={handleNextTrack}
@ -264,9 +257,9 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
$isActive={repeat !== PlayerRepeat.NONE} $isActive={repeat !== PlayerRepeat.NONE}
icon={ icon={
repeat === PlayerRepeat.ONE ? ( repeat === PlayerRepeat.ONE ? (
<RiRepeatOneLine size={15} /> <RiRepeatOneLine size={20} />
) : ( ) : (
<RiRepeat2Line size={15} /> <RiRepeat2Line size={20} />
) )
} }
tooltip={{ tooltip={{
@ -286,17 +279,15 @@ export const CenterControls = ({ playersRef }: CenterControlsProps) => {
postProcess: 'sentenceCase', postProcess: 'sentenceCase',
}) })
}`, }`,
openDelay: 500,
}} }}
variant="tertiary" variant="tertiary"
onClick={handleToggleRepeat} onClick={handleToggleRepeat}
/> />
<PlayerButton <PlayerButton
icon={<RiMenuAddFill size={15} />} icon={<BsDice3 size={20} />}
tooltip={{ tooltip={{
label: t('player.playRandom', { postProcess: 'sentenceCase' }), label: t('player.playRandom', { postProcess: 'sentenceCase' }),
openDelay: 500,
}} }}
variant="tertiary" variant="tertiary"
onClick={() => onClick={() =>

View File

@ -315,12 +315,19 @@ export const useScrobble = () => {
useEffect(() => { useEffect(() => {
const unsubSongChange = usePlayerStore.subscribe( const unsubSongChange = usePlayerStore.subscribe(
(state) => [state.current.song, state.current.time], (state) => [state.current.song, state.current.time, state.current.player],
handleScrobbleFromSongChange, handleScrobbleFromSongChange,
{ {
// We need the current time to check the scrobble condition, but we only want to // We need the current time to check the scrobble condition, but we only want to
// trigger the callback when the song changes // trigger the callback when the song changes
equalityFn: (a, b) => (a[0] as QueueSong)?.id === (b[0] as QueueSong)?.id, // There are two conditions where this should trigger:
// 1. The song actually changes (the common case)
// 2. The song does not change, but the player dows. This would either be
// a single track on repeat one, or one track added to the queue
// multiple times in a row and playback goes normally (no next/previous)
equalityFn: (a, b) =>
(a[0] as QueueSong)?.uniqueId === (b[0] as QueueSong)?.uniqueId &&
a[2] === b[2],
}, },
); );