Added optional Discourse SSO.

frontend/src/App.svelte

@@ -1,6 +1,6 @@
 <script>
   import { onMount } from 'svelte'
-  import { getSession, clearSession } from './db.js'
+  import { getSession, saveSession, clearSession } from './db.js'
   import { syncPull, startSSE, startSyncLoop } from './sync.js'
   import Login from './pages/Login.svelte'
   import Dashboard from './pages/Dashboard.svelte'
@@ -25,6 +25,7 @@
   let route = $state(window.location.pathname)
   let updateAvailable = $state(false)
   let mobileNavOpen = $state(false)
+  let ssoError = $state('')
 
   // Check if this is a public page (no auth needed)
   const kioskToken = $derived(route.match(/^\/v\/([A-Z0-9]+)/i)?.[1] ?? '')
@@ -54,7 +55,32 @@
       loading = false
       return
     }
-    session = await getSession()
+
+    // Handle SSO callback in URL fragment
+    const hash = window.location.hash
+    if (hash.startsWith('#sso_token=')) {
+      const token = decodeURIComponent(hash.slice('#sso_token='.length))
+      history.replaceState(null, '', '/')
+      try {
+        const res = await fetch('/api/me', { headers: { Authorization: `Bearer ${token}` } })
+        if (res.ok) {
+          const user = await res.json()
+          await saveSession(token, user)
+          session = { token, user }
+        } else {
+          ssoError = 'SSO login failed. Please try again.'
+        }
+      } catch {
+        ssoError = 'SSO login failed. Please try again.'
+      }
+    } else if (hash.startsWith('#sso_error=')) {
+      ssoError = decodeURIComponent(hash.slice('#sso_error='.length))
+      history.replaceState(null, '', '/')
+    }
+
+    if (!session) {
+      session = await getSession()
+    }
     loading = false
     if (session) {
       await syncPull()
@@ -102,7 +128,7 @@
 {:else if isConfirmEmail}
   <ConfirmEmail />
 {:else if !session}
-  <Login onlogin={onLogin} />
+  <Login onlogin={onLogin} error={ssoError} />
 {:else if roles.length === 1 && roles[0] === 'gatekeeper'}
   <!-- Gate-only users get the full-screen GateKiosk instead of the standard layout -->
   <GateKiosk {session} {onLogout} />

frontend/src/api.js

@@ -118,6 +118,10 @@ export const api = {
     resetDepartments: () => apiJSON('/api/settings/reset-departments', { method: 'POST' }),
     resetVolunteerShifts: () => apiJSON('/api/settings/reset-volunteer-shifts', { method: 'POST' }),
   },
+  sso: {
+    enabled: () => kioskFetch('/api/public/sso-enabled'),
+    init: () => kioskFetch('/api/sso/init'),
+  },
   signup: {
     config: () => kioskFetch('/api/public/signup-config'),
     submit: (data) => kioskFetch('/api/public/signup', { method: 'POST', body: JSON.stringify(data) }),

frontend/src/pages/Login.svelte

@@ -1,13 +1,23 @@
 <script>
+  import { onMount } from 'svelte'
   import { api } from '../api.js'
   import { saveSession } from '../db.js'
 
-  let { onlogin } = $props()
+  let { onlogin, error: initialError = '' } = $props()
 
   let email = $state('')
   let password = $state('')
-  let error = $state('')
+  let error = $state(initialError)
   let loading = $state(false)
+  let ssoEnabled = $state(false)
+  let ssoLoading = $state(false)
+
+  onMount(async () => {
+    try {
+      const res = await api.sso.enabled()
+      ssoEnabled = res.enabled
+    } catch {}
+  })
 
   async function submit(e) {
     e.preventDefault()
@@ -23,6 +33,18 @@
       loading = false
     }
   }
+
+  async function startSSO() {
+    error = ''
+    ssoLoading = true
+    try {
+      const { redirect_url } = await api.sso.init()
+      window.location.href = redirect_url
+    } catch (err) {
+      error = err.message || 'SSO failed'
+      ssoLoading = false
+    }
+  }
 </script>
 
 <div class="login-wrap">
@@ -45,5 +67,28 @@
         {loading ? 'Signing in…' : 'Sign in'}
       </button>
     </form>
+    {#if ssoEnabled}
+      <div class="sso-divider"><span>or</span></div>
+      <button class="btn btn-ghost" style="width:100%" onclick={startSSO} disabled={ssoLoading}>
+        {ssoLoading ? 'Redirecting…' : 'Log in with Discourse'}
+      </button>
+    {/if}
   </div>
 </div>
+
+<style>
+  .sso-divider {
+    display: flex;
+    align-items: center;
+    margin: 1rem 0;
+    gap: 0.75rem;
+    color: var(--c-muted);
+    font-size: 0.8rem;
+  }
+  .sso-divider::before,
+  .sso-divider::after {
+    content: '';
+    flex: 1;
+    border-top: 1px solid var(--c-border);
+  }
+</style>

frontend/src/pages/Settings.svelte

@@ -26,6 +26,8 @@
   let eventEndDate = $state('')
   let eventTimezone = $state('')
   const timezones = Intl.supportedValuesOf('timeZone')
+  let discourseSSOUrl = $state('')
+  let discourseSSOSecret = $state('')
   let shiftSignupsOpen = $state(false)
   let togglingSignups = $state(false)
 
@@ -49,6 +51,8 @@
       baseURL = s.base_url ?? ''
       noteLabel = s.volunteer_note_label ?? 'Additional note'
       noteRequired = s.volunteer_note_required ?? false
+      discourseSSOUrl = s.discourse_sso_url ?? ''
+      discourseSSOSecret = ''
       shiftSignupsOpen = s.shift_signups_open ?? false
     } catch (err) {
       error = err.message
@@ -89,14 +93,17 @@
         smtp_host: smtpHost,
         smtp_port: smtpPort,
         smtp_user: smtpUser,
-        smtp_password: smtpPassword, // empty = keep existing
+        smtp_password: smtpPassword,
         smtp_from: smtpFrom,
         smtp_from_name: smtpFromName,
         base_url: baseURL,
         volunteer_note_label: noteLabel,
         volunteer_note_required: noteRequired,
+        discourse_sso_url: discourseSSOUrl,
+        discourse_sso_secret: discourseSSOSecret,
       })
       smtpPassword = ''
