Merge pull request harshtandiya#9 from harshtandiya/hotfix1

feat: add documentation link in sidebar
fossunited · Nov 7, 2024 · 0a56f32 · 0a56f32
2 parents 4d8d5ed + 4aba45c
commit 0a56f32
Showing 1 changed file with 35 additions and 6 deletions.
diff --git a/frontend/src/components/Sidebar.vue b/frontend/src/components/Sidebar.vue
@@ -15,8 +15,8 @@
             <div class="font-sans text-2xl font-semibold">Ballot.</div>
             <Button
               class="block md:hidden -mr-8 !rounded-full w-8 h-8"
-              @click="toggleSidebar = false"
               variant="outline"
+              @click="toggleSidebar = false"
             >
               <IconArrowLeft size="1rem" />
             </Button>
@@ -45,8 +45,22 @@
         </slot>
         <slot name="post-nav-items"></slot>
       </div>
-      <slot name="user-actions">
-        <div class="flex flex-col gap-4">
+      <div class="flex flex-col gap-4">
+        <slot name="documentation">
+          <p
+            class="text-sm leading-normal tracking-tight font-medium text-primary-600"
+            v-if="hasDocs"
+          >
+            Need help? Checkout the Ballot
+            <span class="flex items-center gap-1">
+              <a :href="docLink" target="_blank" class="underline">
+                Documentation
+              </a>
+              <IconExternalLink size="1rem" />
+            </span>
+          </p>
+        </slot>
+        <slot name="user-actions">
           <div class="flex items-center justify-between text-gray-800">
             <div class="flex items-center gap-2">
               <img
@@ -88,8 +102,8 @@
               </Popover>
             </div>
           </div>
-        </div>
-      </slot>
+        </slot>
+      </div>
     </div>
   </div>
 
@@ -113,7 +127,12 @@
   ></div>
 </template>
 <script setup>
-import { IconUserFilled, IconMenu2, IconArrowLeft } from '@tabler/icons-vue'
+import {
+  IconUserFilled,
+  IconMenu2,
+  IconArrowLeft,
+  IconExternalLink,
+} from '@tabler/icons-vue'
 import { createResource, Popover } from 'frappe-ui'
 import { inject, ref } from 'vue'
 import { getRedirectUrl } from '@/utils/helpers'
@@ -131,6 +150,16 @@ const props = defineProps({
       return []
     },
   },
+  hasDocs: {
+    type: Boolean,
+    default: true,
+  },
+  docLink: {
+    type: String,
+    default() {
+      return 'https://harshtandiya.github.io/ballot/'
+    },
+  },
 })
 
 const userDetails = createResource({