remove scroll shadows from fullscreen player

src/renderer/components/item-list/item-table-list/item-table-list.tsx

@@ -103,6 +103,7 @@ interface VirtualizedTableGridProps {
     enableHeader: boolean;
     enableHorizontalBorders: boolean;
     enableRowHoverHighlight: boolean;
+    enableScrollShadow: boolean;
     enableSelection: boolean;
     enableVerticalBorders: boolean;
     getRowHeight: (index: number, cellProps: TableItemProps) => number;
@@ -146,6 +147,7 @@ const VirtualizedTableGrid = ({
     enableHeader,
     enableHorizontalBorders,
     enableRowHoverHighlight,
+    enableScrollShadow,
     enableSelection,
     enableVerticalBorders,
     getRowHeight,
@@ -429,7 +431,7 @@ const VirtualizedTableGrid = ({
                         />
                     </div>
                 )}
-                {enableHeader && showTopShadow && (
+                {enableHeader && enableScrollShadow && showTopShadow && (
                     <div className={styles.itemTableTopScrollShadow} />
                 )}
                 {!!pinnedLeftColumnCount && (
@@ -489,7 +491,7 @@ const VirtualizedTableGrid = ({
                         />
                     </div>
                 )}
-                {enableHeader && showTopShadow && (
+                {enableHeader && enableScrollShadow && showTopShadow && (
                     <div className={styles.itemTableTopScrollShadow} />
                 )}
                 <div className={styles.itemTableGridContainer} ref={mergedRowRef}>
@@ -507,10 +509,10 @@ const VirtualizedTableGrid = ({
                             return getRowHeight(index + pinnedRowCount, cellProps);
                         }}
                     />
-                    {pinnedLeftColumnCount > 0 && showLeftShadow && (
+                    {pinnedLeftColumnCount > 0 && enableScrollShadow && showLeftShadow && (
                         <div className={styles.itemTableLeftScrollShadow} />
                     )}
-                    {pinnedRightColumnCount > 0 && showRightShadow && (
+                    {pinnedRightColumnCount > 0 && enableScrollShadow && showRightShadow && (
                         <div className={styles.itemTableRightScrollShadow} />
                     )}
                 </div>
@@ -560,7 +562,7 @@ const VirtualizedTableGrid = ({
                             />
                         </div>
                     )}
-                    {enableHeader && showTopShadow && (
+                    {enableHeader && enableScrollShadow && showTopShadow && (
                         <div className={styles.itemTableTopScrollShadow} />
                     )}
                     <div
@@ -607,6 +609,7 @@ const MemoizedVirtualizedTableGrid = memo(VirtualizedTableGrid, (prevProps, next
         prevProps.enableHeader === nextProps.enableHeader &&
         prevProps.enableHorizontalBorders === nextProps.enableHorizontalBorders &&
         prevProps.enableRowHoverHighlight === nextProps.enableRowHoverHighlight &&
+        prevProps.enableScrollShadow === nextProps.enableScrollShadow &&
         prevProps.enableSelection === nextProps.enableSelection &&
         prevProps.enableVerticalBorders === nextProps.enableVerticalBorders &&
         prevProps.getRowHeight === nextProps.getRowHeight &&
@@ -695,6 +698,7 @@ interface ItemTableListProps {
     enableHeader?: boolean;
     enableHorizontalBorders?: boolean;
     enableRowHoverHighlight?: boolean;
+    enableScrollShadow?: boolean;
     enableSelection?: boolean;
     enableSelectionDialog?: boolean;
     enableStickyGroupRows?: boolean;
@@ -737,6 +741,7 @@ const BaseItemTableList = ({
     enableHeader = true,
     enableHorizontalBorders = false,
     enableRowHoverHighlight = true,
+    enableScrollShadow = true,
     enableSelection = true,
     enableStickyGroupRows = false,
     enableStickyHeader = false,
@@ -2386,6 +2391,7 @@ const BaseItemTableList = ({
                 enableHeader={enableHeader}
                 enableHorizontalBorders={enableHorizontalBorders}
                 enableRowHoverHighlight={enableRowHoverHighlight}
+                enableScrollShadow={enableScrollShadow}
                 enableSelection={enableSelection}
                 enableVerticalBorders={enableVerticalBorders}
                 getRowHeight={getRowHeight}

src/renderer/features/now-playing/components/play-queue.tsx

@@ -39,11 +39,13 @@ import { DragTarget } from '/@/shared/types/drag-and-drop';
 import { ItemListKey, Play, PlayerQueueType } from '/@/shared/types/types';
 
 type QueueProps = {
+    enableScrollShadow?: boolean;
     listKey: ItemListKey;
     searchTerm: string | undefined;
 };
 
-export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, searchTerm }, ref) => {
+export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(
+    ({ enableScrollShadow = true, listKey, searchTerm }, ref) => {
         const { table } = useListSettings(listKey) || {};
 
         const isFetching = useIsPlayerFetching();
@@ -64,7 +66,11 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
 
                 setData(queue.items);
 
-            if (queueType === PlayerQueueType.PRIORITY && queue.groups && queue.groups.length > 0) {
+                if (
+                    queueType === PlayerQueueType.PRIORITY &&
+                    queue.groups &&
+                    queue.groups.length > 0
+                ) {
                     const transformedGroups: TableGroupHeader[] = queue.groups.map((group) => ({
                         itemCount: group.count,
                         render: (): ReactElement => {
@@ -196,6 +202,7 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
                     enableHeader
                     enableHorizontalBorders={table.enableHorizontalBorders}
                     enableRowHoverHighlight={table.enableRowHoverHighlight}
+                    enableScrollShadow={enableScrollShadow}
                     enableSelection
                     enableSelectionDialog={false}
                     enableVerticalBorders={table.enableVerticalBorders}
@@ -214,7 +221,8 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
                 {isEmpty && <EmptyQueueDropZone />}
             </div>
         );
-});
+    },
+);
 
 const EmptyQueueDropZone = () => {
     const playerContext = usePlayer();

src/renderer/features/player/components/full-screen-player-queue.tsx

@@ -106,7 +106,11 @@ export const FullScreenPlayerQueue = () => {
             </Group>
             {activeTab === 'queue' ? (
                 <div className={styles.queueContainer}>
-                    <PlayQueue listKey={ItemListKey.FULL_SCREEN} searchTerm={undefined} />
+                    <PlayQueue
+                        enableScrollShadow={false}
+                        listKey={ItemListKey.FULL_SCREEN}
+                        searchTerm={undefined}
+                    />
                 </div>
             ) : activeTab === 'related' ? (
                 <div className={styles.queueContainer}>

src/renderer/features/similar-songs/components/similar-songs-list.tsx

@@ -64,6 +64,7 @@ export const SimilarSongsList = ({ count, song }: SimilarSongsListProps) => {
                 enableHeader
                 enableHorizontalBorders={fullScreenTable?.enableHorizontalBorders}
                 enableRowHoverHighlight={fullScreenTable?.enableRowHoverHighlight}
+                enableScrollShadow={false}
                 enableSelection
                 enableSelectionDialog={false}
                 enableVerticalBorders={fullScreenTable?.enableVerticalBorders}