created by for sermons

pages/[slug].vue

@@ -89,6 +89,11 @@
         <div class="border-b pb-6 mb-8">
           <h1 class="text-4xl font-bold text-gray-900 mb-2">{{ sermon.title }}</h1>
           <p class="text-lg text-gray-600">{{ formatDateRange(sermon) }}</p>
+          <ClientOnly>
+            <p v-if="isAdmin && sermon.creator_name" class="text-sm text-gray-500 mt-2">
+              Created by: {{ sermon.creator_name }}
+            </p>
+          </ClientOnly>
         </div>
 
         <!-- Section 1: Bible References -->
@@ -254,6 +259,7 @@ const slug = route.params.slug as string
 const { data: sermon } = await useFetch(`/api/sermons/${slug}`)
 const { data: authData } = await useFetch('/api/auth/verify')
 const isAuthenticated = computed(() => authData.value?.authenticated || false)
+const isAdmin = computed(() => authData.value?.isAdmin || false)
 
 // Font size state
 const fontSize = ref('medium')