From 83ffb0aaed87d232c55943828c05ac9bd46404dd Mon Sep 17 00:00:00 2001
From: tiny-craft <137850705+tiny-craft@users.noreply.github.com>
Date: Fri, 25 Aug 2023 16:08:04 +0800
Subject: [PATCH] perf: replace some icons

---
 frontend/src/components/icons/Connect.vue     | 32 ++++++++++++++++--
 frontend/src/components/icons/Record.vue      | 33 +++++++++++++++++++
 frontend/src/components/icons/Unlink.vue      | 30 +++++------------
 .../src/components/sidebar/ConnectionTree.vue |  7 ++--
 frontend/src/components/sidebar/NavMenu.vue   |  3 +-
 5 files changed, 77 insertions(+), 28 deletions(-)
 create mode 100644 frontend/src/components/icons/Record.vue

diff --git a/frontend/src/components/icons/Connect.vue b/frontend/src/components/icons/Connect.vue
index 1e539f0..ec1048a 100644
--- a/frontend/src/components/icons/Connect.vue
+++ b/frontend/src/components/icons/Connect.vue
@@ -8,16 +8,42 @@ const props = defineProps({
 </script>
 
 <template>
-    <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
+    <svg fill="none" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
         <path
             :stroke-width="strokeWidth"
-            d="M30 19H20C15.5817 19 12 22.5817 12 27C12 31.4183 15.5817 35 20 35H36C40.4183 35 44 31.4183 44 27C44 24.9711 43.2447 23.1186 42 21.7084"
+            d="M37 22.0001L34 25.0001L23 14.0001L26 11.0001C27.5 9.50002 33 7.00005 37 11.0001C41 15.0001 38.5 20.5 37 22.0001Z"
+            fill="none"
             stroke="currentColor"
             stroke-linecap="round"
             stroke-linejoin="round" />
         <path
             :stroke-width="strokeWidth"
-            d="M6 24.2916C4.75527 22.8814 4 21.0289 4 19C4 14.5817 7.58172 11 12 11H28C32.4183 11 36 14.5817 36 19C36 23.4183 32.4183 27 28 27H18"
+            d="M42 6L37 11"
+            stroke="currentColor"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+        <path
+            :stroke-width="strokeWidth"
+            d="M11 25.9999L14 22.9999L25 33.9999L22 36.9999C20.5 38.5 15 41 11 36.9999C7 32.9999 9.5 27.5 11 25.9999Z"
+            fill="none"
+            stroke="currentColor"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+        <path
+            :stroke-width="strokeWidth"
+            d="M23 32L27 28"
+            stroke="currentColor"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+        <path
+            :stroke-width="strokeWidth"
+            d="M6 42L11 37"
+            stroke="currentColor"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+        <path
+            :stroke-width="strokeWidth"
+            d="M16 25L20 21"
             stroke="currentColor"
             stroke-linecap="round"
             stroke-linejoin="round" />
diff --git a/frontend/src/components/icons/Record.vue b/frontend/src/components/icons/Record.vue
new file mode 100644
index 0000000..2c1d972
--- /dev/null
+++ b/frontend/src/components/icons/Record.vue
@@ -0,0 +1,33 @@
+<script setup>
+const props = defineProps({
+    strokeWidth: {
+        type: [Number, String],
+        default: 3,
+    },
+})
+</script>
+
+<template>
+    <svg viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path
+            d="M5.81836 6.72729V14H13.0911"
+            stroke="currentColor"
+            :stroke-width="strokeWidth"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+        <path
+            d="M4 24C4 35.0457 12.9543 44 24 44V44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C16.598 4 10.1351 8.02111 6.67677 13.9981"
+            stroke="currentColor"
+            :stroke-width="strokeWidth"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+        <path
+            d="M24.005 12L24.0038 24.0088L32.4832 32.4882"
+            stroke="currentColor"
+            :stroke-width="strokeWidth"
+            stroke-linecap="round"
+            stroke-linejoin="round" />
+    </svg>
+</template>
+
+<style lang="scss" scoped></style>
diff --git a/frontend/src/components/icons/Unlink.vue b/frontend/src/components/icons/Unlink.vue
index ec1048a..ae32416 100644
--- a/frontend/src/components/icons/Unlink.vue
+++ b/frontend/src/components/icons/Unlink.vue
@@ -8,43 +8,29 @@ const props = defineProps({
 </script>
 
 <template>
-    <svg fill="none" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
+    <svg viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
         <path
-            :stroke-width="strokeWidth"
-            d="M37 22.0001L34 25.0001L23 14.0001L26 11.0001C27.5 9.50002 33 7.00005 37 11.0001C41 15.0001 38.5 20.5 37 22.0001Z"
-            fill="none"
+            d="M25.8927 16.0307L18.1145 8.2525C15.2506 5.38866 10.7031 5.29302 7.9572 8.0389C5.21132 10.7848 5.30696 15.3323 8.1708 18.1962L15.949 25.9744"
             stroke="currentColor"
+            :stroke-width="strokeWidth"
             stroke-linecap="round"
             stroke-linejoin="round" />
         <path
-            :stroke-width="strokeWidth"
-            d="M42 6L37 11"
+            d="M31.9161 22.0707L39.6943 29.8489C42.5581 32.7127 42.9291 37.1233 39.9079 40.0062C36.8867 42.8891 32.6144 42.6564 29.7506 39.7926L21.9724 32.0144"
             stroke="currentColor"
+            :stroke-width="strokeWidth"
             stroke-linecap="round"
             stroke-linejoin="round" />
         <path
-            :stroke-width="strokeWidth"
-            d="M11 25.9999L14 22.9999L25 33.9999L22 36.9999C20.5 38.5 15 41 11 36.9999C7 32.9999 9.5 27.5 11 25.9999Z"
-            fill="none"
+            d="M21.2384 21.0759L17.3493 17.1868"
             stroke="currentColor"
+            :stroke-width="strokeWidth"
             stroke-linecap="round"
             stroke-linejoin="round" />
         <path
-            :stroke-width="strokeWidth"
-            d="M23 32L27 28"
+            d="M30.3131 30.1504L26.424 26.2613"
             stroke="currentColor"
-            stroke-linecap="round"
-            stroke-linejoin="round" />
-        <path
             :stroke-width="strokeWidth"
-            d="M6 42L11 37"
-            stroke="currentColor"
-            stroke-linecap="round"
-            stroke-linejoin="round" />
-        <path
-            :stroke-width="strokeWidth"
-            d="M16 25L20 21"
-            stroke="currentColor"
             stroke-linecap="round"
             stroke-linejoin="round" />
     </svg>
diff --git a/frontend/src/components/sidebar/ConnectionTree.vue b/frontend/src/components/sidebar/ConnectionTree.vue
index 9cf359d..a2a9fdd 100644
--- a/frontend/src/components/sidebar/ConnectionTree.vue
+++ b/frontend/src/components/sidebar/ConnectionTree.vue
@@ -101,7 +101,7 @@ const menuOptions = {
                 {
                     key: 'server_edit',
                     label: i18n.t('edit_conn'),
-                    icon: renderIcon(Edit),
+                    icon: renderIcon(Config),
                 },
                 {
                     type: 'divider',
@@ -139,7 +139,10 @@ const renderLabel = ({ option }) => {
             return h(
                 NText,
                 {
-                    style: { color },
+                    style: {
+                        color,
+                        fontWeight: '450',
+                    },
                 },
                 () => option.label,
             )
diff --git a/frontend/src/components/sidebar/NavMenu.vue b/frontend/src/components/sidebar/NavMenu.vue
index 0fc45f2..011e84e 100644
--- a/frontend/src/components/sidebar/NavMenu.vue
+++ b/frontend/src/components/sidebar/NavMenu.vue
@@ -13,6 +13,7 @@ import Log from '@/components/icons/Log.vue'
 import useConnectionStore from 'stores/connections.js'
 import Help from '@/components/icons/Help.vue'
 import usePreferencesStore from 'stores/preferences.js'
+import Record from '@/components/icons/Record.vue'
 
 const themeVars = useThemeVars()
 
@@ -52,7 +53,7 @@ const menuOptions = computed(() => {
         {
             label: i18n.t('log'),
             key: 'log',
-            icon: renderIcon(Log),
+            icon: renderIcon(Record),
         },
     ]
 })