feat: add sign out

components/app/AppAccount.vue

@@ -1,18 +1,21 @@
 <script lang="ts" setup>
-const { signIn, status, data } = useSession();
+const { signIn, status, data, signOut } = useSession();
 </script>
 
 <template>
   <div>
     <el-button v-if="status === 'unauthenticated'" text @click="() => signIn()">
-      <el-icon class="i-carbon:user"></el-icon>
+      <div class="i-carbon:user-avatar-filled"></div>
     </el-button>
-    <el-avatar
-      v-else-if="status === 'authenticated'"
-      :size="32"
-      :src="data?.user?.image ?? ''"
-    >
-      {{ data?.user?.name }}
-    </el-avatar>
+    <el-dropdown v-else-if="status === 'authenticated'">
+      <el-avatar :size="32" :src="data?.user?.image ?? ''">
+        {{ data?.user?.name }}
+      </el-avatar>
+      <template #dropdown>
+        <el-dropdown-menu>
+          <el-dropdown-item @click="() => signOut()">Sign Out</el-dropdown-item>
+        </el-dropdown-menu>
+      </template>
+    </el-dropdown>
   </div>
 </template>

components/tool/ToolLocalAction.vue

@@ -2,6 +2,8 @@
 import { ToolItem } from "~~/types";
 const localePath = useLocalePath();
 
+const { status } = useSession();
+
 const { remove, create: localCreate } = useLocalTools();
 const { create } = await useAsyncRemoteTools({
   immediate: false,
@@ -42,6 +44,7 @@ const handleUpload = async () => {
       <el-icon class="i-carbon:trash-can"></el-icon>
     </el-button>
     <el-button
+      v-if="status === 'authenticated'"
       :loading="loading"
       class="ml-0!"
       @click="handleUpload"