diff --git a/src/semantic-ui/DataTable.js b/src/semantic-ui/DataTable.js index 7e381d4f..571b18c6 100644 --- a/src/semantic-ui/DataTable.js +++ b/src/semantic-ui/DataTable.js @@ -339,12 +339,25 @@ class DataTable extends Component { */ onDrag(dragIndex: number, hoverIndex: number) { this.setState((state) => { - const columns = [...state.columns]; - const column = columns[dragIndex]; + const columns = []; + const anchoredColumns = []; + + // Preserve the index of any unlabeled columns + _.each(state.columns, (column, index) => { + if (column.label && column.label.length) { + columns.push(column); + } else { + anchoredColumns.push({ index, column }); + } + }); + const column = columns[dragIndex]; columns.splice(dragIndex, 1); columns.splice(hoverIndex, 0, column); + // Add the unlabeled columns back in + _.each(anchoredColumns, (c) => columns.splice(c.index, 0, c.column)); + return { columns }; }); } @@ -649,25 +662,27 @@ class DataTable extends Component { simple > - { this.state.columns.map((c, index) => ( - - - - - - - ))} + { this.state.columns + .filter((c) => c.label && c.label.length) + .map((c, index) => ( + + + + + + + ))} ); diff --git a/stories/components/semantic-ui/EmbeddedList.stories.js b/stories/components/semantic-ui/EmbeddedList.stories.js index 2648230b..1b6b9903 100644 --- a/stories/components/semantic-ui/EmbeddedList.stories.js +++ b/stories/components/semantic-ui/EmbeddedList.stories.js @@ -2,7 +2,7 @@ import React, { useState } from 'react'; import { withA11y } from '@storybook/addon-a11y'; import { action } from '@storybook/addon-actions'; import { withKnobs, optionsKnob as options } from '@storybook/addon-knobs'; -import { Button, Container } from 'semantic-ui-react'; +import { Button, Container, Icon } from 'semantic-ui-react'; import _ from 'underscore'; import AddModal from '../AddModal'; import Colors from '../../services/Colors'; @@ -170,7 +170,15 @@ export const DragAndDropRows = useDragDrop(() => { ( +
+ +
) + }, ...columns]} items={list} onDrag={(dragIndex, hoverIndex) => { const temp = [...list];