feat(frontend): implement /logout

2 files changed, 17 insertions, 1 deletions

diff --git a/frontend/app/routes/dashboard.tsx b/frontend/app/routes/dashboard.tsx
index d7cad6c..9afee86 100644
--- a/frontend/app/routes/dashboard.tsx
+++ b/frontend/app/routes/dashboard.tsx
@@ -1,5 +1,5 @@
 import type { LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
-import { Link, useLoaderData } from "@remix-run/react";
+import { Link, useLoaderData, Form } from "@remix-run/react";
 import { isAuthenticated } from "../.server/auth";
 import { apiClient } from "../.server/api/client";
 
@@ -68,6 +68,16 @@ export default function Dashboard() {
             ))}
           </ul>
         </div>
+        <div>
+          <Form method="post" action="/logout">
+            <button
+              className="mt-6 px-6 py-2 text-white bg-red-500 hover:bg-red-700 rounded"
+              type="submit"
+            >
+              Logout
+            </button>
+          </Form>
+        </div>
       </div>
     </div>
   );
diff --git a/frontend/app/routes/logout.tsx b/frontend/app/routes/logout.tsx
new file mode 100644
index 0000000..f48081d
--- /dev/null
+++ b/frontend/app/routes/logout.tsx
@@ -0,0 +1,6 @@
+import type { ActionFunctionArgs } from "@remix-run/node";
+import { authenticator } from "../.server/auth";
+
+export async function action({ request }: ActionFunctionArgs) {
+  await authenticator.logout(request, { redirectTo: "/" });
+}