diff --git a/package-lock.json b/package-lock.json
index 19f89ea..4defe1d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5146,6 +5146,87 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/talon-auth": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/talon-auth/-/talon-auth-0.12.0.tgz",
+      "integrity": "sha512-uu+o/PmvTrOf31nwdtVxj+FZrEh/xwflLk8aZi9O/vYZXBdIJGoo7xnrkrliaO7ytFFEclg6hzaknqRCG8VZsQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@stablelib/ed25519": "^2.0.2",
+        "idb": "^8.0.3",
+        "uint8arrays": "^5.1.0"
+      },
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/binary": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@stablelib/binary/-/binary-2.0.1.tgz",
+      "integrity": "sha512-U9iAO8lXgEDONsA0zPPSgcf3HUBNAqHiJmSHgZz62OvC3Hi2Bhc5kTnQ3S1/L+sthDTHtCMhcEiklmIly6uQ3w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@stablelib/int": "^2.0.1"
+      }
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/ed25519": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/@stablelib/ed25519/-/ed25519-2.0.2.tgz",
+      "integrity": "sha512-d/lJ5sgzhtmpMIbKFWfev+i6WebBdIzzBpMzXtZdvUijoksjXosYFNqytoMj7cRshNj+/XTLYnnVMdZfd+penw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@stablelib/random": "^2.0.1",
+        "@stablelib/sha512": "^2.0.1",
+        "@stablelib/wipe": "^2.0.1"
+      }
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/hash": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@stablelib/hash/-/hash-2.0.0.tgz",
+      "integrity": "sha512-u3WPSqGido8lwJuMcrBgM5K54LrPGhkWAdtsyccf7dGsLixAZUds77zOAbu7bvKPwQlmoByH0txBi5rTmEKuHg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/int": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@stablelib/int/-/int-2.0.1.tgz",
+      "integrity": "sha512-Ht63fQp3wz/F8U4AlXEPb7hfJOIILs8Lq55jgtD7KueWtyjhVuzcsGLSTAWtZs3XJDZYdF1WcSKn+kBtbzupww==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/random": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@stablelib/random/-/random-2.0.1.tgz",
+      "integrity": "sha512-W6GAtXEEs7r+dSbuBsvoFmlyL3gLxle41tQkjKu17dDWtDdjhVUbtRfRCQcCUeczwkgjQxMPopgwYEvxXtHXGw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@stablelib/binary": "^2.0.1",
+        "@stablelib/wipe": "^2.0.1"
+      }
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/sha512": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@stablelib/sha512/-/sha512-2.0.1.tgz",
+      "integrity": "sha512-DUNe5cbnoH3sSIN+MG04RvTCLXtkbyy/SnQxiNO+GgF/KSXkkUSlF6mUVvCUdZBZ2X3NgogR+tAvaRSn8wxnLw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@stablelib/binary": "^2.0.1",
+        "@stablelib/hash": "^2.0.0",
+        "@stablelib/wipe": "^2.0.1"
+      }
+    },
+    "node_modules/talon-auth/node_modules/@stablelib/wipe": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@stablelib/wipe/-/wipe-2.0.1.tgz",
+      "integrity": "sha512-1eU2K9EgOcV4qc9jcP6G72xxZxEm5PfeI5H55l08W95b4oRJaqhmlWRc4xZAm6IVSKhVNxMi66V67hCzzuMTAg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@@ -5636,6 +5717,7 @@
         "@tsconfig/svelte": "^5.0.4",
         "svelte": "^4.2.18",
         "svelte-check": "^3.8.5",
+        "talon-auth": "^0.12.0",
         "tslib": "^2.6.3",
         "typescript": "^5.5.4",
         "vite": "^5.3.5",
diff --git a/svelte-chat/package.json b/svelte-chat/package.json
index f1596c3..6030c28 100644
--- a/svelte-chat/package.json
+++ b/svelte-chat/package.json
@@ -15,6 +15,7 @@
     "@tsconfig/svelte": "^5.0.4",
     "svelte": "^4.2.18",
     "svelte-check": "^3.8.5",
+    "talon-auth": "^0.12.0",
     "tslib": "^2.6.3",
     "typescript": "^5.5.4",
     "vite": "^5.3.5",
@@ -26,4 +27,4 @@
     "@feathersjs/errors": "^5.0.29",
     "vite-plugin-top-level-await": "^1.4.2"
   }
