You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ma...@apache.org on 2026/04/08 20:21:41 UTC
(superset) branch master updated: refactor(plugins): replace react-icons with antd icons, remove 83MB dependency (#39184)
This is an automated email from the ASF dual-hosted git repository.
maximebeauchemin 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 63cceb6a799 refactor(plugins): replace react-icons with antd icons, remove 83MB dependency (#39184)
63cceb6a799 is described below
commit 63cceb6a799d920aed824350a3f542487d4a747a
Author: Maxime Beauchemin <ma...@gmail.com>
AuthorDate: Wed Apr 8 13:21:34 2026 -0700
refactor(plugins): replace react-icons with antd icons, remove 83MB dependency (#39184)
Co-authored-by: Claude Opus 4.6 <no...@anthropic.com>
---
superset-frontend/package-lock.json | 17 +++--------------
.../plugins/plugin-chart-pivot-table/package.json | 3 +--
.../src/react-pivottable/TableRenderers.tsx | 17 +++++++++++------
.../plugins/plugin-chart-table/package.json | 1 -
.../plugins/plugin-chart-table/src/TableChart.tsx | 12 +++++++-----
5 files changed, 22 insertions(+), 28 deletions(-)
diff --git a/superset-frontend/package-lock.json b/superset-frontend/package-lock.json
index ab961ad95ac..d0863f12358 100644
--- a/superset-frontend/package-lock.json
+++ b/superset-frontend/package-lock.json
@@ -41438,15 +41438,6 @@
"react": ">=16.4.1"
}
},
- "node_modules/react-icons": {
- "version": "5.4.0",
- "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.4.0.tgz",
- "integrity": "sha512-7eltJxgVt7X64oHh6wSWNwwbKTCtMfK35hcjvJS0yxEAhPM8oUKdS3+kqaW1vicIltw+kR2unHaa12S9pPALoQ==",
- "license": "MIT",
- "peerDependencies": {
- "react": "*"
- }
- },
"node_modules/react-intersection-observer": {
"version": "10.0.3",
"resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-10.0.3.tgz",
@@ -52161,7 +52152,7 @@
"version": "0.20.4",
"license": "Apache-2.0",
"dependencies": {
- "@deck.gl/aggregation-layers": "~9.2.9",
+ "@deck.gl/aggregation-layers": "~9.2.11",
"@deck.gl/core": "~9.2.5",
"@deck.gl/extensions": "~9.2.9",
"@deck.gl/geo-layers": "~9.2.5",
@@ -52516,8 +52507,7 @@
"lodash": "^4.18.1",
"prop-types": "*",
"react": "^17.0.2",
- "react-dom": "^17.0.2",
- "react-icons": "5.4.0"
+ "react-dom": "^17.0.2"
}
},
"plugins/plugin-chart-table": {
@@ -52531,7 +52521,6 @@
"d3-array": "^3.2.4",
"lodash": "^4.18.1",
"memoize-one": "^5.2.1",
- "react-icons": "5.4.0",
"react-table": "^7.8.0",
"regenerator-runtime": "^0.14.1",
"xss": "^1.0.15"
@@ -52570,7 +52559,7 @@
"license": "Apache-2.0",
"dependencies": {
"@types/d3-scale": "^4.0.9",
- "d3-cloud": "^1.2.8",
+ "d3-cloud": "^1.2.9",
"d3-scale": "^4.0.2"
},
"devDependencies": {
diff --git a/superset-frontend/plugins/plugin-chart-pivot-table/package.json b/superset-frontend/plugins/plugin-chart-pivot-table/package.json
index 9eeaf62234c..7d0d0b56e1d 100644
--- a/superset-frontend/plugins/plugin-chart-pivot-table/package.json
+++ b/superset-frontend/plugins/plugin-chart-pivot-table/package.json
@@ -34,8 +34,7 @@
"lodash": "^4.18.1",
"prop-types": "*",
"react": "^17.0.2",
- "react-dom": "^17.0.2",
- "react-icons": "5.4.0"
+ "react-dom": "^17.0.2"
},
"devDependencies": {
"@babel/types": "^7.29.0",
diff --git a/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.tsx b/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.tsx
index be4fca29d00..af142249cca 100644
--- a/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.tsx
+++ b/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.tsx
@@ -22,9 +22,11 @@ import { safeHtmlSpan } from '@superset-ui/core';
import { t } from '@apache-superset/core/translation';
import { supersetTheme } from '@apache-superset/core/theme';
import PropTypes from 'prop-types';
-import { FaSort } from 'react-icons/fa';
-import { FaSortDown as FaSortDesc } from 'react-icons/fa';
-import { FaSortUp as FaSortAsc } from 'react-icons/fa';
+import {
+ CaretUpOutlined,
+ CaretDownOutlined,
+ ColumnHeightOutlined,
+} from '@ant-design/icons';
import {
ColorFormatters,
getTextColorForBackground,
@@ -855,7 +857,7 @@ export class TableRenderer extends Component<
if (activeSortColumn !== key) {
return (
- <FaSort
+ <ColumnHeightOutlined
onClick={() =>
this.sortData(key, visibleColKeys, pivotData, maxRowIndex)
}
@@ -863,7 +865,8 @@ export class TableRenderer extends Component<
);
}
- const SortIcon = sortingOrder[key] === 'asc' ? FaSortAsc : FaSortDesc;
+ const SortIcon =
+ sortingOrder[key] === 'asc' ? CaretUpOutlined : CaretDownOutlined;
return (
<SortIcon
onClick={() =>
@@ -873,7 +876,9 @@ export class TableRenderer extends Component<
);
};
const headerCellFormattedValue =
- dateFormatters?.[attrName]?.(convertToNumberIfNumeric(colKey[attrIdx])) ?? colKey[attrIdx];
+ dateFormatters?.[attrName]?.(
+ convertToNumberIfNumeric(colKey[attrIdx]),
+ ) ?? colKey[attrIdx];
const { backgroundColor, color } = getCellColor(
[attrName],
headerCellFormattedValue,
diff --git a/superset-frontend/plugins/plugin-chart-table/package.json b/superset-frontend/plugins/plugin-chart-table/package.json
index 38ce880c570..d4b9f099a69 100644
--- a/superset-frontend/plugins/plugin-chart-table/package.json
+++ b/superset-frontend/plugins/plugin-chart-table/package.json
@@ -30,7 +30,6 @@
"d3-array": "^3.2.4",
"lodash": "^4.18.1",
"memoize-one": "^5.2.1",
- "react-icons": "5.4.0",
"react-table": "^7.8.0",
"regenerator-runtime": "^0.14.1",
"xss": "^1.0.15"
diff --git a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
index 02b0a8520a6..f8105c5198f 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
@@ -35,9 +35,11 @@ import {
Row,
} from 'react-table';
import { extent as d3Extent, max as d3Max } from 'd3-array';
-import { FaSort } from 'react-icons/fa';
-import { FaSortDown as FaSortDesc } from 'react-icons/fa';
-import { FaSortUp as FaSortAsc } from 'react-icons/fa';
+import {
+ CaretUpOutlined,
+ CaretDownOutlined,
+ ColumnHeightOutlined,
+} from '@ant-design/icons';
import cx from 'classnames';
import {
DataRecord,
@@ -221,9 +223,9 @@ function cellBackground({
function SortIcon<D extends object>({ column }: { column: ColumnInstance<D> }) {
const { isSorted, isSortedDesc } = column;
- let sortIcon = <FaSort />;
+ let sortIcon = <ColumnHeightOutlined />;
if (isSorted) {
- sortIcon = isSortedDesc ? <FaSortDesc /> : <FaSortAsc />;
+ sortIcon = isSortedDesc ? <CaretDownOutlined /> : <CaretUpOutlined />;
}
return sortIcon;
}