Use server action to login/logout (#110)

Snaacky · Dec 8, 2024 · 82954b5 · 82954b5
1 parent 8c072d3
commit 82954b5
Showing 1 changed file with 20 additions and 16 deletions.
diff --git a/components/buttons/LoginOrOutButton.tsx b/components/buttons/LoginOrOutButton.tsx
@@ -9,29 +9,33 @@ const LoginOrOutButton: FC = () => {
   const { data: session } = useSession()
 
   return (
-    <button
-      role={'button'}
-      className={
-        'btn w-100 btn-outline-' + (isLogin(session) ? 'danger' : 'success')
-      }
-      onClick={async () => {
+    <form
+      action={async () => {
+        'use server'
         if (isLogin(session)) {
           await signOut()
         } else {
           await signIn('discord')
         }
       }}
     >
-      {isLogin(session) ? (
-        <>
-          Sign out <FontAwesomeIcon icon={faSignOutAlt} />
-        </>
-      ) : (
-        <>
-          <FontAwesomeIcon icon={faSignInAlt} /> Sign In
-        </>
-      )}
-    </button>
+      <button
+        type='submit'
+        className={
+          'btn w-100 btn-outline-' + (isLogin(session) ? 'danger' : 'success')
+        }
+      >
+        {isLogin(session) ? (
+          <>
+            Sign out <FontAwesomeIcon icon={faSignOutAlt} />
+          </>
+        ) : (
+          <>
+            <FontAwesomeIcon icon={faSignInAlt} /> Sign In
+          </>
+        )}
+      </button>
+    </form>
   )
 }