+      discourseSSOSecret = ''
       success = 'Settings saved.'
     } catch (err) {
       error = err.message
@@ -240,6 +247,24 @@
           <input id="s-url" bind:value={baseURL} placeholder="https://events.example.com" />
         </div>
 
+        <!-- Discourse SSO -->
+        <h2 style="font-size:0.95rem;font-weight:700;margin:1.5rem 0 1rem">Discourse SSO</h2>
+        <p class="text-muted" style="font-size:0.78rem;margin-bottom:1rem">
+          Enable DiscourseConnect SSO so users can log in with their Discourse account.
+          Set the same secret in your Discourse admin under Connect &gt; discourse connect secret.
+        </p>
+        <div style="display:grid;grid-template-columns:1fr 1fr;gap:1rem">
+          <div class="form-group" style="grid-column:1/-1">
+            <label for="sso-url">Discourse URL</label>
+            <input id="sso-url" bind:value={discourseSSOUrl} placeholder="https://forum.example.com" />
+          </div>
+          <div class="form-group" style="grid-column:1/-1">
+            <label for="sso-secret">SSO Secret</label>
+            <input id="sso-secret" type="password" bind:value={discourseSSOSecret}
+              placeholder="Leave blank to keep existing" autocomplete="new-password" />
+          </div>
+        </div>
+
         <div class="actions">
           <button type="submit" class="btn btn-primary" disabled={saving}>
             {saving ? 'Saving…' : 'Save Settings'}