Remove icon test

Signed-off-by: Qiaozp <[email protected]>
kubevela · May 8, 2023 · 9770268 · 9770268
1 parent 0b55620
commit 9770268
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 86 deletions.
diff --git a/packages/velaux-ui/src/layout/AppRootPage/index.tsx b/packages/velaux-ui/src/layout/AppRootPage/index.tsx
@@ -6,7 +6,7 @@ import { getPluginSrv, importAppPagePlugin } from '../../services/PluginService'
 import { Box, Button, Divider, Grid, Loading, Message, Tab } from "@alifd/next";
 import './index.less'
 import { connect } from "dva";
-import { checkImage, renderIcon } from "../../utils/icon";
+import { renderIcon } from "../../utils/icon";
 
 interface Props {
   pluginId: string;
@@ -41,7 +41,6 @@ enum types {
 }
 
 function ConfigPage({ pluginId, dispatch, pluginList, loading }: Props) {
-  const [valid, setValid] = React.useState(false)
   const [app, setApp] = React.useState<AppPagePlugin>();
   const _meta = pluginList.filter(item => item.id === pluginId)[0]
   const updateMeta = (previousState: any, action: any) => {
@@ -157,10 +156,6 @@ function ConfigPage({ pluginId, dispatch, pluginList, loading }: Props) {
     const history = locationService.getHistory()
     history.push('/plugins')
   }
-  checkImage(meta.info?.logos.large, (valid) => {
-    setValid(valid)
-  })
-
   const AppConfigPage = app.configPages.body
 
   return (
@@ -169,7 +164,7 @@ function ConfigPage({ pluginId, dispatch, pluginList, loading }: Props) {
       <Box className={'container'}>
         <Box className={'page-header'} direction={'row'} spacing={12}>
         <span className={'page-header-logo'}>
-          {renderIcon(meta.id, valid, meta.info?.logos.large)}
+          {renderIcon(meta.id, meta.info?.logos.large)}
         </span>
           <Box direction={'column'}>
             <h1 className={'page-header-title'}>{

diff --git a/packages/velaux-ui/src/pages/Addons/components/plugin-card/index.tsx b/packages/velaux-ui/src/pages/Addons/components/plugin-card/index.tsx
@@ -5,7 +5,6 @@ import './index.less';
 
 import { Box, Button, Card, Grid, Tag } from '@alifd/next';
 import i18n from "i18next";
-import { checkImage } from "../../../../utils/icon";
 import { If } from '../../../../components/If';
 import { Addon } from "@velaux/ui";
 
@@ -54,13 +53,11 @@ class PluginCard extends React.Component<Props, State> {
 
   componentDidMount() {
     if (this.props.icon) {
-      checkImage(this.props.icon, this.setValid)
     }
   }
 
   componentDidUpdate(prevProps: Readonly<Props>) {
     if (prevProps.icon !== this.props.icon && this.props.icon) {
-      checkImage(this.props.icon, this.setValid)
     }
   }
 

diff --git a/packages/velaux-ui/src/pages/Addons/components/plugin/index.tsx b/packages/velaux-ui/src/pages/Addons/components/plugin/index.tsx
@@ -107,54 +107,10 @@ class Plugin extends React.Component<Props, State> {
 
   componentDidMount() {
     this.getPluginList().then(() => {
-      const { pluginList } = this.props;
-      if (pluginList) {
-        pluginList.forEach((plugin) => {
-          if (plugin.name && plugin.info?.logos?.small) {
-            this.checkImage(plugin.name, plugin.info.logos.small);
-          }
-        });
-      }
       this.sortedPlugins()
     })
   }
 
-  componentDidUpdate(prevProps: Readonly<Props>) {
-    const { pluginList } = this.props;
-    if (pluginList && pluginList !== prevProps.pluginList) {
-      pluginList.forEach((plugin) => {
-        if (plugin.name && plugin.info?.logos?.small) {
-          this.checkImage(plugin.name, plugin.info.logos.small);
-        }
-      });
-    }
-  }
-
-  checkImage = (name: string, icon?: string) => {
-    if (icon && icon !== 'none' && icon !== '') {
-      const img = new Image();
-      img.src = icon;
-      img.onload = () => {
-        this.setState((preState) => {
-          preState.iconValid[name] = true;
-          return preState;
-        });
-      }
-      img.onerror = () => {
-        this.setState((preState) => {
-          preState.iconValid[name] = false;
-          return preState;
-        });
-      }
-    } else {
-      this.setState((preState) => {
-        preState.iconValid[name] = false;
-        return preState;
-      });
-    }
-  };
-
-
   sortedPlugins = () => {
     // put enabled plugin first, then installed plugin, then others
     const { pluginList } = this.props

diff --git a/packages/velaux-ui/src/utils/icon.tsx b/packages/velaux-ui/src/utils/icon.tsx
@@ -1,20 +1,4 @@
 import React from 'react';
-type validSetter = (valid: boolean) => void
-
-export const checkImage = (icon: string, setValid: validSetter) => {
-  if (icon !== 'none' && icon !== '') {
-    const img = new Image();
-    img.src = icon;
-    img.onload = () => {
-      setValid(true)
-    }
-    img.onerror = () => {
-      setValid(false)
-    }
-  } else {
-    setValid(false)
-  }
-};
 
 const nameUpper = (name: string) => {
   return name
@@ -29,26 +13,26 @@ const nameUpper = (name: string) => {
     .replace(',', '');
 };
 
-export const renderIcon = (name: string,  valid: boolean,icon?: string,) => {
-  if (valid) {
+export const renderIcon = (name: string, icon?: string,) => {
+  if (icon!==""  && icon!=="null" && icon!==undefined) {
     return <img src={icon} />;
   } else {
     return (
       <div
         style={{
-      display: 'inline-block',
-        verticalAlign: 'middle',
-        padding: `2px 4px`,
-        width: '60px',
-        height: '60px',
-        borderRadius: '50%',
-        backgroundColor: '#fff',
-        textAlign: 'center',
-        lineHeight: '60px',
-    }}
-  >
-    <span style={{ color: '#1b58f4', fontSize: `2em` }}>{nameUpper(name)}</span>
-    </div>
-  );
+          display: 'inline-block',
+          verticalAlign: 'middle',
+          padding: `2px 4px`,
+          width: '60px',
+          height: '60px',
+          borderRadius: '50%',
+          backgroundColor: '#fff',
+          textAlign: 'center',
+          lineHeight: '60px',
+        }}
+      >
+        <span style={{ color: '#1b58f4', fontSize: `2em` }}>{nameUpper(name)}</span>
+      </div>
+    );
   }
 }