Skip to content
This repository was archived by the owner on Jul 28, 2025. It is now read-only.

Commit 03ccbf0

Browse files
committed
looks like fixed
1 parent e36795f commit 03ccbf0

File tree

3 files changed

+133
-100
lines changed

3 files changed

+133
-100
lines changed

src/cdm/FolderModel.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ export interface BaseColumn {
4949
position?: number;
5050
isMetadata?: boolean;
5151
skipPersist?: boolean;
52+
isDragDisabled?: boolean;
5253
config: ConfigColumn;
5354
}
5455
export interface TableColumn extends BaseColumn {

src/components/Table.tsx

Lines changed: 126 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -260,110 +260,136 @@ export function Table(initialState: TableDataType) {
260260
/>
261261
{/** Headers */}
262262
{headerGroups.map((headerGroup, i) => (
263-
<DragDropContext
264-
key={`DragDropContext-${i}`}
265-
onDragStart={() => {
266-
console.log(headerGroup.headers);
267-
currentColOrder.current = allColumns.map((o: Column) => o.id);
268-
}}
269-
onDragUpdate={(dragUpdateObj, b) => {
270-
const colOrder = [...currentColOrder.current];
271-
const sIndex = dragUpdateObj.source.index;
272-
const dIndex =
273-
dragUpdateObj.destination && dragUpdateObj.destination.index;
263+
<div
264+
{...headerGroup.getHeaderGroupProps({
265+
style: {
266+
width:
267+
totalWidth -
268+
columnsWidthState.widthRecord[MetadataColumns.ADD_COLUMN],
269+
},
270+
})}
271+
>
272+
<DragDropContext
273+
key={`DragDropContext-${i}`}
274+
onDragStart={() => {
275+
currentColOrder.current = allColumns.map((o: Column) => o.id);
276+
}}
277+
onDragUpdate={(dragUpdateObj, b) => {
278+
const colOrder = [...currentColOrder.current];
279+
const sIndex = dragUpdateObj.source.index;
280+
const dIndex =
281+
dragUpdateObj.destination &&
282+
dragUpdateObj.destination.index;
274283

275-
if (typeof sIndex === "number" && typeof dIndex === "number") {
276-
colOrder.splice(sIndex, 1);
277-
colOrder.splice(dIndex, 0, dragUpdateObj.draggableId);
278-
setColumnOrder(colOrder);
279-
}
280-
}}
281-
onDragEnd={(result) => {
282-
// save on disk in case of changes
283-
if (result.source.index !== result.destination!.index) {
284-
initialState.view.diskConfig.reorderColumns(
285-
(state as any).columnOrder
286-
);
287-
}
284+
if (
285+
typeof sIndex === "number" &&
286+
typeof dIndex === "number"
287+
) {
288+
colOrder.splice(sIndex, 1);
289+
colOrder.splice(dIndex, 0, dragUpdateObj.draggableId);
290+
setColumnOrder(colOrder);
291+
}
292+
}}
293+
onDragEnd={(result) => {
294+
// save on disk in case of changes
295+
if (result.source.index !== result.destination!.index) {
296+
initialState.view.diskConfig.reorderColumns(
297+
(state as any).columnOrder
298+
);
299+
}
288300

289-
// clear the current order
290-
currentColOrder.current = null;
291-
}}
292-
>
293-
<Droppable
294-
key={`Droppable-${i}`}
295-
droppableId="droppable"
296-
direction="horizontal"
301+
// clear the current order
302+
currentColOrder.current = null;
303+
}}
297304
>
298-
{(provided, snapshot) => (
299-
<div
300-
key={`div-Droppable-${i}`}
301-
{...provided.droppableProps}
302-
{...headerGroup.getHeaderGroupProps({
303-
style: {
304-
...getDndListStyle(snapshot.isDraggingOver),
305-
width:
306-
totalWidth -
307-
columnsWidthState.widthRecord[
308-
MetadataColumns.ADD_COLUMN
309-
],
310-
},
311-
})}
312-
ref={provided.innerRef}
313-
className={`${c("tr header-group")}`}
314-
>
315-
{headerGroup.headers
316-
.filter((o: any) => o.key !== MetadataColumns.ADD_COLUMN)
317-
.map((column, index) => (
318-
<Draggable
319-
key={`Draggable-${column.id}`}
320-
draggableId={`${column.id}`}
321-
index={index}
322-
isDragDisabled={(column as any).skipPersist}
323-
disableInteractiveElementBlocking={
324-
(column as any).skipPersist
325-
}
326-
>
327-
{(provided, snapshot) => {
328-
const tableCellBaseProps = {
329-
...provided.draggableProps,
330-
...provided.dragHandleProps,
331-
...column.getHeaderProps({
332-
style: {
333-
width: `${
334-
columnsWidthState.widthRecord[column.id]
335-
}px`,
336-
...getDndItemStyle(
337-
snapshot.isDragging,
338-
provided.draggableProps.style
339-
),
340-
},
341-
}),
342-
className: `${c("th noselect")} header`,
343-
key: `div-Draggable-${column.id}`,
344-
// {...extraProps}
345-
ref: provided.innerRef,
346-
};
347-
return (
348-
<div {...tableCellBaseProps}>
349-
<HeaderContext.Provider
350-
value={{
351-
columnWidthState: columnsWidthState,
352-
setColumnWidthState: setColumnsWidthState,
353-
}}
354-
>
355-
{column.render("Header")}
356-
</HeaderContext.Provider>
357-
</div>
358-
);
359-
}}
360-
</Draggable>
361-
))}
362-
{provided.placeholder}
305+
<Droppable
306+
key={`Droppable-${i}`}
307+
droppableId="droppable"
308+
direction="horizontal"
309+
>
310+
{(provided, snapshot) => (
311+
<div
312+
key={`div-Droppable-${i}`}
313+
{...provided.droppableProps}
314+
{...headerGroup.getHeaderGroupProps({
315+
style: {
316+
...getDndListStyle(snapshot.isDraggingOver),
317+
},
318+
})}
319+
ref={provided.innerRef}
320+
className={`${c("tr header-group")}`}
321+
>
322+
{headerGroup.headers
323+
.filter(
324+
(o: any) => o.key !== MetadataColumns.ADD_COLUMN
325+
)
326+
.map((column, index) => (
327+
<Draggable
328+
key={`Draggable-${column.id}`}
329+
draggableId={`${column.id}`}
330+
index={index}
331+
isDragDisabled={
332+
(column as unknown as TableColumn).isDragDisabled
333+
}
334+
disableInteractiveElementBlocking={
335+
(column as unknown as TableColumn).isDragDisabled
336+
}
337+
>
338+
{(provided, snapshot) => {
339+
const tableCellBaseProps = {
340+
...provided.draggableProps,
341+
...provided.dragHandleProps,
342+
...column.getHeaderProps({
343+
style: {
344+
width: `${
345+
columnsWidthState.widthRecord[column.id]
346+
}px`,
347+
...getDndItemStyle(
348+
snapshot.isDragging,
349+
provided.draggableProps.style
350+
),
351+
},
352+
}),
353+
className: `${c("th noselect")} header`,
354+
key: `div-Draggable-${column.id}`,
355+
// {...extraProps}
356+
ref: provided.innerRef,
357+
};
358+
return (
359+
<div {...tableCellBaseProps}>
360+
<HeaderContext.Provider
361+
value={{
362+
columnWidthState: columnsWidthState,
363+
setColumnWidthState: setColumnsWidthState,
364+
}}
365+
>
366+
{column.render("Header")}
367+
</HeaderContext.Provider>
368+
</div>
369+
);
370+
}}
371+
</Draggable>
372+
))}
373+
{provided.placeholder}
374+
</div>
375+
)}
376+
</Droppable>
377+
</DragDropContext>
378+
{headerGroup.headers
379+
.filter((o: any) => o.key === MetadataColumns.ADD_COLUMN)
380+
.map((column, index) => (
381+
<div {...column.getHeaderProps()}>
382+
<HeaderContext.Provider
383+
value={{
384+
columnWidthState: columnsWidthState,
385+
setColumnWidthState: setColumnsWidthState,
386+
}}
387+
>
388+
{column.render("Header")}
389+
</HeaderContext.Provider>
363390
</div>
364-
)}
365-
</Droppable>
366-
</DragDropContext>
391+
))}
392+
</div>
367393
))}
368394
</div>
369395
{/** Body */}

src/helpers/Constants.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,7 @@ export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
7373
accessor: MetadataColumns.FILE,
7474
isMetadata: true,
7575
skipPersist: false,
76+
isDragDisabled: false,
7677
csvCandidate: true,
7778
config: DEFAULT_COLUMN_CONFIG
7879
},
@@ -82,6 +83,7 @@ export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
8283
label: MetadataLabels.ADD_COLUMN,
8384
accessor: MetadataColumns.ADD_COLUMN,
8485
isMetadata: true,
86+
isDragDisabled: true,
8587
skipPersist: true,
8688
csvCandidate: false,
8789
config: DEFAULT_COLUMN_CONFIG
@@ -92,6 +94,7 @@ export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
9294
label: MetadataLabels.CREATED,
9395
accessor: MetadataColumns.CREATED,
9496
isMetadata: true,
97+
isDragDisabled: false,
9598
skipPersist: false,
9699
csvCandidate: true,
97100
config: DEFAULT_COLUMN_CONFIG
@@ -102,6 +105,7 @@ export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
102105
label: MetadataLabels.MODIFIED,
103106
accessor: MetadataColumns.MODIFIED,
104107
isMetadata: true,
108+
isDragDisabled: false,
105109
skipPersist: false,
106110
csvCandidate: true,
107111
config: DEFAULT_COLUMN_CONFIG
@@ -112,6 +116,7 @@ export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
112116
label: MetadataLabels.TASK,
113117
accessor: MetadataColumns.TASKS,
114118
isMetadata: true,
119+
isDragDisabled: false,
115120
skipPersist: true,
116121
csvCandidate: false,
117122
config: DEFAULT_COLUMN_CONFIG
@@ -122,6 +127,7 @@ export const TableColumnsTemplate: Partial<TableColumn> =
122127
{
123128
isMetadata: false,
124129
skipPersist: false,
130+
isDragDisabled: false,
125131
options: [],
126132
csvCandidate: true,
127133
}

0 commit comments

Comments
 (0)