<template>
  <div class="container py-8 space-y-6">
    <PWAInstallPrompt auto-show />
    <NotificationPermission auto-show />
    
    <!-- Welcome Section -->
    <div class="text-center space-y-4">
      <h1 class="text-3xl font-bold tracking-tight">Welcome back!</h1>
      <p class="text-lg text-muted-foreground">
        You are logged in as {{ auth.userDisplay.value?.name }}
      </p>
    </div>

    <!-- User Profile Card -->
    <UserProfile />
  </div>
</template>

<script setup lang="ts">
import NotificationPermission from '@/components/notifications/NotificationPermission.vue'
import PWAInstallPrompt from '@/components/pwa/PWAInstallPrompt.vue'
import UserProfile from '@/components/auth/UserProfile.vue'
import { auth } from '@/composables/useAuth'
</script>
