diff --git a/src/renderer/features/player/components/full-screen-player-queue.module.css b/src/renderer/features/player/components/full-screen-player-queue.module.css
index 4dac78596..9f0650b8c 100644
--- a/src/renderer/features/player/components/full-screen-player-queue.module.css
+++ b/src/renderer/features/player/components/full-screen-player-queue.module.css
@@ -1,7 +1,10 @@
.queue-container {
position: relative;
display: flex;
+ width: 100%;
+ min-width: 0;
height: 100%;
+ overflow: hidden;
:global(.ag-header) {
display: none;
@@ -46,6 +49,8 @@
display: grid;
grid-template-rows: auto minmax(0, 1fr);
grid-template-columns: 1fr;
+ width: 100%;
+ min-width: 0;
padding: 1rem;
&::before {
diff --git a/src/renderer/features/player/components/full-screen-player.tsx b/src/renderer/features/player/components/full-screen-player.tsx
index 2bc0cca98..4d2a3fa92 100644
--- a/src/renderer/features/player/components/full-screen-player.tsx
+++ b/src/renderer/features/player/components/full-screen-player.tsx
@@ -5,8 +5,10 @@ import { useLocation } from 'react-router';
import styles from './full-screen-player.module.css';
+import { SONG_TABLE_COLUMNS } from '/@/renderer/components/item-list/item-table-list/default-columns';
import { FullScreenPlayerImage } from '/@/renderer/features/player/components/full-screen-player-image';
import { FullScreenPlayerQueue } from '/@/renderer/features/player/components/full-screen-player-queue';
+import { ListConfigMenu } from '/@/renderer/features/shared/components/list-config-menu';
import { useFastAverageColor } from '/@/renderer/hooks';
import {
useFullScreenPlayerStore,
@@ -27,7 +29,7 @@ import { Select } from '/@/shared/components/select/select';
import { Slider } from '/@/shared/components/slider/slider';
import { Switch } from '/@/shared/components/switch/switch';
import { useHotkeys } from '/@/shared/hooks/use-hotkeys';
-import { Platform } from '/@/shared/types/types';
+import { ItemListKey, ListDisplayType, Platform } from '/@/shared/types/types';
const mainBackground = 'var(--theme-colors-background)';
@@ -85,7 +87,7 @@ const Controls = ({ isPageHovered }: ControlsProps) => {
{
+
);
};
diff --git a/src/renderer/features/shared/components/list-config-menu.tsx b/src/renderer/features/shared/components/list-config-menu.tsx
index 9d2d3e542..f350fea0d 100644
--- a/src/renderer/features/shared/components/list-config-menu.tsx
+++ b/src/renderer/features/shared/components/list-config-menu.tsx
@@ -6,6 +6,7 @@ import { GridConfig } from '/@/renderer/features/shared/components/grid-config';
import { SettingsButton } from '/@/renderer/features/shared/components/settings-button';
import { TableConfig } from '/@/renderer/features/shared/components/table-config';
import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store';
+import { ActionIconProps } from '/@/shared/components/action-icon/action-icon';
import { Divider } from '/@/shared/components/divider/divider';
import { Group } from '/@/shared/components/group/group';
import { Icon } from '/@/shared/components/icon/icon';
@@ -99,6 +100,7 @@ export interface ListConfigMenuOptionsConfig {
}
interface ListConfigMenuProps {
+ buttonProps?: ActionIconProps;
displayTypes?: ListConfigMenuDisplayTypeConfig[];
listKey: ItemListKey;
optionsConfig?: ListConfigMenuOptionsConfig;
@@ -138,7 +140,7 @@ export const ListConfigMenu = (props: ListConfigMenuProps) => {
return (
<>
-
+
{
- const tableRef = useRef(null);
- // const tableConfig = useTableSettings(fullScreen ? 'fullScreen' : 'songs');
-
+export const SimilarSongsList = ({ count, song }: SimilarSongsListProps) => {
const songQuery = useQuery(
songsQueries.similar({
options: {
@@ -32,16 +34,44 @@ export const SimilarSongsList = ({ count, fullScreen, song }: SimilarSongsListPr
}),
);
- // const columnDefs = useMemo(
- // () => getColumnDefs(tableConfig.columns, false, 'generic'),
- // [tableConfig.columns],
- // );
+ const { table } = useListSettings(ItemListKey.SONG);
+ const { table: fullScreenTable } = useListSettings(ItemListKey.FULL_SCREEN);
- // const onCellContextMenu = useHandleTableContextMenu(LibraryItem.SONG, SONG_CONTEXT_MENU_ITEMS);
+ const { handleColumnReordered } = useItemListColumnReorder({
+ itemListKey: ItemListKey.SONG,
+ });
- return songQuery.isLoading ? (
-
- ) : (
-
+ const { handleColumnResized } = useItemListColumnResize({
+ itemListKey: ItemListKey.SONG,
+ });
+
+ const tableData = useMemo(() => {
+ return songQuery.data || [];
+ }, [songQuery.data]);
+
+ if (songQuery.isLoading || songQuery.isRefetching) {
+ return ;
+ }
+
+ return (
+
+
+
);
};
diff --git a/src/shared/components/icon/icon.tsx b/src/shared/components/icon/icon.tsx
index 5e8ce6148..7d4036388 100644
--- a/src/shared/components/icon/icon.tsx
+++ b/src/shared/components/icon/icon.tsx
@@ -82,6 +82,7 @@ import {
LuRotateCw,
LuSave,
LuSearch,
+ LuSettings,
LuSettings2,
LuShare2,
LuShieldAlert,
@@ -207,6 +208,7 @@ export const AppIcon = {
search: LuSearch,
server: LuHardDrive,
settings: LuSettings2,
+ settings2: LuSettings,
share: LuShare2,
signIn: LuLogIn,
signOut: LuLogOut,