From 1d141a8b60ef386e05f77f1e3a97d54f488616f6 Mon Sep 17 00:00:00 2001
From: Geriano <gerznewbie@gmail.com>
Date: Sun, 14 Aug 2022 20:07:22 +0700
Subject: [PATCH] implementing translation on sidebar menu

---
 resources/js/Components/DashboardLayout/Sidebar/Link.vue  | 8 ++++++--
 resources/js/Components/DashboardLayout/Sidebar/Links.vue | 8 ++++++--
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/resources/js/Components/DashboardLayout/Sidebar/Link.vue b/resources/js/Components/DashboardLayout/Sidebar/Link.vue
index 34c1aa0..f2e2af0 100644
--- a/resources/js/Components/DashboardLayout/Sidebar/Link.vue
+++ b/resources/js/Components/DashboardLayout/Sidebar/Link.vue
@@ -13,10 +13,14 @@ const link = route().has(menu.route_or_url) ? route(menu.route_or_url) : menu.ro
 </script>
 
 <template>
-  <Link :href="link" class="w-full px-4 py-3" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'} pl-${padding !== 0 && padding}`">
+  <Link
+    :href="link"
+    :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'} pl-${padding !== 0 && padding}`"
+    class="w-full px-4 py-3"
+  >
     <div class="flex items-center space-x-2">
       <Icon :name="menu.icon" />
-      <p class="uppercase font-semibold">{{ menu.name }}</p>
+      <p class="uppercase font-semibold">{{ __(menu.name) }}</p>
     </div>
   </Link>
 </template>
\ No newline at end of file
diff --git a/resources/js/Components/DashboardLayout/Sidebar/Links.vue b/resources/js/Components/DashboardLayout/Sidebar/Links.vue
index 5ebf61d..aeec724 100644
--- a/resources/js/Components/DashboardLayout/Sidebar/Links.vue
+++ b/resources/js/Components/DashboardLayout/Sidebar/Links.vue
@@ -27,10 +27,14 @@ const open = ref(active ? true : false)
 
 <template>
   <div class="w-full flex flex-col">
-    <button @click.prevent="open = ! open" class="w-full p-4" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${open && 'dark:bg-gray-800'} pl-${padding !== 0 && padding}`">
+    <button
+      @click.prevent="open = ! open"
+      :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${open && 'dark:bg-gray-800'} pl-${padding !== 0 && padding}`"
+      class="w-full p-4"
+    >
       <div class="flex items-center space-x-2">
         <Icon :name="menu.icon" />
-        <p class="uppercase font-semibold w-full text-left">{{ menu.name }}</p>
+        <p class="uppercase font-semibold w-full text-left">{{ __(menu.name) }}</p>
         <Icon name="caret-left" class="transition-all ease-in-out duration-150" :class="open && '-rotate-90'" />
       </div>
     </button>