antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-01 02:13:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix all imports for new structure

Browse source
This commit is contained in:
jeffvli 2025-05-20 19:23:36 -07:00
parent 249eaf89f8
commit 930165d006
291 changed files with 2056 additions and 1894 deletions
Download patch file Download diff file Expand all files Collapse all files

685
src/renderer/components/audio-player/index.tsx
View file

@ -1,17 +1,9 @@
import type { Song } from '/@/renderer/api/types';
import type { CrossfadeStyle } from '/@/renderer/types';
import type { Song } from '/@/shared/types/domain-types';
import type { CrossfadeStyle } from '/@/shared/types/types';
import type { ReactPlayerProps } from 'react-player';
import isElectron from 'is-electron';
import {
forwardRef,
useCallback,
useEffect,
useImperativeHandle,
useMemo,
useRef,
useState,
} from 'react';
import { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
import ReactPlayer from 'react-player/lazy';
import { api } from '/@/renderer/api';
@ -23,7 +15,7 @@ import { toast } from '/@/renderer/components/toast';
import { useWebAudio } from '/@/renderer/features/player/hooks/use-webaudio';
import { getServerById, TranscodingConfig, usePlaybackSettings, useSpeed } from '/@/renderer/store';
import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store/settings.store';
import { PlaybackStyle, PlayerStatus } from '/@/renderer/types';
import { PlaybackStyle, PlayerStatus } from '/@/shared/types/types';
export type AudioPlayerProgress = {
loaded: number;
@ -33,9 +25,11 @@ export type AudioPlayerProgress = {
};
interface AudioPlayerProps extends ReactPlayerProps {
autoNext: () => void;
crossfadeDuration: number;
crossfadeStyle: CrossfadeStyle;
currentPlayer: 1 | 2;
muted: boolean;
playbackStyle: PlaybackStyle;
player1?: Song;
player2?: Song;
@ -93,369 +87,360 @@ const useSongUrl = (transcode: TranscodingConfig, current: boolean, song?: Song)
}, [current, song?.uniqueId, song?.serverId, song?.streamUrl, transcode]);
};
export const AudioPlayer = forwardRef(
(
{
autoNext,
crossfadeDuration,
crossfadeStyle,
currentPlayer,
muted,
playbackStyle,
player1,
player2,
status,
volume,
}: AudioPlayerProps,
ref: any,
) => {
const player1Ref = useRef<ReactPlayer>(null);
const player2Ref = useRef<ReactPlayer>(null);
const [isTransitioning, setIsTransitioning] = useState(false);
const audioDeviceId = useSettingsStore((state) => state.playback.audioDeviceId);
const playback = useSettingsStore((state) => state.playback.mpvProperties);
const shouldUseWebAudio = useSettingsStore((state) => state.playback.webAudio);
const { resetSampleRate } = useSettingsStoreActions();
const playbackSpeed = useSpeed();
const { transcode } = usePlaybackSettings();
export const AudioPlayer = ({ ref, ...props }: AudioPlayerProps) => {
const {
autoNext,
crossfadeDuration,
crossfadeStyle,
currentPlayer,
muted,
playbackStyle,
player1,
player2,
status,
volume,
} = props;
const stream1 = useSongUrl(transcode, currentPlayer === 1, player1);
const stream2 = useSongUrl(transcode, currentPlayer === 2, player2);
const player1Ref = useRef<ReactPlayer>(null);
const player2Ref = useRef<ReactPlayer>(null);
const [isTransitioning, setIsTransitioning] = useState(false);
const audioDeviceId = useSettingsStore((state) => state.playback.audioDeviceId);
const playback = useSettingsStore((state) => state.playback.mpvProperties);
const shouldUseWebAudio = useSettingsStore((state) => state.playback.webAudio);
const { resetSampleRate } = useSettingsStoreActions();
const playbackSpeed = useSpeed();
const { transcode } = usePlaybackSettings();
const { setWebAudio, webAudio } = useWebAudio();
const [player1Source, setPlayer1Source] = useState<MediaElementAudioSourceNode | null>(
null,
);
const [player2Source, setPlayer2Source] = useState<MediaElementAudioSourceNode | null>(
null,
);
const stream1 = useSongUrl(transcode, currentPlayer === 1, player1);
const stream2 = useSongUrl(transcode, currentPlayer === 2, player2);
const calculateReplayGain = useCallback(
(song: Song): number => {
if (playback.replayGainMode === 'no') {
const { setWebAudio, webAudio } = useWebAudio();
const [player1Source, setPlayer1Source] = useState<MediaElementAudioSourceNode | null>(null);
const [player2Source, setPlayer2Source] = useState<MediaElementAudioSourceNode | null>(null);
const calculateReplayGain = useCallback(
(song: Song): number => {
if (playback.replayGainMode === 'no') {
return 1;
}
let gain: number | undefined;
let peak: number | undefined;
if (playback.replayGainMode === 'track') {
gain = song.gain?.track ?? song.gain?.album;
peak = song.peak?.track ?? song.peak?.album;
} else {
gain = song.gain?.album ?? song.gain?.track;
peak = song.peak?.album ?? song.peak?.track;
}
if (gain === undefined) {
gain = playback.replayGainFallbackDB;
if (!gain) {
return 1;
}
let gain: number | undefined;
let peak: number | undefined;
if (playback.replayGainMode === 'track') {
gain = song.gain?.track ?? song.gain?.album;
peak = song.peak?.track ?? song.peak?.album;
} else {
gain = song.gain?.album ?? song.gain?.track;
peak = song.peak?.album ?? song.peak?.track;
}
if (gain === undefined) {
gain = playback.replayGainFallbackDB;
if (!gain) {
return 1;
}
}
if (peak === undefined) {
peak = 1;
}
const preAmp = playback.replayGainPreampDB ?? 0;
// https://wiki.hydrogenaud.io/index.php?title=ReplayGain_1.0_specification&section=19
// Normalized to max gain
const expectedGain = 10 ** ((gain + preAmp) / 20);
if (playback.replayGainClip) {
return Math.min(expectedGain, 1 / peak);
}
return expectedGain;
},
[
playback.replayGainClip,
playback.replayGainFallbackDB,
playback.replayGainMode,
playback.replayGainPreampDB,
],
);
useEffect(() => {
if (shouldUseWebAudio && 'AudioContext' in window) {
let context: AudioContext;
try {
context = new AudioContext({
latencyHint: 'playback',
sampleRate: playback.audioSampleRateHz || undefined,
});
} catch (error) {
// In practice, this should never be hit because the UI should validate
// the range. However, the actual supported range is not guaranteed
toast.error({ message: (error as Error).message });
context = new AudioContext({ latencyHint: 'playback' });
resetSampleRate();
}
const gain = context.createGain();
gain.connect(context.destination);
setWebAudio!({ context, gain });
return () => {
return context.close();
};
}
return () => {};
// Intentionally ignore the sample rate dependency, as it makes things really messy
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
useImperativeHandle(ref, () => ({
get player1() {
return player1Ref?.current;
},
get player2() {
return player2Ref?.current;
},
}));
if (peak === undefined) {
peak = 1;
}
const handleOnEnded = () => {
autoNext();
setIsTransitioning(false);
};
const preAmp = playback.replayGainPreampDB ?? 0;
useEffect(() => {
if (status === PlayerStatus.PLAYING) {
if (currentPlayer === 1) {
// calling play() is not necessarily a safe option (https://developer.chrome.com/blog/play-request-was-interrupted)
// In practice, this failure is only likely to happen when using the 0-second wav:
// play() + play() in rapid succession will cause problems as the frist one ends the track.
player1Ref.current
?.getInternalPlayer()
?.play()
.catch(() => {});
} else {
player2Ref.current
?.getInternalPlayer()
?.play()
.catch(() => {});
}
// https://wiki.hydrogenaud.io/index.php?title=ReplayGain_1.0_specification&section=19
// Normalized to max gain
const expectedGain = 10 ** ((gain + preAmp) / 20);
if (playback.replayGainClip) {
return Math.min(expectedGain, 1 / peak);
}
return expectedGain;
},
[
playback.replayGainClip,
playback.replayGainFallbackDB,
playback.replayGainMode,
playback.replayGainPreampDB,
],
);
useEffect(() => {
if (shouldUseWebAudio && 'AudioContext' in window) {
let context: AudioContext;
try {
context = new AudioContext({
latencyHint: 'playback',
sampleRate: playback.audioSampleRateHz || undefined,
});
} catch (error) {
// In practice, this should never be hit because the UI should validate
// the range. However, the actual supported range is not guaranteed
toast.error({ message: (error as Error).message });
context = new AudioContext({ latencyHint: 'playback' });
resetSampleRate();
}
const gain = context.createGain();
gain.connect(context.destination);
setWebAudio!({ context, gain });
return () => {
return context.close();
};
}
return () => {};
// Intentionally ignore the sample rate dependency, as it makes things really messy
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
useImperativeHandle(ref, () => ({
get player1() {
return player1Ref?.current;
},
get player2() {
return player2Ref?.current;
},
}));
const handleOnEnded = () => {
autoNext();
setIsTransitioning(false);
};
useEffect(() => {
if (status === PlayerStatus.PLAYING) {
if (currentPlayer === 1) {
// calling play() is not necessarily a safe option (https://developer.chrome.com/blog/play-request-was-interrupted)
// In practice, this failure is only likely to happen when using the 0-second wav:
// play() + play() in rapid succession will cause problems as the frist one ends the track.
player1Ref.current
?.getInternalPlayer()
?.play()
.catch(() => {});
} else {
player1Ref.current?.getInternalPlayer()?.pause();
player2Ref.current?.getInternalPlayer()?.pause();
player2Ref.current
?.getInternalPlayer()
?.play()
.catch(() => {});
}
}, [currentPlayer, status]);
} else {
player1Ref.current?.getInternalPlayer()?.pause();
player2Ref.current?.getInternalPlayer()?.pause();
}
}, [currentPlayer, status]);
const handleCrossfade1 = useCallback(
(e: AudioPlayerProgress) => {
return crossfadeHandler({
currentPlayer,
currentPlayerRef: player1Ref,
currentTime: e.playedSeconds,
duration: getDuration(player1Ref),
fadeDuration: crossfadeDuration,
fadeType: crossfadeStyle,
isTransitioning,
nextPlayerRef: player2Ref,
player: 1,
setIsTransitioning,
volume,
});
},
[crossfadeDuration, crossfadeStyle, currentPlayer, isTransitioning, volume],
);
const handleCrossfade1 = useCallback(
(e: AudioPlayerProgress) => {
return crossfadeHandler({
currentPlayer,
currentPlayerRef: player1Ref,
currentTime: e.playedSeconds,
duration: getDuration(player1Ref),
fadeDuration: crossfadeDuration,
fadeType: crossfadeStyle,
isTransitioning,
nextPlayerRef: player2Ref,
player: 1,
setIsTransitioning,
volume,
});
},
[crossfadeDuration, crossfadeStyle, currentPlayer, isTransitioning, volume],
);
const handleCrossfade2 = useCallback(
(e: AudioPlayerProgress) => {
return crossfadeHandler({
currentPlayer,
currentPlayerRef: player2Ref,
currentTime: e.playedSeconds,
duration: getDuration(player2Ref),
fadeDuration: crossfadeDuration,
fadeType: crossfadeStyle,
isTransitioning,
nextPlayerRef: player1Ref,
player: 2,
setIsTransitioning,
volume,
});
},
[crossfadeDuration, crossfadeStyle, currentPlayer, isTransitioning, volume],
);
const handleCrossfade2 = useCallback(
(e: AudioPlayerProgress) => {
return crossfadeHandler({
currentPlayer,
currentPlayerRef: player2Ref,
currentTime: e.playedSeconds,
duration: getDuration(player2Ref),
fadeDuration: crossfadeDuration,
fadeType: crossfadeStyle,
isTransitioning,
nextPlayerRef: player1Ref,
player: 2,
setIsTransitioning,
volume,
});
},
[crossfadeDuration, crossfadeStyle, currentPlayer, isTransitioning, volume],
);
const handleGapless1 = useCallback(
(e: AudioPlayerProgress) => {
return gaplessHandler({
currentTime: e.playedSeconds,
duration: getDuration(player1Ref),
isFlac: player1?.container === 'flac',
isTransitioning,
nextPlayerRef: player2Ref,
setIsTransitioning,
});
},
[isTransitioning, player1?.container],
);
const handleGapless1 = useCallback(
(e: AudioPlayerProgress) => {
return gaplessHandler({
currentTime: e.playedSeconds,
duration: getDuration(player1Ref),
isFlac: player1?.container === 'flac',
isTransitioning,
nextPlayerRef: player2Ref,
setIsTransitioning,
});
},
[isTransitioning, player1?.container],
);
const handleGapless2 = useCallback(
(e: AudioPlayerProgress) => {
return gaplessHandler({
currentTime: e.playedSeconds,
duration: getDuration(player2Ref),
isFlac: player2?.container === 'flac',
isTransitioning,
nextPlayerRef: player1Ref,
setIsTransitioning,
});
},
[isTransitioning, player2?.container],
);
const handleGapless2 = useCallback(
(e: AudioPlayerProgress) => {
return gaplessHandler({
currentTime: e.playedSeconds,
duration: getDuration(player2Ref),
isFlac: player2?.container === 'flac',
isTransitioning,
nextPlayerRef: player1Ref,
setIsTransitioning,
});
},
[isTransitioning, player2?.container],
);
useEffect(() => {
// Not standard, just used in chromium-based browsers. See
// https://developer.chrome.com/blog/audiocontext-setsinkid/.
// If the isElectron() check is every removed, fix this.
if (isElectron() && webAudio && 'setSinkId' in webAudio.context && audioDeviceId) {
const setSink = async () => {
try {
if (audioDeviceId !== 'default') {
// @ts-ignore
await webAudio.context.setSinkId(audioDeviceId);
} else {
// @ts-ignore
await webAudio.context.setSinkId('');
}
} catch (error) {
toast.error({ message: `Error setting sink: ${(error as Error).message}` });
useEffect(() => {
// Not standard, just used in chromium-based browsers. See
// https://developer.chrome.com/blog/audiocontext-setsinkid/.
// If the isElectron() check is every removed, fix this.
if (isElectron() && webAudio && 'setSinkId' in webAudio.context && audioDeviceId) {
const setSink = async () => {
try {
if (audioDeviceId !== 'default') {
await (webAudio.context as any).setSinkId(audioDeviceId);
} else {
await (webAudio.context as any).setSinkId('');
}
};
} catch (error) {
toast.error({ message: `Error setting sink: ${(error as Error).message}` });
}
};
setSink();
}
}, [audioDeviceId, webAudio]);
setSink();
}
}, [audioDeviceId, webAudio]);
useEffect(() => {
useEffect(() => {
if (!webAudio) return;
const sources = [player1Source ? player1 : null, player2Source ? player2 : null];
const current = sources[currentPlayer - 1];
// Set the current replaygain
if (current) {
const newVolume = calculateReplayGain(current) * volume;
webAudio.gain.gain.setValueAtTime(Math.max(0, newVolume), 0);
}
// Set the next track replaygain right before the end of this track
// Attempt to prevent pop-in for web audio.
const next = sources[3 - currentPlayer];
if (next && current) {
const newVolume = calculateReplayGain(next) * volume;
webAudio.gain.gain.setValueAtTime(
Math.max(0, newVolume),
Math.max(0, (current.duration - 1) / 1000),
);
}
}, [
calculateReplayGain,
currentPlayer,
player1,
player1Source,
player2,
player2Source,
volume,
webAudio,
]);
const handlePlayer1Start = useCallback(
async (player: ReactPlayer) => {
if (!webAudio) return;
const sources = [player1Source ? player1 : null, player2Source ? player2 : null];
const current = sources[currentPlayer - 1];
// Set the current replaygain
if (current) {
const newVolume = calculateReplayGain(current) * volume;
webAudio.gain.gain.setValueAtTime(Math.max(0, newVolume), 0);
if (player1Source) {
// This should fire once, only if the source is real (meaning we
// saw the dummy source) and the context is not ready
if (webAudio.context.state !== 'running') {
await webAudio.context.resume();
}
return;
}
// Set the next track replaygain right before the end of this track
// Attempt to prevent pop-in for web audio.
const next = sources[3 - currentPlayer];
if (next && current) {
const newVolume = calculateReplayGain(next) * volume;
webAudio.gain.gain.setValueAtTime(
Math.max(0, newVolume),
Math.max(0, (current.duration - 1) / 1000),
);
const internal = player.getInternalPlayer() as HTMLMediaElement | undefined;
if (internal) {
const { context, gain } = webAudio;
const source = context.createMediaElementSource(internal);
source.connect(gain);
setPlayer1Source(source);
}
}, [
calculateReplayGain,
currentPlayer,
player1,
player1Source,
player2,
player2Source,
volume,
webAudio,
]);
},
[player1Source, webAudio],
);
const handlePlayer1Start = useCallback(
async (player: ReactPlayer) => {
if (!webAudio) return;
if (player1Source) {
// This should fire once, only if the source is real (meaning we
// saw the dummy source) and the context is not ready
if (webAudio.context.state !== 'running') {
await webAudio.context.resume();
}
return;
const handlePlayer2Start = useCallback(
async (player: ReactPlayer) => {
if (!webAudio) return;
if (player2Source) {
if (webAudio.context.state !== 'running') {
await webAudio.context.resume();
}
return;
}
const internal = player.getInternalPlayer() as HTMLMediaElement | undefined;
if (internal) {
const { context, gain } = webAudio;
const source = context.createMediaElementSource(internal);
source.connect(gain);
setPlayer1Source(source);
const internal = player.getInternalPlayer() as HTMLMediaElement | undefined;
if (internal) {
const { context, gain } = webAudio;
const source = context.createMediaElementSource(internal);
source.connect(gain);
setPlayer2Source(source);
}
},
[player2Source, webAudio],
);
// Bugfix for Safari: rather than use the `<audio>` volume (which doesn't work),
// use the GainNode to scale the volume. In this case, for compatibility with
// other browsers, set the `<audio>` volume to 1
return (
<>
<ReactPlayer
config={{
file: { attributes: { crossOrigin: 'anonymous' }, forceAudio: true },
}}
height={0}
muted={muted}
// If there is no stream url, we do not need to handle when the audio finishes
onEnded={stream1 ? handleOnEnded : undefined}
onProgress={
playbackStyle === PlaybackStyle.GAPLESS ? handleGapless1 : handleCrossfade1
}
},
[player1Source, webAudio],
);
const handlePlayer2Start = useCallback(
async (player: ReactPlayer) => {
if (!webAudio) return;
if (player2Source) {
if (webAudio.context.state !== 'running') {
await webAudio.context.resume();
}
return;
onReady={handlePlayer1Start}
playbackRate={playbackSpeed}
playing={currentPlayer === 1 && status === PlayerStatus.PLAYING}
progressInterval={isTransitioning ? 10 : 250}
ref={player1Ref}
url={stream1 || EMPTY_SOURCE}
volume={webAudio ? 1 : volume}
width={0}
/>
<ReactPlayer
config={{
file: { attributes: { crossOrigin: 'anonymous' }, forceAudio: true },
}}
height={0}
muted={muted}
onEnded={stream2 ? handleOnEnded : undefined}
onProgress={
playbackStyle === PlaybackStyle.GAPLESS ? handleGapless2 : handleCrossfade2
}
const internal = player.getInternalPlayer() as HTMLMediaElement | undefined;
if (internal) {
const { context, gain } = webAudio;
const source = context.createMediaElementSource(internal);
source.connect(gain);
setPlayer2Source(source);
}
},
[player2Source, webAudio],
);
// Bugfix for Safari: rather than use the `<audio>` volume (which doesn't work),
// use the GainNode to scale the volume. In this case, for compatibility with
// other browsers, set the `<audio>` volume to 1
return (
<>
<ReactPlayer
config={{
file: { attributes: { crossOrigin: 'anonymous' }, forceAudio: true },
}}
height={0}
muted={muted}
// If there is no stream url, we do not need to handle when the audio finishes
onEnded={stream1 ? handleOnEnded : undefined}
onProgress={
playbackStyle === PlaybackStyle.GAPLESS ? handleGapless1 : handleCrossfade1
}
onReady={handlePlayer1Start}
playbackRate={playbackSpeed}
playing={currentPlayer === 1 && status === PlayerStatus.PLAYING}
progressInterval={isTransitioning ? 10 : 250}
ref={player1Ref}
url={stream1 || EMPTY_SOURCE}
volume={webAudio ? 1 : volume}
width={0}
/>
<ReactPlayer
config={{
file: { attributes: { crossOrigin: 'anonymous' }, forceAudio: true },
}}
height={0}
muted={muted}
onEnded={stream2 ? handleOnEnded : undefined}
onProgress={
playbackStyle === PlaybackStyle.GAPLESS ? handleGapless2 : handleCrossfade2
}
onReady={handlePlayer2Start}
playbackRate={playbackSpeed}
playing={currentPlayer === 2 && status === PlayerStatus.PLAYING}
progressInterval={isTransitioning ? 10 : 250}
ref={player2Ref}
url={stream2 || EMPTY_SOURCE}
volume={webAudio ? 1 : volume}
width={0}
/>
</>
);
},
);
onReady={handlePlayer2Start}
playbackRate={playbackSpeed}
playing={currentPlayer === 2 && status === PlayerStatus.PLAYING}
progressInterval={isTransitioning ? 10 : 250}
ref={player2Ref}
url={stream2 || EMPTY_SOURCE}
volume={webAudio ? 1 : volume}
width={0}
/>
</>
);
};

2
src/renderer/components/audio-player/utils/list-handlers.ts
View file

@ -1,6 +1,6 @@
import type { Dispatch } from 'react';
import { CrossfadeStyle } from '/@/renderer/types';
import { CrossfadeStyle } from '/@/shared/types/types';
export const gaplessHandler = (args: {
currentTime: number;

6
src/renderer/components/button/index.tsx
View file

@ -130,12 +130,6 @@ export const _Button = forwardRef<HTMLButtonElement, ButtonProps>(
export const Button = createPolymorphicComponent<'button', ButtonProps>(_Button);
_Button.defaultProps = {
loading: undefined,
onClick: undefined,
tooltip: undefined,
};
interface HoldButtonProps extends ButtonProps {
timeoutProps: {
callback: () => void;

7
src/renderer/components/card/album-card.tsx
View file

@ -1,4 +1,4 @@
import type { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/renderer/types';
import type { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/shared/types/types';
import { Center } from '@mantine/core';
import { useCallback } from 'react';
@ -7,10 +7,10 @@ import { generatePath, useNavigate } from 'react-router';
import { SimpleImg } from 'react-simple-img';
import styled from 'styled-components';
import { Album, AlbumArtist, Artist, LibraryItem } from '/@/renderer/api/types';
import { CardControls } from '/@/renderer/components/card/card-controls';
import { CardRows } from '/@/renderer/components/card/card-rows';
import { Skeleton } from '/@/renderer/components/skeleton';
import { Album, AlbumArtist, Artist, LibraryItem } from '/@/shared/types/domain-types';
const CardWrapper = styled.div<{
link?: boolean;
@ -130,7 +130,7 @@ export const AlbumCard = ({
const handleNavigate = useCallback(() => {
navigate(
generatePath(
route.route,
route.route as string,
route.slugs?.reduce((acc, slug) => {
return {
...acc,
@ -207,6 +207,7 @@ export const AlbumCard = ({
{(cardRows || []).map((_row: CardRow<Album>, index: number) => (
<Skeleton
height={15}
key={`skeleton-${data?.id}-${index}`}
my={3}
radius="md"
visible

6
src/renderer/components/card/card-controls.tsx
View file

@ -1,4 +1,4 @@
import type { PlayQueueAddOptions } from '/@/renderer/types';
import type { PlayQueueAddOptions } from '/@/shared/types/types';
import type { UnstyledButtonProps } from '@mantine/core';
import type { MouseEvent } from 'react';
@ -7,7 +7,6 @@ import React from 'react';
import { RiHeartFill, RiHeartLine, RiMore2Fill, RiPlayFill } from 'react-icons/ri';
import styled from 'styled-components';
import { LibraryItem } from '/@/renderer/api/types';
import { _Button } from '/@/renderer/components/button';
import {
ALBUM_CONTEXT_MENU_ITEMS,
@ -15,7 +14,8 @@ import {
} from '/@/renderer/features/context-menu/context-menu-items';
import { useHandleGeneralContextMenu } from '/@/renderer/features/context-menu/hooks/use-handle-context-menu';
import { usePlayButtonBehavior } from '/@/renderer/store/settings.store';
import { Play } from '/@/renderer/types';
import { LibraryItem } from '/@/shared/types/domain-types';
import { Play } from '/@/shared/types/types';
type PlayButtonType = React.ComponentPropsWithoutRef<'button'> & UnstyledButtonProps;

4
src/renderer/components/card/card-rows.tsx
View file

@ -4,11 +4,11 @@ import { generatePath } from 'react-router';
import { Link } from 'react-router-dom';
import styled from 'styled-components';
import { Album, AlbumArtist, Artist, Playlist, Song } from '/@/renderer/api/types';
import { Text } from '/@/renderer/components/text';
import { AppRoute } from '/@/renderer/router/routes';
import { CardRow } from '/@/renderer/types';
import { formatDateAbsolute, formatDateRelative, formatRating } from '/@/renderer/utils/format';
import { Album, AlbumArtist, Artist, Playlist, Song } from '/@/shared/types/domain-types';
import { CardRow } from '/@/shared/types/types';
const Row = styled.div<{ $secondary?: boolean }>`
width: 100%;

6
src/renderer/components/card/poster-card.tsx
View file

@ -4,11 +4,11 @@ import { generatePath, Link } from 'react-router-dom';
import { SimpleImg } from 'react-simple-img';
import styled, { css } from 'styled-components';
import { Album, AlbumArtist, Artist, LibraryItem } from '/@/renderer/api/types';
import { CardRows } from '/@/renderer/components/card';
import { Skeleton } from '/@/renderer/components/skeleton';
import { GridCardControls } from '/@/renderer/components/virtual-grid/grid-card/grid-card-controls';
import { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/renderer/types';
import { Album, AlbumArtist, Artist, LibraryItem } from '/@/shared/types/domain-types';
import { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/shared/types/types';
interface BaseGridCardProps {
controls: {
@ -109,7 +109,7 @@ export const PosterCard = ({
}: BaseGridCardProps & { uniqueId: string }) => {
if (!isLoading) {
const path = generatePath(
controls.route.route,
controls.route.route as string,
controls.route.slugs?.reduce((acc, slug) => {
return {
...acc,

5
src/renderer/components/date-picker/index.tsx
View file

@ -43,8 +43,3 @@ export const DatePicker = ({ maxWidth, width, ...props }: DatePickerProps) => {
/>
);
};
DatePicker.defaultProps = {
maxWidth: undefined,
width: undefined,
};

6
src/renderer/components/feature-carousel/index.tsx
View file

@ -9,14 +9,14 @@ import { RiArrowLeftSLine, RiArrowRightSLine } from 'react-icons/ri';
import { generatePath, Link } from 'react-router-dom';
import styled from 'styled-components';
import { Album, LibraryItem } from '/@/renderer/api/types';
import { Badge } from '/@/renderer/components/badge';
import { Button } from '/@/renderer/components/button';
import { TextTitle } from '/@/renderer/components/text-title';
import { usePlayQueueAdd } from '/@/renderer/features/player/hooks/use-playqueue-add';
import { AppRoute } from '/@/renderer/router/routes';
import { usePlayButtonBehavior } from '/@/renderer/store';
import { Play } from '/@/renderer/types';
import { Album, LibraryItem } from '/@/shared/types/domain-types';
import { Play } from '/@/shared/types/types';
const Carousel = styled(motion.div)`
position: relative;
@ -64,9 +64,9 @@ const BackgroundImage = styled.img`
width: 150%;
height: 150%;
user-select: none;
filter: blur(24px);
object-fit: var(--image-fit);
object-position: 0 30%;
filter: blur(24px);
`;
const BackgroundImageOverlay = styled.div`

11
src/renderer/components/grid-carousel/index.tsx
View file

@ -18,14 +18,20 @@ import 'swiper/css';
import { Swiper, SwiperSlide } from 'swiper/react';
import { Swiper as SwiperCore } from 'swiper/types';
import { Album, AlbumArtist, Artist, LibraryItem, RelatedArtist } from '/@/renderer/api/types';
import { Button } from '/@/renderer/components/button';
import { PosterCard } from '/@/renderer/components/card/poster-card';
import { TextTitle } from '/@/renderer/components/text-title';
import { usePlayQueueAdd } from '/@/renderer/features/player';
import { useCreateFavorite, useDeleteFavorite } from '/@/renderer/features/shared';
import { usePlayButtonBehavior } from '/@/renderer/store';
import { CardRoute, CardRow } from '/@/renderer/types';
import {
Album,
AlbumArtist,
Artist,
LibraryItem,
RelatedArtist,
} from '/@/shared/types/domain-types';
import { CardRoute, CardRow } from '/@/shared/types/types';
const getSlidesPerView = (windowWidth: number) => {
if (windowWidth < 400) return 2;
@ -178,6 +184,7 @@ export const SwiperGridCarousel = ({
}}
data={el}
isLoading={isLoading}
key={`${uniqueId}-${el.id}`}
uniqueId={uniqueId}
/>
));

36
src/renderer/components/input/index.tsx
View file

@ -367,39 +367,3 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
);
},
);
TextInput.defaultProps = {
children: undefined,
maxWidth: undefined,
width: undefined,
};
NumberInput.defaultProps = {
children: undefined,
maxWidth: undefined,
width: undefined,
};
PasswordInput.defaultProps = {
children: undefined,
maxWidth: undefined,
width: undefined,
};
FileInput.defaultProps = {
children: undefined,
maxWidth: undefined,
width: undefined,
};
JsonInput.defaultProps = {
children: undefined,
maxWidth: undefined,
width: undefined,
};
Textarea.defaultProps = {
children: undefined,
maxWidth: undefined,
width: undefined,
};

4
src/renderer/components/modal/index.tsx
View file

@ -43,10 +43,6 @@ export const BaseContextModal = ({
modalBody: (vars: ContextModalVars) => React.ReactNode;
}>) => <>{innerProps.modalBody({ context, id })}</>;
Modal.defaultProps = {
children: undefined,
};
interface ConfirmModalProps {
children: ReactNode;
disabled?: boolean;

2
src/renderer/components/page-header/index.tsx
View file

@ -5,7 +5,7 @@ import styled from 'styled-components';
import { useShouldPadTitlebar, useTheme } from '/@/renderer/hooks';
import { useWindowSettings } from '/@/renderer/store/settings.store';
import { Platform } from '/@/renderer/types';
import { Platform } from '/@/shared/types/types';
const Container = styled(motion(Flex))<{
$height?: string;

2
src/renderer/components/query-builder/index.tsx
View file

@ -7,7 +7,7 @@ import { Button } from '/@/renderer/components/button';
import { DropdownMenu } from '/@/renderer/components/dropdown-menu';
import { QueryBuilderOption } from '/@/renderer/components/query-builder/query-builder-option';
import { Select } from '/@/renderer/components/select';
import { QueryBuilderGroup, QueryBuilderRule } from '/@/renderer/types';
import { QueryBuilderGroup, QueryBuilderRule } from '/@/shared/types/types';
const FILTER_GROUP_OPTIONS_DATA = [
{

2
src/renderer/components/query-builder/query-builder-option.tsx
View file

@ -5,7 +5,7 @@ import { RiSubtractLine } from 'react-icons/ri';
import { Button } from '/@/renderer/components/button';
import { NumberInput, TextInput } from '/@/renderer/components/input';
import { Select } from '/@/renderer/components/select';
import { QueryBuilderRule } from '/@/renderer/types';
import { QueryBuilderRule } from '/@/shared/types/types';
type DeleteArgs = {
groupIndex: number[];

1
src/renderer/components/rating/index.tsx
View file

@ -1,4 +1,3 @@
/* eslint-disable jsx-a11y/no-static-element-interactions */
import { Rating as MantineRating, RatingProps } from '@mantine/core';
import debounce from 'lodash/debounce';
import { useCallback } from 'react';

3
src/renderer/components/scroll-area/index.tsx
View file

@ -1,4 +1,3 @@
/* eslint-disable react/display-name */
import type { ScrollAreaProps as MantineScrollAreaProps } from '@mantine/core';
import { ScrollArea as MantineScrollArea } from '@mantine/core';
@ -10,7 +9,7 @@ import styled from 'styled-components';
import { PageHeader, PageHeaderProps } from '/@/renderer/components/page-header';
import { useWindowSettings } from '/@/renderer/store/settings.store';
import { Platform } from '/@/renderer/types';
import { Platform } from '/@/shared/types/types';
const DragContainer = styled.div`
position: absolute;

10
src/renderer/components/select/index.tsx
View file

@ -136,13 +136,3 @@ export const MultiSelect = ({ maxWidth, width, ...props }: MultiSelectProps) =>
/>
);
};
Select.defaultProps = {
maxWidth: undefined,
width: undefined,
};
MultiSelect.defaultProps = {
maxWidth: undefined,
width: undefined,
};

2
src/renderer/components/separator/index.tsx
View file

@ -1,5 +1,5 @@
import { SEPARATOR_STRING } from '/@/renderer/api/utils';
import { Text } from '/@/renderer/components/text';
import { SEPARATOR_STRING } from '/@/shared/api/utils';
export const Separator = () => {
return (

10
src/renderer/components/spinner/index.tsx
View file

@ -1,12 +1,11 @@
import type { IconType } from 'react-icons';
import { Center } from '@mantine/core';
import { IconBaseProps } from 'react-icons';
import { RiLoader5Fill } from 'react-icons/ri';
import styled from 'styled-components';
import { rotating } from '/@/renderer/styles';
interface SpinnerProps extends IconType {
interface SpinnerProps extends IconBaseProps {
color?: string;
container?: boolean;
size?: number;
@ -34,8 +33,3 @@ export const Spinner = ({ ...props }: SpinnerProps) => {
return <SpinnerIcon {...props} />;
};
Spinner.defaultProps = {
color: undefined,
size: 15,
};

9
src/renderer/components/text-title/index.tsx
View file

@ -46,12 +46,3 @@ const _TextTitle = ({ $noSelect, $secondary, children, overflow, ...rest }: Text
};
export const TextTitle = createPolymorphicComponent<'div', TextTitleProps>(_TextTitle);
_TextTitle.defaultProps = {
$link: false,
$noSelect: false,
$secondary: false,
overflow: 'visible',
to: '',
weight: 400,
};

10
src/renderer/components/text/index.tsx
View file

@ -49,13 +49,3 @@ export const _Text = ({ $noSelect, $secondary, children, font, overflow, ...rest
};
export const Text = createPolymorphicComponent<'div', TextProps>(_Text);
_Text.defaultProps = {
$link: false,
$noSelect: false,
$secondary: false,
font: undefined,
overflow: 'visible',
to: '',
weight: 400,
};

7
src/renderer/components/tooltip/index.tsx
View file

@ -38,10 +38,3 @@ export const Tooltip = ({ children, ...rest }: TooltipProps) => {
</StyledTooltip>
);
};
Tooltip.defaultProps = {
openDelay: 0,
position: 'top',
withArrow: true,
withinPortal: true,
};

13
src/renderer/components/virtual-grid/grid-card/default-card.tsx
View file

@ -5,11 +5,18 @@ import { SimpleImg } from 'react-simple-img';
import { ListChildComponentProps } from 'react-window';
import styled from 'styled-components';
import { Album, AlbumArtist, Artist, LibraryItem, Playlist, Song } from '/@/renderer/api/types';
import { CardRows } from '/@/renderer/components/card';
import { Skeleton } from '/@/renderer/components/skeleton';
import { GridCardControls } from '/@/renderer/components/virtual-grid/grid-card/grid-card-controls';
import { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/renderer/types';
import {
Album,
AlbumArtist,
Artist,
LibraryItem,
Playlist,
Song,
} from '/@/shared/types/domain-types';
import { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/shared/types/types';
interface BaseGridCardProps {
columnIndex: number;
@ -142,7 +149,7 @@ export const DefaultCard = ({
if (data) {
const path = generatePath(
controls.route.route,
controls.route.route as string,
controls.route.slugs?.reduce((acc, slug) => {
return {
...acc,

10
src/renderer/components/virtual-grid/grid-card/grid-card-controls.tsx
View file

@ -1,21 +1,19 @@
import type { PlayQueueAddOptions } from '/@/renderer/types';
import type { UnstyledButtonProps } from '@mantine/core';
import React, { MouseEvent, useState } from 'react';
import { RiHeartFill, RiHeartLine, RiMoreFill, RiPlayFill } from 'react-icons/ri';
import styled from 'styled-components';
import { _Button } from '/@/renderer/components/button';
import {
ALBUM_CONTEXT_MENU_ITEMS,
ARTIST_CONTEXT_MENU_ITEMS,
PLAYLIST_CONTEXT_MENU_ITEMS,
} from '../../../features/context-menu/context-menu-items';
import { LibraryItem } from '/@/renderer/api/types';
import { _Button } from '/@/renderer/components/button';
} from '/@/renderer/features/context-menu/context-menu-items';
import { useHandleGridContextMenu } from '/@/renderer/features/context-menu/hooks/use-handle-context-menu';
import { usePlayButtonBehavior } from '/@/renderer/store/settings.store';
import { Play } from '/@/renderer/types';
import { LibraryItem } from '/@/shared/types/domain-types';
import { Play, PlayQueueAddOptions } from '/@/shared/types/types';
type PlayButtonType = React.ComponentPropsWithoutRef<'button'> & UnstyledButtonProps;

6
src/renderer/components/virtual-grid/grid-card/index.tsx
View file

@ -5,7 +5,7 @@ import { areEqual } from 'react-window';
import { DefaultCard } from '/@/renderer/components/virtual-grid/grid-card/default-card';
import { PosterCard } from '/@/renderer/components/virtual-grid/grid-card/poster-card';
import { GridCardData, ListDisplayType } from '/@/renderer/types';
import { CardRow, GridCardData, ListDisplayType } from '/@/shared/types/types';
export const GridCard = memo(({ data, index, style }: ListChildComponentProps) => {
const {
@ -23,7 +23,7 @@ export const GridCard = memo(({ data, index, style }: ListChildComponentProps) =
route,
} = data as GridCardData;
const cards = [];
const cards: React.ReactNode[] = [];
const startIndex = index * columnCount;
const stopIndex = Math.min(itemCount - 1, startIndex + columnCount - 1);
@ -39,7 +39,7 @@ export const GridCard = memo(({ data, index, style }: ListChildComponentProps) =
<View
columnIndex={i}
controls={{
cardRows,
cardRows: cardRows as CardRow<any>[],
handleFavorite,
handlePlayQueueAdd,
itemGap,

13
src/renderer/components/virtual-grid/grid-card/poster-card.tsx
View file

@ -5,11 +5,18 @@ import { SimpleImg } from 'react-simple-img';
import { ListChildComponentProps } from 'react-window';
import styled from 'styled-components';
import { Album, AlbumArtist, Artist, LibraryItem, Playlist, Song } from '/@/renderer/api/types';
import { CardRows } from '/@/renderer/components/card';
import { Skeleton } from '/@/renderer/components/skeleton';
import { GridCardControls } from '/@/renderer/components/virtual-grid/grid-card/grid-card-controls';
import { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/renderer/types';
import {
Album,
AlbumArtist,
Artist,
LibraryItem,
Playlist,
Song,
} from '/@/shared/types/domain-types';
import { CardRoute, CardRow, Play, PlayQueueAddOptions } from '/@/shared/types/types';
interface BaseGridCardProps {
columnIndex: number;
@ -130,7 +137,7 @@ export const PosterCard = ({
if (data) {
const path = generatePath(
controls.route.route,
controls.route.route as string,
controls.route.slugs?.reduce((acc, slug) => {
return {
...acc,

13
src/renderer/components/virtual-grid/virtual-grid-wrapper.tsx
View file

@ -1,4 +1,9 @@
import type { CardRoute, CardRow, ListDisplayType, PlayQueueAddOptions } from '/@/renderer/types';
import type {
CardRoute,
CardRow,
ListDisplayType,
PlayQueueAddOptions,
} from '/@/shared/types/types';
import type { Ref } from 'react';
import type { FixedSizeListProps } from 'react-window';
@ -7,8 +12,8 @@ import memoize from 'memoize-one';
import { FixedSizeList } from 'react-window';
import styled from 'styled-components';
import { Album, AlbumArtist, Artist, LibraryItem } from '/@/renderer/api/types';
import { GridCard } from '/@/renderer/components/virtual-grid/grid-card';
import { Album, AlbumArtist, Artist, LibraryItem } from '/@/shared/types/domain-types';
const createItemData = memoize(
(
@ -123,10 +128,6 @@ export const VirtualGridWrapper = ({
);
};
VirtualGridWrapper.defaultProps = {
route: undefined,
};
export const VirtualGridContainer = styled.div`
display: flex;
flex-direction: column;

12
src/renderer/components/virtual-grid/virtual-infinite-grid.tsx
View file

@ -1,4 +1,4 @@
import type { CardRoute, CardRow, PlayQueueAddOptions } from '/@/renderer/types';
import type { CardRoute, CardRow, PlayQueueAddOptions } from '/@/shared/types/types';
import type { FixedSizeListProps } from 'react-window';
import debounce from 'lodash/debounce';
@ -13,9 +13,9 @@ import {
} from 'react';
import InfiniteLoader from 'react-window-infinite-loader';
import { AnyLibraryItem, Genre, LibraryItem } from '/@/renderer/api/types';
import { VirtualGridWrapper } from '/@/renderer/components/virtual-grid/virtual-grid-wrapper';
import { ListDisplayType } from '/@/renderer/types';
import { AnyLibraryItem, Genre, LibraryItem } from '/@/shared/types/domain-types';
import { ListDisplayType } from '/@/shared/types/types';
export type VirtualInfiniteGridRef = {
resetLoadMoreItemsCache: () => void;
@ -211,9 +211,3 @@ export const VirtualInfiniteGrid = forwardRef(
);
},
);
VirtualInfiniteGrid.defaultProps = {
display: ListDisplayType.CARD,
minimumBatchSize: 20,
route: undefined,
};

2
src/renderer/components/virtual-table/cells/album-artist-cell.tsx
View file

@ -1,4 +1,4 @@
import type { AlbumArtist, Artist } from '/@/renderer/api/types';
import type { AlbumArtist, Artist } from '/@/shared/types/domain-types';
import type { ICellRendererParams } from '@ag-grid-community/core';
import React from 'react';

2
src/renderer/components/virtual-table/cells/artist-cell.tsx
View file

@ -1,4 +1,4 @@
import type { AlbumArtist, Artist } from '/@/renderer/api/types';
import type { AlbumArtist, Artist } from '/@/shared/types/domain-types';
import type { ICellRendererParams } from '@ag-grid-community/core';
import React from 'react';

4
src/renderer/components/virtual-table/cells/combined-title-cell-controls.tsx
View file

@ -4,10 +4,10 @@ import React, { MouseEvent } from 'react';
import { RiPlayFill } from 'react-icons/ri';
import styled from 'styled-components';
import { LibraryItem } from '/@/renderer/api/types';
import { usePlayQueueAdd } from '/@/renderer/features/player';
import { usePlayButtonBehavior } from '/@/renderer/store/settings.store';
import { Play } from '/@/renderer/types';
import { LibraryItem } from '/@/shared/types/domain-types';
import { Play } from '/@/shared/types/types';
type PlayButtonType = React.ComponentPropsWithoutRef<'button'> & UnstyledButtonProps;

4
src/renderer/components/virtual-table/cells/combined-title-cell.tsx
View file

@ -9,12 +9,12 @@ import { Link } from 'react-router-dom';
import { SimpleImg } from 'react-simple-img';
import styled from 'styled-components';
import { AlbumArtist, Artist } from '/@/renderer/api/types';
import { SEPARATOR_STRING } from '/@/renderer/api/utils';
import { Skeleton } from '/@/renderer/components/skeleton';
import { Text } from '/@/renderer/components/text';
import { ListCoverControls } from '/@/renderer/components/virtual-table/cells/combined-title-cell-controls';
import { AppRoute } from '/@/renderer/router/routes';
import { SEPARATOR_STRING } from '/@/shared/api/utils';
import { AlbumArtist, Artist } from '/@/shared/types/domain-types';
const CellContainer = styled(motion.div)<{ height: number }>`
display: grid;

1
src/renderer/components/virtual-table/cells/favorite-cell.tsx
View file

@ -1,4 +1,3 @@
/* eslint-disable import/no-cycle */
import type { ICellRendererParams } from '@ag-grid-community/core';
import { RiHeartFill, RiHeartLine } from 'react-icons/ri';

3
src/renderer/components/virtual-table/cells/full-width-disc-cell.tsx
View file

@ -4,10 +4,9 @@ import { useState } from 'react';
import { RiCheckboxBlankLine, RiCheckboxLine } from 'react-icons/ri';
import styled from 'styled-components';
import { getNodesByDiscNumber, setNodeSelection } from '../utils';
import { Button } from '/@/renderer/components/button';
import { Paper } from '/@/renderer/components/paper';
import { getNodesByDiscNumber, setNodeSelection } from '/@/renderer/components/virtual-table/utils';
const Container = styled(Paper)`
display: flex;

4
src/renderer/components/virtual-table/cells/generic-cell.tsx
View file

@ -71,7 +71,3 @@ export const GenericCell = (
</CellContainer>
);
};
GenericCell.defaultProps = {
position: undefined,
};

2
src/renderer/components/virtual-table/cells/genre-cell.tsx
View file

@ -1,4 +1,4 @@
import type { AlbumArtist, Artist } from '/@/renderer/api/types';
import type { AlbumArtist, Artist } from '/@/shared/types/domain-types';
import type { ICellRendererParams } from '@ag-grid-community/core';
import React from 'react';

1
src/renderer/components/virtual-table/cells/rating-cell.tsx
View file

@ -1,4 +1,3 @@
/* eslint-disable import/no-cycle */
import type { ICellRendererParams } from '@ag-grid-community/core';
import { Rating } from '/@/renderer/components/rating';

5
src/renderer/components/virtual-table/headers/generic-table-header.tsx
View file

@ -97,8 +97,3 @@ export const GenericTableHeader = (
</HeaderWrapper>
);
};
GenericTableHeader.defaultProps = {
position: 'left',
preset: undefined,
};

4
src/renderer/components/virtual-table/hooks/use-current-song-row-styles.ts
View file

@ -3,10 +3,10 @@ import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/li
import { RowClassRules, RowNode } from '@ag-grid-community/core';
import { MutableRefObject, useEffect, useMemo, useRef } from 'react';
import { Song } from '/@/renderer/api/types';
import { useAppFocus } from '/@/renderer/hooks';
import { useCurrentSong, usePlayerStore } from '/@/renderer/store';
import { PlayerStatus } from '/@/renderer/types';
import { Song } from '/@/shared/types/domain-types';
import { PlayerStatus } from '/@/shared/types/types';
interface UseCurrentSongRowStylesProps {
tableRef: MutableRefObject<AgGridReactType | null>;

2
src/renderer/components/virtual-table/hooks/use-fixed-table-header.tsx
View file

@ -2,7 +2,7 @@ import { useInView } from 'framer-motion';
import { useEffect, useRef } from 'react';
import { useWindowSettings } from '/@/renderer/store/settings.store';
import { Platform } from '/@/renderer/types';
import { Platform } from '/@/shared/types/types';
export const useFixedTableHeader = ({ enabled }: { enabled: boolean }) => {
const tableHeaderRef = useRef<HTMLDivElement | null>(null);

17
src/renderer/components/virtual-table/hooks/use-virtual-table.ts
View file

@ -16,21 +16,20 @@ import { MutableRefObject, useCallback, useMemo } from 'react';
import { generatePath, useNavigate } from 'react-router';
import { useSearchParams } from 'react-router-dom';
import { ListKey, useListStoreByKey } from '../../../store/list.store';
import { api } from '/@/renderer/api';
import { queryKeys, QueryPagination } from '/@/renderer/api/query-keys';
import { getColumnDefs, VirtualTableProps } from '/@/renderer/components/virtual-table';
import { SetContextMenuItems, useHandleTableContextMenu } from '/@/renderer/features/context-menu';
import { AppRoute } from '/@/renderer/router/routes';
import { PersistedTableColumn, useListStoreActions } from '/@/renderer/store';
import { ListKey, useListStoreByKey } from '/@/renderer/store/list.store';
import {
BasePaginatedResponse,
BaseQuery,
LibraryItem,
ServerListItem,
} from '/@/renderer/api/types';
import { getColumnDefs, VirtualTableProps } from '/@/renderer/components/virtual-table';
import { SetContextMenuItems, useHandleTableContextMenu } from '/@/renderer/features/context-menu';
import { AppRoute } from '/@/renderer/router/routes';
import { useListStoreActions } from '/@/renderer/store';
import { ListDisplayType, TablePagination } from '/@/renderer/types';
} from '/@/shared/types/domain-types';
import { ListDisplayType, TablePagination } from '/@/shared/types/types';
export type AgGridFetchFn<TResponse, TFilter> = (
args: { filter: TFilter; limit: number; startIndex: number },
@ -295,7 +294,7 @@ export const useVirtualTable = <TFilter extends BaseQuery<any>>({
if (!columnsOrder) return;
const columnsInSettings = properties.table.columns;
const updatedColumns = [];
const updatedColumns: PersistedTableColumn[] = [];
for (const column of columnsOrder) {
const columnInSettings = columnsInSettings.find(
(c) => c.column === column.getColDef().colId,

10
src/renderer/components/virtual-table/index.tsx
View file

@ -39,17 +39,17 @@ import { TablePagination } from '/@/renderer/components/virtual-table/table-pagi
import { useTableChange } from '/@/renderer/hooks/use-song-change';
import { AppRoute } from '/@/renderer/router/routes';
import { PersistedTableColumn } from '/@/renderer/store/settings.store';
import {
PlayerStatus,
TableColumn,
TablePagination as TablePaginationType,
} from '/@/renderer/types';
import {
formatDateAbsolute,
formatDateAbsoluteUTC,
formatDateRelative,
formatSizeString,
} from '/@/renderer/utils/format';
import {
PlayerStatus,
TableColumn,
TablePagination as TablePaginationType,
} from '/@/shared/types/types';
export * from './hooks/use-click-outside-deselect';
export * from './hooks/use-fixed-table-header';

2
src/renderer/components/virtual-table/table-config-dropdown.tsx
View file

@ -8,7 +8,7 @@ import { MultiSelect } from '/@/renderer/components/select';
import { Slider } from '/@/renderer/components/slider';
import { Switch } from '/@/renderer/components/switch';
import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store/settings.store';
import { TableColumn, TableType } from '/@/renderer/types';
import { TableColumn, TableType } from '/@/shared/types/types';
export const SONG_TABLE_COLUMNS = [
{

5
src/renderer/components/virtual-table/table-pagination.tsx
View file

@ -7,16 +7,15 @@ import { MutableRefObject } from 'react';
import { useTranslation } from 'react-i18next';
import { RiHashtag } from 'react-icons/ri';
import { MotionFlex } from '../motion';
import { Button } from '/@/renderer/components/button';
import { NumberInput } from '/@/renderer/components/input';
import { MotionFlex } from '/@/renderer/components/motion';
import { Pagination } from '/@/renderer/components/pagination';
import { Popover } from '/@/renderer/components/popover';
import { Text } from '/@/renderer/components/text';
import { useContainerQuery } from '/@/renderer/hooks';
import { ListKey } from '/@/renderer/store';
import { TablePagination as TablePaginationType } from '/@/renderer/types';
import { TablePagination as TablePaginationType } from '/@/shared/types/types';
interface TablePaginationProps {
pageKey: ListKey;