Fixed admin deep links with yarn dev:forward

closes https://linear.app/ghost/issue/BER-3090/invites-are-broken-in-yarn-devforward

We need to handle deep links the same way as the Ghost backend in the Vite dev
server for invite links and password resets to work as expected.

Author: jonatansberg

apps/admin/tsconfig.node.json

@@ -21,5 +21,5 @@
     "noFallthroughCasesInSwitch": true,
     "noUncheckedSideEffectImports": true
   },
-  "include": ["vite.config.ts", "vite-ember-assets.ts", "vite-backend-proxy.ts"]
+  "include": ["./vite*.ts",]
 }

apps/admin/vite-deep-links.ts

@@ -0,0 +1,37 @@
+import type { Plugin, ViteDevServer, PreviewServer } from "vite";
+
+/**
+ * Vite plugin that redirects admin deep-link URLs to hash-based URLs.
+ *
+ * Mirrors ghost/core/core/server/web/admin/middleware/redirect-admin-urls.js
+ * so that direct navigation to paths like /ghost/posts/123 redirects to /ghost/#/posts/123
+ *
+ * By registering as a post-middleware, static assets and API requests are handled first,
+ * and only unhandled requests trigger the redirect.
+ */
+export function deepLinksPlugin(): Plugin {
+    function addRedirectMiddleware(server: ViteDevServer | PreviewServer) {
+        const base = (server.config.base ?? "/ghost").replace(/\/$/, "");
+        const pathRegex = new RegExp(`^${base}/(.+)`);
+
+        return () => {
+            server.middlewares.use((req, res, next) => {
+                const match = req.originalUrl?.match(pathRegex);
+
+                if (match) {
+                    res.writeHead(302, { Location: `${base}/#/${match[1]}` });
+                    res.end();
+                    return;
+                }
+
+                next();
+            });
+        };
+    }
+
+    return {
+        name: "deep-links",
+        configureServer: addRedirectMiddleware,
+        configurePreviewServer: addRedirectMiddleware,
+    };
+}

apps/admin/vite.config.ts

@@ -5,13 +5,14 @@ import react from "@vitejs/plugin-react-swc";
 
 import { emberAssetsPlugin } from "./vite-ember-assets";
 import { ghostBackendProxyPlugin } from "./vite-backend-proxy";
+import { deepLinksPlugin } from "./vite-deep-links";
 
 const GHOST_CARDS_PATH = resolve(__dirname, "../../ghost/core/core/frontend/src/cards");
 
 // https://vite.dev/config/
 export default defineConfig({
     base: process.env.GHOST_CDN_URL ?? "/ghost",
-    plugins: [react(), emberAssetsPlugin(), ghostBackendProxyPlugin(), tsconfigPaths()],
+    plugins: [react(), emberAssetsPlugin(), ghostBackendProxyPlugin(), deepLinksPlugin(), tsconfigPaths()],
     define: {
         "process.env.DEBUG": false, // Shim env var utilized by the @tryghost/nql package
     },