car_trader/components/NavBar.vue

47 lines
1.1 KiB
Vue

<script setup>
const user = useSupabaseUser();
const supabaseClient = useSupabaseClient();
const logout = () => {
const { error } = supabaseClient.auth.signOut();
if (error) {
console.log(error);
}
// fix, for oder supabase version
// $fetch('/api/_supabase/session',{
// method: "POST",
// body: {event: "SIGNED_OUT", session:null}
// });
user.value = null;
navigateTo("/");
};
</script>
<template>
<!-- NAVBAR -->
<header
class="sticky
top-0 z-50
flex
justify-between
items-center
space-x-1
order-b
bg-white
p-4
shadow-md">
<NuxtLink class="text-3xl font-mono" to="/">cartrader</NuxtLink>
<div v-if="user" class="flex">
<NuxtLink to="/profile/listings" class="mr-5">profile</NuxtLink>
<p class="cursor-pointer" @click="logout">Logout</p>
</div>
<NuxtLink v-else to="/login">Login</NuxtLink>
</header>
<!-- NAVBAR -->
</template>