icon: using svg component for the logo

1 files changed, 5 insertions, 10 deletions

diff --git a/src/components/Logs.js b/src/components/Logs.js
index 424765a..8fba941 100644
--- a/src/components/Logs.js
+++ b/src/components/Logs.js
@@ -4,7 +4,7 @@ import cx from 'classnames';
 import { useStoreState, useActions } from 'm/store';
 import { getClashAPIConfig } from 'd/app';
 
-import Icon from 'c/Icon';
+import SvgYacd from './SvgYacd';
 import { FixedSizeList as List, areEqual } from 'react-window';
 import ContentHeader from 'c/ContentHeader';
 import useRemainingViewPortHeight from '../hooks/useRemainingViewPortHeight';
@@ -13,8 +13,6 @@ import { fetchLogs } from '../api/logs';
 import LogSearch from './LogSearch';
 import { getLogsForDisplay, appendLog } from 'd/logs';
 
-import yacd from 's/yacd.svg';
-
 import s0 from 'c/Logs.module.scss';
 const paddingBottom = 30;
 const colors = {
@@ -69,12 +67,9 @@ export default function Logs() {
   const { appendLog } = useActions(actions);
   const logs = useStoreState(getLogsForDisplay);
 
-  useEffect(
-    () => {
-      fetchLogs({ hostname, port, secret }, appendLog);
-    },
-    [hostname, port, secret]
-  );
+  useEffect(() => {
+    fetchLogs({ hostname, port, secret }, appendLog);
+  }, [hostname, port, secret]);
   const [refLogsContainer, containerHeight] = useRemainingViewPortHeight();
 
   return (
@@ -88,7 +83,7 @@ export default function Logs() {
             style={{ height: containerHeight - paddingBottom }}
           >
             <div className={s0.logPlaceholderIcon}>
-              <Icon id={yacd.id} width={200} height={200} />
+              <SvgYacd width={200} height={200} />
             </div>
             <div>No logs yet, hang tight...</div>
           </div>