NuxtAuthDashboardRepository/frontend/app/components/Navbar.vue
2025-04-21 08:50:19 +05:30

36 lines
1011 B
Vue

<template>
<header class="bg-white shadow p-4 flex justify-between items-center">
<h2 class="text-xl font-semibold">Welcome, Atul</h2>
<div class="flex items-center space-x-4">
<span class="text-gray-700">🔔 Notifications</span>
<span class="text-gray-700">👤 Profile</span>
<button @click="logout" class="bg-red-600 text-white px-4 py-2 rounded-md hover:bg-red-400">
Logout
</button>
</div>
</header>
</template>
<script setup>
import { useRouter } from 'vue-router'
import { Client, Account } from 'appwrite'
// Appwrite client setup
const client = new Client()
client.setEndpoint('https://cloud.appwrite.io/v1').setProject('67e1445400053dca1d9b')
const account = new Account(client)
// Router
const router = useRouter()
// Logout function
const logout = async () => {
try {
await account.deleteSession('current')
router.push('/') // Redirect to index.vue
} catch (error) {
console.error('Logout failed:', error.message)
}
}
</script>