Migrate legacy icon usages to v4 explicit imports

Signed-off-by: Máté Szabó <mszabo@fandom.com>
jaegertracing · Mar 12, 2023 · 4b79a68 · 4b79a68
1 parent 19a6607
commit 4b79a68
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/packages/jaeger-ui/src/components/TracePage/TraceStatistics/HeaderTable.tsx b/packages/jaeger-ui/src/components/TracePage/TraceStatistics/HeaderTable.tsx
@@ -13,7 +13,7 @@
 // limitations under the License.
 
 import React from 'react';
-import { Icon as LegacyIcon } from '@ant-design/compatible';
+import { UpOutlined, DownOutlined } from '@ant-design/icons';
 import './HeaderTable.css';
 
 type Props = {
@@ -28,12 +28,12 @@ type Props = {
 export default function HeaderTable(props: Props) {
   // const thStyle = { width: Math.round(window.innerWidth * 0.2) };
   const iconStyle = { opacity: props.sortIndex === props.index ? 1.0 : 0.2 };
-  const iconType = props.sortAsc && props.sortIndex === props.index ? 'up' : 'down';
+  const Icon = props.sortAsc && props.sortIndex === props.index ? UpOutlined : DownOutlined;
   return (
     <th className="HeaderTable--th">
       {props.element.title}
       <button type="submit" className="HeaderTable--sortButton" onClick={() => props.sortClick(props.index)}>
-        <LegacyIcon style={iconStyle} type={iconType} />
+        <Icon style={iconStyle} />
       </button>
     </th>
   );

diff --git a/packages/jaeger-ui/src/components/common/CopyIcon.tsx b/packages/jaeger-ui/src/components/common/CopyIcon.tsx
@@ -13,8 +13,7 @@
 // limitations under the License.
 
 import * as React from 'react';
-
-import { Icon as LegacyIcon } from '@ant-design/compatible';
+import { CopyOutlined, LinkOutlined } from '@ant-design/icons';
 
 import { Button, Tooltip } from 'antd';
 import { TooltipPlacement } from 'antd/lib/tooltip/index';
@@ -26,7 +25,7 @@ import './CopyIcon.css';
 type PropsType = {
   className?: string;
   copyText: string;
-  icon?: string;
+  icon?: 'copy' | 'link';
   placement?: TooltipPlacement;
   tooltipTitle: string;
 };
@@ -62,6 +61,7 @@ export default class CopyIcon extends React.PureComponent<PropsType, StateType>
   };
 
   render() {
+    const Icon = this.props.icon === 'link' ? LinkOutlined : CopyOutlined;
     return (
       <Tooltip
         arrowPointAtCenter
@@ -73,7 +73,7 @@ export default class CopyIcon extends React.PureComponent<PropsType, StateType>
         <Button
           className={cx(this.props.className, 'CopyIcon')}
           htmlType="button"
-          icon={<LegacyIcon type={this.props.icon} />}
+          icon={<Icon />}
           onClick={this.handleClick}
         />
       </Tooltip>