You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ru...@apache.org on 2021/12/15 18:50:01 UTC
[superset] branch master updated: fix(plugin-chart-table): sort alphanumeric columns case insensitive (#17765)
This is an automated email from the ASF dual-hosted git repository.
rusackas pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 82b47ca fix(plugin-chart-table): sort alphanumeric columns case insensitive (#17765)
82b47ca is described below
commit 82b47cacba9653c7837c361be65e10520e9068b3
Author: Kamil Gabryjelski <ka...@gmail.com>
AuthorDate: Wed Dec 15 19:48:25 2021 +0100
fix(plugin-chart-table): sort alphanumeric columns case insensitive (#17765)
---
.../plugin-chart-table/src/DataTable/DataTable.tsx | 6 +
.../utils/sortAlphanumericCaseInsensitive.ts | 37 ++++++
.../test/sortAlphanumericCaseInsensitive.test.ts | 135 +++++++++++++++++++++
3 files changed, 178 insertions(+)
diff --git a/superset-frontend/plugins/plugin-chart-table/src/DataTable/DataTable.tsx b/superset-frontend/plugins/plugin-chart-table/src/DataTable/DataTable.tsx
index 90d876d..aadb8f9 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/DataTable/DataTable.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/DataTable/DataTable.tsx
@@ -44,6 +44,7 @@ import SelectPageSize, {
import SimplePagination from './components/Pagination';
import useSticky from './hooks/useSticky';
import { PAGE_SIZE_OPTIONS } from '../consts';
+import { sortAlphanumericCaseInsensitive } from './utils/sortAlphanumericCaseInsensitive';
export interface DataTableProps<D extends object> extends TableOptions<D> {
tableClassName?: string;
@@ -68,6 +69,10 @@ export interface RenderHTMLCellProps extends HTMLProps<HTMLTableCellElement> {
cellContent: ReactNode;
}
+const sortTypes = {
+ alphanumeric: sortAlphanumericCaseInsensitive,
+};
+
// Be sure to pass our updateMyData and the skipReset option
export default function DataTable<D extends object>({
tableClassName,
@@ -174,6 +179,7 @@ export default function DataTable<D extends object>({
initialState,
getTableSize: defaultGetTableSize,
globalFilter: defaultGlobalFilter,
+ sortTypes,
...moreUseTableOptions,
},
...tableHooks,
diff --git a/superset-frontend/plugins/plugin-chart-table/src/DataTable/utils/sortAlphanumericCaseInsensitive.ts b/superset-frontend/plugins/plugin-chart-table/src/DataTable/utils/sortAlphanumericCaseInsensitive.ts
new file mode 100644
index 0000000..789e0ce
--- /dev/null
+++ b/superset-frontend/plugins/plugin-chart-table/src/DataTable/utils/sortAlphanumericCaseInsensitive.ts
@@ -0,0 +1,37 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { Row } from 'react-table';
+
+export const sortAlphanumericCaseInsensitive = <D extends {}>(
+ rowA: Row<D>,
+ rowB: Row<D>,
+ columnId: string,
+) => {
+ const valueA = rowA.values[columnId];
+ const valueB = rowB.values[columnId];
+
+ if (!valueA || typeof valueA !== 'string') {
+ return -1;
+ }
+ if (!valueB || typeof valueB !== 'string') {
+ return 1;
+ }
+ return valueA.localeCompare(valueB) > 0 ? 1 : -1;
+};
diff --git a/superset-frontend/plugins/plugin-chart-table/test/sortAlphanumericCaseInsensitive.test.ts b/superset-frontend/plugins/plugin-chart-table/test/sortAlphanumericCaseInsensitive.test.ts
new file mode 100644
index 0000000..4ba35ba
--- /dev/null
+++ b/superset-frontend/plugins/plugin-chart-table/test/sortAlphanumericCaseInsensitive.test.ts
@@ -0,0 +1,135 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { sortAlphanumericCaseInsensitive } from '../src/DataTable/utils/sortAlphanumericCaseInsensitive';
+
+const testData = [
+ {
+ values: {
+ col: 'test value',
+ },
+ },
+ {
+ values: {
+ col: 'a lowercase test value',
+ },
+ },
+ {
+ values: {
+ col: '5',
+ },
+ },
+ {
+ values: {
+ col: NaN,
+ },
+ },
+ {
+ values: {
+ col: '1234',
+ },
+ },
+ {
+ values: {
+ col: Infinity,
+ },
+ },
+ {
+ values: {
+ col: '.!# value starting with non-letter characters',
+ },
+ },
+ {
+ values: {
+ col: 'An uppercase test value',
+ },
+ },
+ {
+ values: {
+ col: undefined,
+ },
+ },
+ {
+ values: {
+ col: null,
+ },
+ },
+];
+
+describe('sortAlphanumericCaseInsensitive', () => {
+ it('Sort rows', () => {
+ const sorted = [...testData].sort((a, b) =>
+ // @ts-ignore
+ sortAlphanumericCaseInsensitive(a, b, 'col'),
+ );
+
+ expect(sorted).toEqual([
+ {
+ values: {
+ col: null,
+ },
+ },
+ {
+ values: {
+ col: undefined,
+ },
+ },
+ {
+ values: {
+ col: Infinity,
+ },
+ },
+ {
+ values: {
+ col: NaN,
+ },
+ },
+ {
+ values: {
+ col: '.!# value starting with non-letter characters',
+ },
+ },
+ {
+ values: {
+ col: '1234',
+ },
+ },
+ {
+ values: {
+ col: '5',
+ },
+ },
+ {
+ values: {
+ col: 'a lowercase test value',
+ },
+ },
+ {
+ values: {
+ col: 'An uppercase test value',
+ },
+ },
+ {
+ values: {
+ col: 'test value',
+ },
+ },
+ ]);
+ });
+});