ExperimentalAuth: wire up signOut() to dev server

zooniverse · Dec 19, 2024 · e93760f · e93760f
1 parent 38b97cf
commit e93760f
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 4 deletions.
diff --git a/packages/lib-panoptes-js/dev/index.html b/packages/lib-panoptes-js/dev/index.html
@@ -24,6 +24,7 @@ <h1>Panoptes.js dev app</h1>
     <section>
       <h2>Functions</h2>
       <button id="check-current-user-button">checkCurrentUser()</button>
+      <button id="sign-out-button">signOut()</button>
     </section>
     <form
       id="login-form"

diff --git a/packages/lib-panoptes-js/dev/index.js b/packages/lib-panoptes-js/dev/index.js
@@ -2,18 +2,21 @@ import {
   checkBearerToken,
   checkCurrentUser,
   signIn,
+  signOut,
   addEventListener,
 } from '@src/experimental-auth.js'
 
 class App {
   constructor () {
     this.html = {
       checkCurrentUserButton: document.getElementById('check-current-user-button'),
+      signOutButton: document.getElementById('sign-out-button'),
       loginForm: document.getElementById('login-form'),
       message: document.getElementById('message'),
     }
 
     this.html.checkCurrentUserButton.addEventListener('click', this.checkCurrentUserButton_onClick.bind(this))
+    this.html.signOutButton.addEventListener('click', this.signOutButton_onClick.bind(this))
     this.html.loginForm.addEventListener('submit', this.loginForm_onSubmit.bind(this))
     addEventListener('change', this.onAuthChange)
   }
@@ -22,13 +25,28 @@ class App {
     try {
       const user = await checkCurrentUser()
       if (user) {
-        this.html.message.innerHTML += `> Current user: ${user.login}\n`
+        this.html.message.innerHTML += `> Current user: ${user.login} \n`
       } else {
         this.html.message.innerHTML += `> Current user: [nobody] \n`
       }
     } catch (err) {
       console.error(err)
-      this.html.message.innerHTML += `> [ERROR] ${err.toString()}\n`
+      this.html.message.innerHTML += `> [ERROR] ${err.toString()} \n`
+    }
+    return false
+  }
+
+  async signOutButton_onClick (e) {
+    try {
+      const success = await signOut()
+      if (success) {
+        this.html.message.innerHTML += `> Successfully signed out \n`
+      } else {
+        this.html.message.innerHTML += `> There's no user to sign out \n`
+      }
+    } catch (err) {
+      console.error(err)
+      this.html.message.innerHTML += `> [ERROR] ${err.toString()} \n`
     }
     return false
   }
@@ -41,13 +59,13 @@ class App {
       // Note: await is necessary to catch sign in errors.
       const user = await signIn(formData.get('login'), formData.get('password'))
       if (user) {
-        this.html.message.innerHTML += `> Logged in as ${user.login}\n`
+        this.html.message.innerHTML += `> Logged in as ${user.login} \n`
       } else {
         throw new Error('No user?')
       }
     } catch (err) {
       console.error(err)
-      this.html.message.innerHTML += `> [ERROR] ${err.toString()}\n`
+      this.html.message.innerHTML += `> [ERROR] ${err.toString()} \n`
     }
     return false
   }