Fix redirect paths and enable authentication and new dashboard by default

app/ide-desktop/lib/content/src/index.ts

@@ -20,6 +20,9 @@ const logger = app.log.logger
 const ESBUILD_PATH = '/esbuild'
 /** SSE event indicating a build has finished. */
 const ESBUILD_EVENT_NAME = 'change'
+/** Path to the service worker that resolves all extensionless paths to `/index.html`.
+ * This service worker is required for client-side routing to work when doing `./run gui watch`. */
+const SERVICE_WORKER_PATH = '/serviceWorker.js'
 /** One second in milliseconds. */
 const SECOND = 1000
 /** Time in seconds after which a `fetchTimeout` ends. */
@@ -33,6 +36,11 @@ if (IS_DEV_MODE) {
     new EventSource(ESBUILD_PATH).addEventListener(ESBUILD_EVENT_NAME, () => {
         location.reload()
     })
+    try {
+        void navigator.serviceWorker.register(SERVICE_WORKER_PATH)
+    } catch {
+        // Ignored.
+    }
 }
 
 // =============

app/ide-desktop/lib/content/src/serviceWorker.ts

@@ -0,0 +1,28 @@
+/** @file A service worker that redirects paths without extensions to `/index.html`.
+ * This is only used in the cloud frontend. */
+/// <reference lib="WebWorker" />
+
+// =====================
+// === Fetch handler ===
+// =====================
+
+// We `declare` a variable here because Service Workers have a different global scope.
+// eslint-disable-next-line no-restricted-syntax
+declare const self: ServiceWorkerGlobalScope
+
+self.addEventListener('fetch', event => {
+    const url = new URL(event.request.url)
+    if (
+        url.hostname === 'localhost' &&
+        /\/[^.]+$/.test(event.request.url) &&
+        url.pathname !== '/esbuild'
+    ) {
+        event.respondWith(fetch('/index.html'))
+        return
+    } else {
+        return false
+    }
+})
+
+// Required for TypeScript to consider it a module, instead of in window scope.
+export {}

app/ide-desktop/lib/content/watch.ts

@@ -1,4 +1,7 @@
 /** @file File watch and compile service. */
+import * as path from 'node:path'
+import * as url from 'node:url'
+
 import * as esbuild from 'esbuild'
 import * as portfinder from 'portfinder'
 import chalk from 'chalk'
@@ -10,6 +13,8 @@ import * as dashboardBundler from '../dashboard/esbuild-config'
 // === Constants ===
 // =================
 
+/** The path of this file. */
+const THIS_PATH = path.resolve(path.dirname(url.fileURLToPath(import.meta.url)))
 const PORT = 8080
 const HTTP_STATUS_OK = 200
 
@@ -29,6 +34,10 @@ async function watch() {
         ...bundler.argumentsFromEnv(),
         devMode: true,
     })
+    opts.entryPoints.push({
+        in: path.resolve(THIS_PATH, 'src', 'serviceWorker.ts'),
+        out: 'serviceWorker',
+    })
     const builder = await esbuild.context(opts)
     await builder.watch()
     await builder.serve({

app/ide-desktop/lib/dashboard/esbuild-config.ts

@@ -103,7 +103,7 @@ function esbuildPluginGenerateTailwind(): esbuild.Plugin {
 
 /** Generate the bundler options. */
 export function bundlerOptions(args: Arguments) {
-    const { outputPath } = args
+    const { outputPath, devMode } = args
     const buildOptions = {
         absWorkingDir: THIS_PATH,
         bundle: true,
@@ -121,7 +121,7 @@ export function bundlerOptions(args: Arguments) {
         define: {
             // We are defining a constant, so it should be `CONSTANT_CASE`.
             // eslint-disable-next-line @typescript-eslint/naming-convention
-            IS_DEV_MODE: JSON.stringify(args.devMode),
+            IS_DEV_MODE: JSON.stringify(devMode),
         },
         sourcemap: true,
         minify: true,

app/ide-desktop/lib/dashboard/src/authentication/src/config.ts

@@ -17,7 +17,7 @@ const CLOUD_REDIRECTS = {
      * when it is created. In the native app, the port is unpredictable, but this is not a problem
      * because the native app does not use port-based redirects, but deep links. */
     development: newtype.asNewtype<auth.OAuthRedirect>('http://localhost:8081'),
-    production: newtype.asNewtype<auth.OAuthRedirect>('https://cloud.enso.org'),
+    production: newtype.asNewtype<auth.OAuthRedirect>('http://localhost:8080'),
 }
 
 /** All possible API URLs, sorted by environment. */

app/ide-desktop/lib/dashboard/watch.ts

@@ -7,12 +7,12 @@ import chalk from 'chalk'
 
 import * as bundler from './esbuild-config'
 
-export const THIS_PATH = path.resolve(path.dirname(url.fileURLToPath(import.meta.url)))
-
 // =================
 // === Constants ===
 // =================
 
+/** The path of this file. */
+const THIS_PATH = path.resolve(path.dirname(url.fileURLToPath(import.meta.url)))
 /** This must be port `8081` because it is defined as such in AWS. */
 const PORT = 8081
 const HTTP_STATUS_OK = 200