You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@devlake.apache.org by mi...@apache.org on 2023/06/13 12:40:23 UTC

[incubator-devlake] branch main updated: fix(config-ui): replace data scope clear icon (#5450)

This is an automated email from the ASF dual-hosted git repository.

mintsweet pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git


The following commit(s) were added to refs/heads/main by this push:
     new 7ccfa3e53 fix(config-ui): replace data scope clear icon (#5450)
7ccfa3e53 is described below

commit 7ccfa3e53a66aa0b65abc0d2c1fe2c15e6216af5
Author: 青湛 <0x...@gmail.com>
AuthorDate: Tue Jun 13 20:40:19 2023 +0800

    fix(config-ui): replace data scope clear icon (#5450)
    
    * feat(config-ui): support params image in icon-button component
    
    * fix(config-ui): replace data scope clear icon
---
 .../src/components/action/icon-button/index.tsx    |  7 +++---
 config-ui/src/images/icons/clear.svg               | 29 ++++++++++++++++++++++
 config-ui/src/pages/connection/detail/index.tsx    |  3 ++-
 3 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/config-ui/src/components/action/icon-button/index.tsx b/config-ui/src/components/action/icon-button/index.tsx
index 89ba6143f..1b162fe01 100644
--- a/config-ui/src/components/action/icon-button/index.tsx
+++ b/config-ui/src/components/action/icon-button/index.tsx
@@ -21,14 +21,15 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 
 interface Props {
   style?: React.CSSProperties;
-  icon: IconName;
+  icon?: IconName;
+  image?: JSX.Element;
   tooltip: string;
   loading?: boolean;
   disabled?: boolean;
   onClick?: () => void;
 }
 
-export const IconButton = ({ style, icon, tooltip, loading, disabled, onClick }: Props) => {
+export const IconButton = ({ style, icon, image, tooltip, loading, disabled, onClick }: Props) => {
   return (
     <Tooltip2 intent={Intent.PRIMARY} position={Position.TOP} content={tooltip}>
       <Button
@@ -37,7 +38,7 @@ export const IconButton = ({ style, icon, tooltip, loading, disabled, onClick }:
         disabled={disabled}
         minimal
         intent={Intent.PRIMARY}
-        icon={icon}
+        icon={icon ?? image}
         onClick={onClick}
       />
     </Tooltip2>
diff --git a/config-ui/src/images/icons/clear.svg b/config-ui/src/images/icons/clear.svg
new file mode 100644
index 000000000..a1a5c4a48
--- /dev/null
+++ b/config-ui/src/images/icons/clear.svg
@@ -0,0 +1,29 @@
+<!--
+This icon is from Feather Icons with the MIT license: https://feathericons.com/
+
+The MIT License (MIT)
+
+Copyright (c) 2013-2017 Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+-->
+
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.9119 14.3879L13.9655 8.93074H14.2852C14.5423 8.93074 14.7494 8.7236 14.7494 8.46646V5.03789C14.7494 4.78074 14.5423 4.5736 14.2852 4.5736H9.8923V1.3236C9.8923 1.06646 9.68516 0.859314 9.42801 0.859314H6.57087C6.31373 0.859314 6.10659 1.06646 6.10659 1.3236V4.5736H1.71373C1.45659 4.5736 1.24944 4.78074 1.24944 5.03789V8.46646C1.24944 8.7236 1.45659 8.93074 1.71373 8.93074H2.03337L1.08694 14.3879C1.07534 14.4545 1.07847 14.5229 1.09611 14.5882C1.11374 14.6535 1.14545 14.7141 1 [...]
+</svg>
diff --git a/config-ui/src/pages/connection/detail/index.tsx b/config-ui/src/pages/connection/detail/index.tsx
index 5c4b5eec4..2d64d169a 100644
--- a/config-ui/src/pages/connection/detail/index.tsx
+++ b/config-ui/src/pages/connection/detail/index.tsx
@@ -22,6 +22,7 @@ import { Button, Icon, Intent } from '@blueprintjs/core';
 
 import { PageHeader, Buttons, Dialog, IconButton, Table, Message } from '@/components';
 import { useTips, useConnections, useRefreshData } from '@/hooks';
+import ClearImg from '@/images/icons/clear.svg';
 import {
   ConnectionForm,
   ConnectionStatus,
@@ -260,7 +261,7 @@ const ConnectionDetail = ({ plugin, connectionId }: Props) => {
               render: (id) => (
                 <>
                   <IconButton
-                    icon="unarchive"
+                    image={<img src={ClearImg} alt="clear" />}
                     tooltip="Clear historical data"
                     onClick={() => handleShowClearDataScopeDialog(id)}
                   />