From 55d857e658dcee223b065d2594779e2d55d8cc41 Mon Sep 17 00:00:00 2001
From: Ruidy <ruidy.nemausat@gmail.com>
Date: Mon, 16 Dec 2024 21:33:55 +0100
Subject: [PATCH] ref: use slots to prevent repeating menu

---
 app.vue                   | 6 +++++-
 components/app/navbar.vue | 4 ++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/app.vue b/app.vue
index 23aba66..c4ca3b8 100644
--- a/app.vue
+++ b/app.vue
@@ -1,6 +1,10 @@
 <template>
   <div data-theme="cupcake" class="flex flex-col h-screen">
-    <app-navbar />
+    <app-navbar>
+      <template #menu>
+        <li><nuxt-link to="/categories">Categories</nuxt-link></li>
+      </template>
+    </app-navbar>
     <main class="flex-grow">
       <nuxt-page />
     </main>
diff --git a/components/app/navbar.vue b/components/app/navbar.vue
index a5971a7..0a1d5e3 100644
--- a/components/app/navbar.vue
+++ b/components/app/navbar.vue
@@ -67,7 +67,7 @@ if (route.path === "/search") {
           tabindex="0"
           class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-200 rounded-box w-52"
         >
-          <li><nuxt-link to="/categories">Categories</nuxt-link></li>
+          <slot name="menu" />
         </ul>
       </div>
       <nuxt-link to="/" class="btn btn-ghost text-xl">
@@ -77,7 +77,7 @@ if (route.path === "/search") {
     </div>
     <div class="navbar-center hidden lg:flex">
       <ul class="menu menu-horizontal px-1">
-        <li><nuxt-link to="/categories">Categories</nuxt-link></li>
+        <slot name="menu" />
       </ul>
     </div>
     <div class="navbar-end gap-2">