From 4cd809bd0c94836532f58a2ec6aa131694cce10d Mon Sep 17 00:00:00 2001
From: Corentin Thomasset <corentin.thomasset74@gmail.com>
Date: Sat, 17 Dec 2022 01:30:02 +0100
Subject: feat(tools): added favorite tool handling

---
 src/components/ToolCard.vue | 31 ++++++++++++++++++-------------
 1 file changed, 18 insertions(+), 13 deletions(-)

(limited to 'src/components/ToolCard.vue')

diff --git a/src/components/ToolCard.vue b/src/components/ToolCard.vue
index 926c5e9..79586f8 100644
--- a/src/components/ToolCard.vue
+++ b/src/components/ToolCard.vue
@@ -3,17 +3,21 @@
     <n-card class="tool-card">
       <n-space justify="space-between" align="center">
         <n-icon class="icon" size="40" :component="tool.icon" />
-        <n-tag
-          v-if="tool.isNew"
-          size="small"
-          class="badge-new"
-          round
-          type="success"
-          :bordered="false"
-          :color="{ color: theme.primaryColor, textColor: theme.tagColor }"
-        >
-          New
-        </n-tag>
+        <n-space align="center">
+          <n-tag
+            v-if="tool.isNew"
+            size="small"
+            class="badge-new"
+            round
+            type="success"
+            :bordered="false"
+            :color="{ color: theme.primaryColor, textColor: theme.tagColor }"
+          >
+            New
+          </n-tag>
+
+          <favorite-button :tool="tool" />
+        </n-space>
       </n-space>
       <n-h3 class="title">
         <n-ellipsis>{{ tool.name }}</n-ellipsis>
@@ -29,11 +33,12 @@
 </template>
 
 <script setup lang="ts">
-import type { ITool } from '@/tools/tool';
+import type { Tool } from '@/tools/tools.types';
 import { useThemeVars } from 'naive-ui';
 import { toRefs } from 'vue';
+import FavoriteButton from './FavoriteButton.vue';
 
-const props = defineProps<{ tool: ITool & { category: string } }>();
+const props = defineProps<{ tool: Tool & { category: string } }>();
 const { tool } = toRefs(props);
 const theme = useThemeVars();
 </script>
-- 
cgit v1.2.3