Skip to content

Commit 2b7f20f

Browse files
authored
feat: add option to auto-sort columns alphabetically (#2252)
1 parent 9fecc43 commit 2b7f20f

File tree

3 files changed

+22
-2
lines changed

3 files changed

+22
-2
lines changed

src/components/ColumnsConfiguration/ColumnConfigurationItem.scss

-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@
1818
}
1919

2020
.columnConfigItemName {
21-
width: 110px;
2221
text-overflow: ellipsis;
2322
overflow: hidden;
2423
line-height: 24px;

src/components/ColumnsConfiguration/ColumnsConfiguration.react.js

+21
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,23 @@ export default class ColumnsConfiguration extends React.Component {
5454
this.props.handleColumnsOrder(this.props.order.map(order => ({ ...order, visible: false })));
5555
}
5656

57+
autoSort() {
58+
const defaultOrder = ['objectId', 'createdAt', 'updatedAt', 'ACL']
59+
const order = {
60+
default: [],
61+
other: []
62+
};
63+
for (const column of this.props.order) {
64+
const index = defaultOrder.indexOf(column.name);
65+
if (index !== -1) {
66+
order.default[index] = column;
67+
} else {
68+
order.other.push(column)
69+
}
70+
}
71+
this.props.handleColumnsOrder([...order.default.filter(column => column), ...order.other.sort((a,b) => a.name.localeCompare(b.name))]);
72+
}
73+
5774
render() {
5875
const { handleColumnDragDrop, handleColumnsOrder, order, disabled } = this.props;
5976
let [ title, entry ] = [styles.title, styles.entry ].map(className => (
@@ -118,6 +135,10 @@ export default class ColumnsConfiguration extends React.Component {
118135
color='white'
119136
value='Show all'
120137
onClick={this.showAll.bind(this)} />
138+
<Button
139+
color='white'
140+
value='Autosort'
141+
onClick={this.autoSort.bind(this)} />
121142
</div>
122143
</div>
123144
</div>

src/components/ColumnsConfiguration/ColumnsConfiguration.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@
6464
right: 0;
6565
border-radius: 5px 0 5px 5px;
6666
background: #797691;
67-
width: 220px;
67+
width: 320px;
6868
font-size: 14px;
6969

7070
.columnConfigContainer {

0 commit comments

Comments
 (0)