diff --git a/packages/desktop-client/src/components/budget/ExpenseGroup.js b/packages/desktop-client/src/components/budget/ExpenseGroup.tsx similarity index 73% rename from packages/desktop-client/src/components/budget/ExpenseGroup.js rename to packages/desktop-client/src/components/budget/ExpenseGroup.tsx index 217f36531cb..12b011e0c1d 100644 --- a/packages/desktop-client/src/components/budget/ExpenseGroup.js +++ b/packages/desktop-client/src/components/budget/ExpenseGroup.tsx @@ -1,13 +1,36 @@ -import React from 'react'; +import React, { type ComponentProps } from 'react'; import { theme } from '../../style'; import View from '../common/View'; -import { useDraggable, useDroppable, DropHighlight } from '../sort'; +import { + useDraggable, + useDroppable, + DropHighlight, + type OnDragChangeCallback, + type OnDropCallback, + type DragState, +} from '../sort'; import { Row, ROW_HEIGHT } from '../table'; import RenderMonths from './RenderMonths'; import SidebarGroup from './SidebarGroup'; +type ExpenseGroupProps = { + group: ComponentProps['group']; + collapsed: boolean; + editingCell: { id: string; cell: string } | null; + dragState: DragState; + MonthComponent: ComponentProps['component']; + onEditName?: ComponentProps['onEdit']; + onSave?: ComponentProps['onSave']; + onDelete?: ComponentProps['onDelete']; + onDragChange: OnDragChangeCallback; + onReorderGroup: OnDropCallback; + onReorderCategory: OnDropCallback; + onToggleCollapse?: ComponentProps['onToggleCollapse']; + onShowNewCategory?: ComponentProps['onShowNewCategory']; +}; + function ExpenseGroup({ group, collapsed, @@ -22,7 +45,7 @@ function ExpenseGroup({ onReorderCategory, onToggleCollapse, onShowNewCategory, -}) { +}: ExpenseGroupProps) { let dragging = dragState && dragState.item === group; let { dragRef } = useDraggable({ diff --git a/packages/desktop-client/src/components/budget/SidebarGroup.tsx b/packages/desktop-client/src/components/budget/SidebarGroup.tsx index 03969ced3ca..682ebd92917 100644 --- a/packages/desktop-client/src/components/budget/SidebarGroup.tsx +++ b/packages/desktop-client/src/components/budget/SidebarGroup.tsx @@ -24,7 +24,7 @@ type SidebarGroupProps = { }; editing?: boolean; collapsed: boolean; - dragPreview?: () => void; + dragPreview?: boolean; innerRef?: ConnectDragSource; borderColor?: string; style?: CSSProperties; diff --git a/packages/desktop-client/src/components/sort.tsx b/packages/desktop-client/src/components/sort.tsx index 1d9fa4286f6..d4b157abe36 100644 --- a/packages/desktop-client/src/components/sort.tsx +++ b/packages/desktop-client/src/components/sort.tsx @@ -14,10 +14,11 @@ import { theme } from '../style'; import View from './common/View'; -type DragState = { +export type DragState = { state: 'start-preview' | 'start' | 'end'; type?: string; item?: unknown; + preview?: boolean; }; export type DropPosition = 'top' | 'bottom';