diff --git a/apps/journal/app/components/RouteMapThumbnail.tsx b/apps/journal/app/components/RouteMapThumbnail.client.tsx
similarity index 100%
rename from apps/journal/app/components/RouteMapThumbnail.tsx
rename to apps/journal/app/components/RouteMapThumbnail.client.tsx
diff --git a/apps/journal/app/routes/activities.$id.tsx b/apps/journal/app/routes/activities.$id.tsx
index 2ddb6f5..8907c24 100644
--- a/apps/journal/app/routes/activities.$id.tsx
+++ b/apps/journal/app/routes/activities.$id.tsx
@@ -9,7 +9,7 @@ import { listRoutes } from "~/lib/routes.server";
 import { ClientDate } from "~/components/ClientDate";
 
 const RouteMapThumbnail = lazy(() =>
-  import("~/components/RouteMapThumbnail").then((m) => ({ default: m.RouteMapThumbnail })),
+  import("~/components/RouteMapThumbnail.client").then((m) => ({ default: m.RouteMapThumbnail })),
 );
 
 export async function loader({ params, request }: Route.LoaderArgs) {
diff --git a/apps/journal/app/routes/activities._index.tsx b/apps/journal/app/routes/activities._index.tsx
index 6a4daef..903ce6a 100644
--- a/apps/journal/app/routes/activities._index.tsx
+++ b/apps/journal/app/routes/activities._index.tsx
@@ -7,7 +7,7 @@ import { listActivities } from "~/lib/activities.server";
 import { ClientDate } from "~/components/ClientDate";
 
 const RouteMapThumbnail = lazy(() =>
-  import("~/components/RouteMapThumbnail").then((m) => ({ default: m.RouteMapThumbnail })),
+  import("~/components/RouteMapThumbnail.client").then((m) => ({ default: m.RouteMapThumbnail })),
 );
 
 export async function loader({ request }: Route.LoaderArgs) {
diff --git a/apps/journal/app/routes/routes.$id.tsx b/apps/journal/app/routes/routes.$id.tsx
index 8773c2c..c78cb14 100644
--- a/apps/journal/app/routes/routes.$id.tsx
+++ b/apps/journal/app/routes/routes.$id.tsx
@@ -7,7 +7,7 @@ import { getRoute, getRouteWithVersions, deleteRoute, updateRoute } from "~/lib/
 import { ClientDate } from "~/components/ClientDate";
 
 const RouteMapThumbnail = lazy(() =>
-  import("~/components/RouteMapThumbnail").then((m) => ({ default: m.RouteMapThumbnail })),
+  import("~/components/RouteMapThumbnail.client").then((m) => ({ default: m.RouteMapThumbnail })),
 );
 
 
diff --git a/apps/journal/app/routes/routes._index.tsx b/apps/journal/app/routes/routes._index.tsx
index 1f4210c..8cb7ae8 100644
--- a/apps/journal/app/routes/routes._index.tsx
+++ b/apps/journal/app/routes/routes._index.tsx
@@ -7,7 +7,7 @@ import { listRoutes } from "~/lib/routes.server";
 import { ClientDate } from "~/components/ClientDate";
 
 const RouteMapThumbnail = lazy(() =>
-  import("~/components/RouteMapThumbnail").then((m) => ({ default: m.RouteMapThumbnail })),
+  import("~/components/RouteMapThumbnail.client").then((m) => ({ default: m.RouteMapThumbnail })),
 );
 
 export async function loader({ request }: Route.LoaderArgs) {