From 56c665eccbe6a6c257eef9963dfd12f32653419a Mon Sep 17 00:00:00 2001
From: Kazhnuz <kazhnuz@kobold.cafe>
Date: Sat, 4 Feb 2023 10:13:33 +0100
Subject: [PATCH] feat: affichage sidebar

---
 src/components/layout/SideBar.vue | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/components/layout/SideBar.vue b/src/components/layout/SideBar.vue
index 04bb588..9567513 100644
--- a/src/components/layout/SideBar.vue
+++ b/src/components/layout/SideBar.vue
@@ -1,11 +1,23 @@
+<script setup lang="ts">
+import { useConfigStore } from "@/stores/config";
+import { computed } from "vue";
+
+const store = useConfigStore();
+
+const sidebar = computed(() => {
+  return store.getSidebar() ?? { title: "", id: 0, links: [] };
+});
+</script>
+
 <template>
   <aside id="sidebar" class="bg-dark fg-light menu">
     <h1 class="title-5 fg-light">Navigation</h1>
-    <ul>
-      <li>
-        <router-link to="/jdr/core" class="menu-item"
-          >Règles de base</router-link
-        >
+    <ul v-for="item in sidebar" :key="item.id">
+      <div class="menu-divider" v-if="item.title">{{ item.title }}</div>
+      <li v-for="(link, index) in item.links" :key="index">
+        <router-link :to="`/jdr/core/${link.path}`" class="menu-item" :replace="true">{{
+          link.title
+        }}</router-link>
       </li>
     </ul>
   </aside>