From f93c759bf201ee69f75df85fa5ab524dc47fd55d Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Thu, 2 Apr 2026 02:54:37 -0500
Subject: [PATCH] Fix VersionCheck crash: move VersionCheck and Toaster inside
 BrowserRouter

VersionCheck and Toaster were rendering outside the BrowserRouter in App.tsx,
so the <Link> in the version update toast had no Router context. Moved both
into AppRouter.tsx inside BrowserRouter. Also truncate changelog excerpt
to 60 chars with ellipsis for cleaner toast display.
---
 package-lock.json               | 4 ++--
 src/App.tsx                     | 7 +++----
 src/AppRouter.tsx               | 4 ++++
 src/components/VersionCheck.tsx | 7 +++++--
 4 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 26c2d381..7c5ead65 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "ditto",
-  "version": "2.2.9",
+  "version": "2.2.10",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "ditto",
-      "version": "2.2.9",
+      "version": "2.2.10",
       "dependencies": {
         "@capacitor/app": "^8.0.0",
         "@capacitor/core": "^8.1.0",
diff --git a/src/App.tsx b/src/App.tsx
index a7526894..60879594 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -16,8 +16,8 @@ import NostrProvider from "@/components/NostrProvider";
 import { NostrSync } from "@/components/NostrSync";
 import { PlausibleProvider } from "@/components/PlausibleProvider";
 import { SentryProvider } from "@/components/SentryProvider";
-import { VersionCheck } from "@/components/VersionCheck";
-import { Toaster } from "@/components/ui/toaster";
+
+
 import { TooltipProvider } from "@/components/ui/tooltip";
 import { useNsecPasteGuard } from "@/hooks/useNsecPasteGuard";
 import type { AppConfig } from "@/contexts/AppContext";
@@ -201,12 +201,11 @@ export function App() {
                 <NostrProvider>
                   <NostrSync />
                   <NativeNotifications />
-                  <VersionCheck />
+
                     <NWCProvider>
                     <DMProvider config={dmConfig}>
                       <EmotionDevProvider>
                         <TooltipProvider>
-                          <Toaster />
                           <InitialSyncGate>
                             <AppRouter />
                           </InitialSyncGate>
diff --git a/src/AppRouter.tsx b/src/AppRouter.tsx
index eb072b34..44f74e2e 100644
--- a/src/AppRouter.tsx
+++ b/src/AppRouter.tsx
@@ -6,8 +6,10 @@ import { MinimizedAudioBar } from "@/components/MinimizedAudioBar";
 import { AudioPlayerProvider } from "@/contexts/AudioPlayerContext";
 import { BlobbiActionsProvider } from "@/blobbi/companion/interaction/BlobbiActionsProvider";
 import { sidebarItemIcon } from "@/lib/sidebarItems";
+import { Toaster } from "./components/ui/toaster";
 import { MainLayout } from "./components/MainLayout";
 import { ScrollToTop } from "./components/ScrollToTop";
+import { VersionCheck } from "./components/VersionCheck";
 import { useCurrentUser } from "./hooks/useCurrentUser";
 import { useProfileUrl } from "./hooks/useProfileUrl";
 import { getExtraKindDef } from "./lib/extraKinds";
@@ -136,6 +138,8 @@ export function AppRouter() {
   return (
     <AudioPlayerProvider>
       <BrowserRouter>
+        <Toaster />
+        <VersionCheck />
         <MinimizedAudioBar />
         <AudioNavigationGuard />
         <DeepLinkHandler />
diff --git a/src/components/VersionCheck.tsx b/src/components/VersionCheck.tsx
index 985a4fbb..e7fd9b17 100644
--- a/src/components/VersionCheck.tsx
+++ b/src/components/VersionCheck.tsx
@@ -19,8 +19,11 @@ async function fetchChangelogExcerpt(version: string): Promise<string | undefine
     const entry = entries.find((e) => e.version === version) ?? entries[0];
     if (!entry) return undefined;
 
-    // Return the first item from the first section.
-    return entry.sections[0]?.items[0];
+    // Return a truncated first item from the first section.
+    const item = entry.sections[0]?.items[0];
+    if (!item) return undefined;
+    if (item.length <= 60) return item;
+    return item.slice(0, 60).trimEnd() + '…';
   } catch {
     return undefined;
   }