fix: router links breaking on canvas

frontend/src/components/StudioComponent.vue

@@ -334,6 +334,10 @@ watch(
 
 const error = ref<Error | null>(null)
 onErrorCaptured((err, _instance, info) => {
+	const isRouterError = err.message.includes("No match for")
+	if (isRouterError) {
+		return false
+	}
 	console.error(
 		`Error while rendering StudioComponent ${props.block.componentName} ${props.block.componentId}:\n`,
 		`source: ${info}\n`,

frontend/src/pages/NotFound.vue

@@ -0,0 +1,9 @@
+<template>
+	<div class="flex h-screen w-full items-center justify-center bg-gray-50">
+		<div class="flex flex-col items-center justify-center">
+			<h1 class="mt-1 text-2xl font-semibold text-gray-600">404</h1>
+			<div class="mt-2 text-base text-gray-500">The page you are looking for does not exist.</div>
+			<a href="/desk" class="mt-4 text-base text-gray-600 underline">Back to Home</a>
+		</div>
+	</div>
+</template>

frontend/src/pages/NotPermitted.vue

@@ -5,7 +5,7 @@
 			<div class="mt-2 text-base text-gray-500">
 				You don't have permission to access this page. Make sure you have the right roles & permissions.
 			</div>
-			<a href="/app" class="mt-4 text-base text-gray-600 underline">Back to Home</a>
+			<a href="/desk" class="mt-4 text-base text-gray-600 underline">Back to Home</a>
 		</div>
 	</div>
 </template>

frontend/src/router/studio_router.ts

@@ -25,6 +25,11 @@ const routes = [
 		path: "/not-permitted",
 		name: "NotPermitted",
 		component: () => import("@/pages/NotPermitted.vue"),
+	},
+	{
+		path: "/:catchAll(.*)",
+		name: "NotFound",
+		component: () => import("@/pages/NotFound.vue"),
 	}
 ]
 
@@ -47,4 +52,15 @@ router.beforeEach(async (to, _, next) => {
 	return next()
 })
 
+// Patch router to resolve unmatched routes to NotFound page
+// This ensures router-link renders correctly for the app being edited in studio
+const resolve = router.resolve
+// @ts-ignore
+router.resolve = (to, currentLocation) => {
+	if (!to.matched?.length) {
+		to = "/not-found"
+	}
+	return resolve(to, currentLocation)
+}
+
 export default router