Profile enhancements & greeting

pages/index.vue

@@ -26,19 +26,27 @@
             </ClientOnly>
           </div>
           <ClientOnly fallback-tag="div">
-            <div v-if="isAuthenticated && isAdmin" class="flex flex-wrap items-center justify-center gap-2">
+            <div v-if="isAuthenticated" class="flex flex-wrap items-center justify-center gap-2">
               <NuxtLink 
+                v-if="isAdmin"
                 to="/admin" 
                 class="px-3 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 font-medium text-xs whitespace-nowrap"
               >
                 Manage Sermons
               </NuxtLink>
               <NuxtLink 
+                v-if="isAdmin"
                 to="/users" 
                 class="px-3 py-2 bg-green-600 text-white rounded-md hover:bg-green-700 font-medium text-xs whitespace-nowrap"
               >
                 Manage Users
               </NuxtLink>
+              <NuxtLink 
+                to="/profile" 
+                class="px-3 py-2 text-xs font-medium text-blue-700 bg-blue-50 rounded-md hover:bg-blue-100 whitespace-nowrap"
+              >
+                Edit Profile
+              </NuxtLink>
             </div>
           </ClientOnly>
         </div>
@@ -65,6 +73,12 @@
                 >
                   Manage Users
                 </NuxtLink>
+                <NuxtLink 
+                  to="/profile" 
+                  class="px-4 py-2 text-sm font-medium text-blue-700 bg-blue-50 rounded-md hover:bg-blue-100"
+                >
+                  Edit Profile
+                </NuxtLink>
                 <button
                   @click="handleLogout"
                   class="px-4 py-2 text-sm font-medium text-red-700 bg-red-50 rounded-md hover:bg-red-100"
@@ -87,6 +101,11 @@
         </div>
 
         <div class="text-center mt-6">
+          <ClientOnly>
+            <h2 v-if="isAuthenticated && firstName" class="text-xl text-gray-700 mb-2">
+              {{ greeting }}
+            </h2>
+          </ClientOnly>
           <h1 class="text-3xl font-bold text-gray-900">
             Welcome to New Life!
           </h1>
@@ -159,6 +178,27 @@
 const { data: authData } = await useFetch('/api/auth/verify')
 const isAuthenticated = computed(() => authData.value?.authenticated || false)
 const isAdmin = computed(() => authData.value?.isAdmin || false)
+const firstName = computed(() => authData.value?.firstName || '')
+
+// Time-based greeting
+const greeting = computed(() => {
+  if (!firstName.value) return ''
+  
+  const hour = new Date().getHours()
+  let timeGreeting = ''
+  
+  if (hour >= 5 && hour < 12) {
+    timeGreeting = 'Good morning'
+  } else if (hour >= 12 && hour < 18) {
+    timeGreeting = 'Good afternoon'
+  } else if (hour >= 18 && hour < 21) {
+    timeGreeting = 'Good evening'
+  } else {
+    timeGreeting = 'Greetings'
+  }
+  
+  return `${timeGreeting}, ${firstName.value}!`
+})
 
 // Fetch non-archived sermons for the most recent sermon
 const { data: activeSermons } = await useFetch('/api/sermons?includeArchived=false')