diff --git a/src/components/header/MobileNavBar.vue b/src/components/header/MobileNavBar.vue
index ad16531..a73d0c3 100644
--- a/src/components/header/MobileNavBar.vue
+++ b/src/components/header/MobileNavBar.vue
@@ -1,57 +1,11 @@
 <script lang="ts" setup>
+import { navs } from '~~/types'
+
 const isOpen = ref(false)
 
 const router = useRouter()
 router.afterEach(() => isOpen.value = false)
 
-const navs = [
-  {
-    label: 'Home',
-    to: '/',
-    icon: 'i-ph-house-bold',
-  },
-  {
-    label: 'About',
-    to: '/about',
-    icon: 'i-ph-person-arms-spread-bold',
-  },
-  {
-    label: 'Articles',
-    to: '/writing',
-    icon: 'i-ph-pencil-bold',
-  },
-  {
-    label: 'Projects',
-    to: '/work',
-    icon: 'i-ph-flask-bold',
-  },
-  {
-    label: 'Uses',
-    to: '/uses',
-    icon: 'i-ph-tree-evergreen-bold',
-  },
-  {
-    label: 'Talents',
-    to: '/talents',
-    icon: 'i-ph-shooting-star-bold',
-  },
-  {
-    label: 'Guestbook',
-    to: '/guestbook',
-    icon: 'i-material-symbols-book-2-outline',
-  },
-  {
-    label: 'Bookmarks',
-    to: '/bookmarks',
-    icon: 'i-material-symbols-bookmark-add-outline-rounded',
-  },
-  {
-    label: 'Contact',
-    to: '/contact',
-    icon: 'i-ph-push-pin-bold',
-  },
-]
-
 const route = useRoute()
 function isRoute(path: string) {
   return route.path === path
diff --git a/src/components/header/NavBar.vue b/src/components/header/NavBar.vue
index c749510..17e499a 100644
--- a/src/components/header/NavBar.vue
+++ b/src/components/header/NavBar.vue
@@ -1,20 +1,7 @@
 <script setup lang="ts">
+import { otherTab } from '~~/types'
+
 const route = useRoute()
-const items = [
-  [{
-    label: 'Talents',
-    to: '/talents',
-    icon: 'i-ph-users-bold',
-  }, {
-    label: 'Guestbook',
-    to: '/guestbook',
-    icon: 'i-material-symbols-book-2-outline',
-  }, {
-    label: 'Bookmarks',
-    to: '/bookmarks',
-    icon: 'i-material-symbols-bookmark-add-outline-rounded',
-  }],
-]
 </script>
 
 <template>
@@ -35,7 +22,7 @@ const items = [
       <UButton to="/uses" size="sm" variant="ghost" color="white" :class="{ 'link-active': route.path.includes('/uses') }">
         Uses
       </UButton>
-      <UDropdown mode="hover" :items="items" :popper="{ placement: 'bottom' }">
+      <UDropdown mode="hover" :items="otherTab" :popper="{ placement: 'bottom' }">
         <UButton size="sm" variant="ghost" color="white" class="duration-300">
           Other
         </UButton>
diff --git a/types.ts b/types.ts
index a4b554e..69fe614 100644
--- a/types.ts
+++ b/types.ts
@@ -22,6 +22,7 @@ export enum ColorsTheme {
 
 export interface JsonParsedContent<T> extends ParsedContent {
   body: T
+  excerpt: ''
 }
 
 export interface Post extends MarkdownParsedContent {
@@ -93,3 +94,57 @@ export const providers = [
     color: 'red',
   },
 ]
+
+export const otherTab = [
+  [
+    {
+      label: 'Talents',
+      to: '/talents',
+      icon: 'i-ph-users-bold',
+    },
+    {
+      label: 'Guestbook',
+      to: '/guestbook',
+      icon: 'i-material-symbols-book-2-outline',
+    },
+    {
+      label: 'Bookmarks',
+      to: '/bookmarks',
+      icon: 'i-material-symbols-bookmark-add-outline-rounded',
+    },
+  ],
+]
+
+export const navs = [
+  {
+    label: 'Home',
+    to: '/',
+    icon: 'i-ph-house-bold',
+  },
+  {
+    label: 'About',
+    to: '/about',
+    icon: 'i-ph-person-arms-spread-bold',
+  },
+  {
+    label: 'Articles',
+    to: '/writing',
+    icon: 'i-ph-pencil-bold',
+  },
+  {
+    label: 'Projects',
+    to: '/work',
+    icon: 'i-ph-flask-bold',
+  },
+  {
+    label: 'Uses',
+    to: '/uses',
+    icon: 'i-ph-tree-evergreen-bold',
+  },
+  ...otherTab,
+  {
+    label: 'Contact',
+    to: '/contact',
+    icon: 'i-ph-push-pin-bold',
+  },
+].flat()