reimplement fullscreen player

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 {

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) => {
             <Popover position="bottom-start">
                 <Popover.Target>
                     <ActionIcon
-                        icon="settings"
+                        icon="settings2"
                         iconProps={{ size: 'lg' }}
                         tooltip={{ label: t('common.configure', { postProcess: 'titleCase' }) }}
                         variant={isPageHovered ? 'default' : 'subtle'}
@@ -349,6 +351,20 @@ const Controls = ({ isPageHovered }: ControlsProps) => {
                     <Divider my="sm" />
                 </Popover.Dropdown>
             </Popover>
+            <ListConfigMenu
+                buttonProps={{
+                    variant: isPageHovered ? 'default' : 'subtle',
+                }}
+                displayTypes={[{ hidden: true, value: ListDisplayType.GRID }]}
+                listKey={ItemListKey.FULL_SCREEN}
+                optionsConfig={{
+                    table: {
+                        itemsPerPage: { hidden: true },
+                        pagination: { hidden: true },
+                    },
+                }}
+                tableColumnsData={SONG_TABLE_COLUMNS}
+            />
         </Group>
     );
 };