feat: add useNuxtifySiteTitle composable

Author: davidstackio

playground/app.vue

@@ -1,12 +1,11 @@
 <script setup lang="ts">
-import { useNuxtifyConfig, useServerSeoMeta } from '#imports'
-
 // App state
 const nuxtifyConfig = useNuxtifyConfig()
 const dialog = useDialog()
 const toast = useToast()
 
 // Page info
+useNuxtifySiteTitle()
 useServerSeoMeta({
   title: `${nuxtifyConfig.brand?.name} playground`,
   description: `This is the ${nuxtifyConfig.brand?.name} playground.`,

src/runtime/composables/nuxtify.ts

@@ -1,6 +1,22 @@
-// Types
 import type { ModuleOptions } from '../../types'
-
-import { useAppConfig } from '#imports'
+import { useAppConfig, useHead } from '#imports'
 
 export const useNuxtifyConfig = (): ModuleOptions => useAppConfig().nuxtify
+
+export const useNuxtifySiteTitle = ({
+  separator = '|',
+  siteName = '',
+}: { separator?: string, siteName?: string } = {}) => {
+  // App state
+  const nuxtifyConfig = useNuxtifyConfig()
+
+  useHead({
+    titleTemplate: (titleChunk) => {
+      return titleChunk ? `${titleChunk} %separator %siteName` : '%siteName'
+    },
+    templateParams: {
+      siteName: siteName || nuxtifyConfig.brand?.name,
+      separator,
+    },
+  })
+}