style: update clear website button

Author: moonrailgun

src/renderer/components/AddWebsiteBtn.tsx

@@ -6,16 +6,14 @@ export const AddWebsiteBtn: React.FC = React.memo(() => {
   const { addTreeNode } = useTreeStore();
 
   return (
-    <>
-      <Button
-        long={true}
-        onClick={() => {
-          addTreeNode(generateDefaultNode());
-        }}
-      >
-        Add Website
-      </Button>
-    </>
+    <Button
+      long={true}
+      onClick={() => {
+        addTreeNode(generateDefaultNode());
+      }}
+    >
+      Add Website
+    </Button>
   );
 });
 AddWebsiteBtn.displayName = 'AddWebsiteBtn';

src/renderer/components/ClearWebsiteBtn.tsx

@@ -1,22 +1,21 @@
 import { Button } from '@arco-design/web-react';
+import { IconDelete } from '@arco-design/web-react/icon';
 import React from 'react';
 import { useTreeStore } from '../store/tree';
 
 export const ClearWebsiteBtn: React.FC = React.memo(() => {
   const { setSelectedNode } = useTreeStore();
 
   return (
-    <>
-      <Button
-        long={true}
-        onClick={() => {
-          setSelectedNode(null);
-          window.electron.ipcRenderer.sendMessage('clear-all-webview');
-        }}
-      >
-        Clear Website
-      </Button>
-    </>
+    <Button
+      long={true}
+      title="Clear Website Cache"
+      icon={<IconDelete />}
+      onClick={() => {
+        setSelectedNode(null);
+        window.electron.ipcRenderer.sendMessage('clear-all-webview');
+      }}
+    />
   );
 });
 ClearWebsiteBtn.displayName = 'ClearWebsiteBtn';

src/renderer/components/SideTree.tsx

@@ -1,4 +1,4 @@
-import { Menu, Tooltip, Tree, Trigger } from '@arco-design/web-react';
+import { Menu, Tree, Trigger } from '@arco-design/web-react';
 import { IconDown, IconPlus } from '@arco-design/web-react/icon';
 import React from 'react';
 import {
@@ -36,6 +36,10 @@ const StyledMenu = styled(Menu)`
   }
 ` as unknown as typeof Menu;
 
+const Row = styled.div`
+  display: flex;
+`;
+
 export const SideTree: React.FC = React.memo(() => {
   const {
     treeData,
@@ -48,8 +52,10 @@ export const SideTree: React.FC = React.memo(() => {
 
   return (
     <div>
-      <AddWebsiteBtn />
-      <ClearWebsiteBtn />
+      <Row>
+        <AddWebsiteBtn />
+        <ClearWebsiteBtn />
+      </Row>
 
       <StyledTree
         draggable={true}