-}
\ No newline at end of file
+}
diff --git a/svelte-chat/src/App.svelte b/svelte-chat/src/App.svelte
index 5a920eb..4fc9c03 100644
--- a/svelte-chat/src/App.svelte
+++ b/svelte-chat/src/App.svelte
@@ -1,12 +1,20 @@
 <script lang="ts">
+  import 'talon-auth/login'
+  import type { TalonLoginComponent } from 'talon-auth'
+  import { createAutomerge, DocHandle } from '@feathersdev/automerge'
   import type { Doc } from '@automerge/automerge-repo';
   import type { ChatAppData, CloudAuthUser, Message, User } from './utils.js';
   import { formatDate, sha256 } from './utils.js';
-  import { afterUpdate } from 'svelte';
-  import { loadAppDocument, type AppDocumentHandle } from './automerge.js';
-  import { auth } from './auth.js';
+  import { afterUpdate, onMount } from 'svelte';
   import loading from './assets/loading.svg';
 
+  const appId = import.meta.env.VITE_CLOUD_APP_ID as string
+
+  /**
+   * The document handle type for the application
+   */
+  type AppDocumentHandle = DocHandle<ChatAppData>
+
   let ready = false;
   let cloudAuthUser: CloudAuthUser | null = null;
   let user: User | null = null;
@@ -15,6 +23,8 @@
   let text: string = '';
   let handle: AppDocumentHandle;
 
+  const getAuth = () => document.querySelector('talon-login') as TalonLoginComponent
+
   const getUserById = (id: string) => users.find((user) => user.id === id);
 
   const init = async () => {
@@ -27,8 +37,10 @@
       ready = true;
     };
 
-    handle = await loadAppDocument();
-    cloudAuthUser = await auth.getUser();
+    const automerge = createAutomerge(getAuth())
+
+    handle = await automerge.find<ChatAppData>();
+    cloudAuthUser = await getAuth().getUser();
     // Update application data when document changes
     handle.on('change', ({ doc }) => loadDocument(doc));
     // Initialise the document if it is already available
@@ -90,7 +102,7 @@
   };
 
   const logout = async () => {
-    await auth.logoutAndForget();
+    await getAuth().logoutAndForget();
     window.location.reload();
   };
 
@@ -100,10 +112,11 @@
       ?.scrollIntoView({ behavior: 'smooth' });
   });
 
-  init();
+  onMount(() => init())
 </script>
 
 <main>
+  <talon-login app-id="{appId}" />
   {#if ready}
     {#if user === null}
       <div
diff --git a/svelte-chat/src/auth.ts b/svelte-chat/src/auth.ts
deleted file mode 100644
index da731f6..0000000
--- a/svelte-chat/src/auth.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { createClient } from '@feathersdev/auth'
-
-/**
- * This is your public application id
- */
-export const appId = import.meta.env.VITE_CLOUD_APP_ID as string
-
-/**
- * The Feathers auth client instance. You can use it to get a token,
- * retrieve the current user and to log in and out.
- */
-export const auth = createClient({
-  appId,
-  onLoginRequired: async (error) => {
-    // Redirect to login page if a login is required
-    // You can also do other things here like show a modal before redirecting
-    window.location.href = await auth.getLoginUrl(error)
-  },
-})
-
-/**
- * Make an authenticated request to a server using the standard fetch API.
- * Will redirect to the login page instead if the user needs to log in.
- *
- * @param url The URL for the request
- * @param options Additional request options.
- * @returns The fetch response
- */
-export async function authFetch(url: string, options?: RequestInit) {
-  const headers = new Headers(options?.headers)
-
-  // Set the authorization header with the Feathers Auth token
-  headers.set('Authorization', await auth.getHeader())
-
-  return fetch(url, {
-    ...options,
-    headers,
-  })
-}
diff --git a/svelte-chat/src/automerge.ts b/svelte-chat/src/automerge.ts
deleted file mode 100644
index d8db100..0000000
--- a/svelte-chat/src/automerge.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { createAutomerge, DocHandle } from '@feathersdev/automerge'
-import { auth } from './auth.js'
-import type { ChatAppData } from './utils.js'
-
-/**
- * The Feathers Automerge client. Use it to retrieve the document
- * for your application with `automerge.find()`.
- */
-export const automerge = createAutomerge(auth)
-
-/**
- * The document handle type for the application
- */
-export type AppDocumentHandle = DocHandle<ChatAppData>
-
-/**
- * Load the document for the application
- */
-export async function loadAppDocument(): Promise<AppDocumentHandle> {
-  return automerge.find<ChatAppData>()
-}