fix logout

Author: thdxr

packages/console/app/src/routes/auth/logout.ts

@@ -0,0 +1,21 @@
+import { redirect } from "@solidjs/router"
+import { APIEvent } from "@solidjs/start"
+import { getResponseHeaders } from "@solidjs/start/http"
+import { useAuthSession } from "~/context/auth.session"
+
+export async function GET(event: APIEvent) {
+  const auth = await useAuthSession()
+  const current = auth.data.current
+  if (current)
+    await auth.update((val) => {
+      delete val.account?.[current]
+      const first = Object.keys(val.account ?? {})[0]
+      val.current = first
+      event!.locals.actor = undefined
+      return val
+    })
+  return redirect("/zen", {
+    status: 302,
+    headers: getResponseHeaders(),
+  })
+}

packages/console/app/src/routes/user-menu.css

@@ -12,6 +12,7 @@
 
     [data-slot="item"] {
       color: var(--color-danger);
+      text-decoration: none;
     }
   }
 }

packages/console/app/src/routes/user-menu.tsx

@@ -1,9 +1,8 @@
-import { action, redirect } from "@solidjs/router"
+import { action } from "@solidjs/router"
 import { getRequestEvent } from "solid-js/web"
 import { useAuthSession } from "~/context/auth.session"
 import { Dropdown } from "~/component/dropdown"
 import "./user-menu.css"
-import { getResponseHeaders } from "@solidjs/start/http"
 
 const logout = action(async () => {
   "use server"
@@ -18,21 +17,15 @@ const logout = action(async () => {
       event!.locals.actor = undefined
       return val
     })
-  throw redirect("/zen", {
-    status: 302,
-    headers: getResponseHeaders(),
-  })
-})
+}, "auth.logout")
 
 export function UserMenu(props: { email: string | null | undefined }) {
   return (
     <div data-component="user-menu">
       <Dropdown trigger={props.email ?? ""} align="right">
-        <form action={logout} method="post">
-          <button type="submit" formaction={logout} data-slot="item">
-            Logout
-          </button>
-        </form>
+        <a href="/auth/logout" data-slot="item">
+          Logout
+        </a>
       </Dropdown>
     </div>
   )