vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-07 04:20:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix drag styles on playlist reorder

Browse Source
This commit is contained in:
jeffvli
2025-12-07 00:20:27 -08:00
parent e84d5eca8f
commit 9385c25ea9
2 changed files with 24 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/item-list/item-table-list/columns/playlist-reorder-column.module.css
+3
View File
@@ -0,0 +1,3 @@
.group {
justify-content: center;
}
src/renderer/components/item-list/item-table-list/columns/playlist-reorder-column.tsx
+21 -3
View File
@@ -2,7 +2,10 @@ import { useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { useParams } from 'react-router';
import styles from './playlist-reorder-column.module.css';
import { getDraggedItems } from '/@/renderer/components/item-list/helpers/get-dragged-items';
import { useItemDraggingState } from '/@/renderer/components/item-list/helpers/item-list-state';
import {
ItemTableListInnerColumn,
TableColumnContainer,
@@ -25,7 +28,11 @@ export const PlaylistReorderColumn = (props: ItemTableListInnerColumn) => {
const isPlaylistSong = props.itemType === LibraryItem.PLAYLIST_SONG;
const { isDraggedOver, ref: dragRef } = useDragDrop<HTMLButtonElement>({
const {
isDraggedOver,
isDragging: isDraggingLocal,
ref: dragRef,
} = useDragDrop<HTMLButtonElement>({
drag: {
getId: () => {
if (!item || !isDataRow || !isPlaylistSong) {
@@ -134,6 +141,17 @@ export const PlaylistReorderColumn = (props: ItemTableListInnerColumn) => {
const draggedOverEdge: 'bottom' | 'top' | null =
isDraggedOver === 'top' || isDraggedOver === 'bottom' ? isDraggedOver : null;
const itemRowId =
item && typeof item === 'object' && 'id' in item && props.internalState
? props.internalState.extractRowId(item)
: undefined;
const isDraggingState = useItemDraggingState(
props.internalState,
itemRowId ||
(item && typeof item === 'object' && 'id' in item ? (item as any).id : undefined),
);
const isDragging = props.internalState ? isDraggingState : isDraggingLocal;
const getValidDataItems = useCallback(() => {
return props.data.filter((d) => d !== null && (d as any).id);
}, [props.data]);
@@ -281,8 +299,8 @@ export const PlaylistReorderColumn = (props: ItemTableListInnerColumn) => {
});
return (
<TableColumnContainer {...props} isDraggedOver={draggedOverEdge}>
<ActionIconGroup w="100%">
<TableColumnContainer {...props} isDraggedOver={draggedOverEdge} isDragging={isDragging}>
<ActionIconGroup className={styles.group} w="100%">
<ActionIcon
{...upButtonHandlers}
icon="arrowUp"