.devcontainer/docker_compose.yml

@@ -1,14 +0,0 @@
-name: advent22
-
-services:
-  api:
-    image: mcr.microsoft.com/devcontainers/python:3-3.14-trixie
-    volumes:
-      - ../:/workspaces/advent22:cached
-    command: sh -c "while sleep 1 & wait $!; do :; done"
-
-  ui:
-    image: mcr.microsoft.com/devcontainers/javascript-node:4-24-trixie
-    volumes:
-      - ../:/workspaces/advent22:cached
-    command: sh -c "while sleep 1 & wait $!; do :; done"

Dockerfile

@@ -24,6 +24,7 @@ COPY ui ./
 RUN --mount=type=cache,id=ui,target=/root/.yarn \
     set -ex; \
     \
+    yarn dlx update-browserslist-db@latest; \
     yarn build --outDir /opt/advent22/ui; \
     # exclude webpack-bundle-analyzer output
     rm -f /opt/advent22/ui/stats.html;

api/.devcontainer/devcontainer.json

@@ -4,10 +4,7 @@
     "name": "Advent22 API",
 
     // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
-	"dockerComposeFile": "../../.devcontainer/docker_compose.yml",
+    "image": "mcr.microsoft.com/devcontainers/python:3-3.14-trixie",
-	"service": "api",
-	"workspaceFolder": "/workspaces/advent22/api",
-    "runServices": ["api"],
 
     // Features to add to the dev container. More info: https://containers.dev/features.
     "features": {
@@ -59,4 +56,4 @@
 
     // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
     // "remoteUser": "root"
-}
+}

api/advent22_api/app.py

@@ -1,4 +1,5 @@
 from fastapi import FastAPI
+from fastapi.middleware.cors import CORSMiddleware
 from fastapi.staticfiles import StaticFiles
 
 from .core.settings import SETTINGS
@@ -32,3 +33,15 @@ if SETTINGS.production_mode:
         ),
         name="frontend",
     )
+
+else:
+    # Allow CORS in debug mode
+    app.add_middleware(
+        # HACK: suppress while unresolved https://github.com/astral-sh/ty/issues/1635
+        CORSMiddleware,  # ty: ignore[invalid-argument-type]
+        allow_credentials=True,
+        allow_origins=["*"],
+        allow_methods=["*"],
+        allow_headers=["*"],
+        expose_headers=["*"],
+    )

ui/.devcontainer/devcontainer.json

@@ -4,10 +4,7 @@
   "name": "Advent22 UI",
 
   // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
-	"dockerComposeFile": "../../.devcontainer/docker_compose.yml",
+  "image": "mcr.microsoft.com/devcontainers/javascript-node:4-24-trixie",
-	"service": "ui",
-	"workspaceFolder": "/workspaces/advent22/ui",
-  "runServices": ["ui"],
 
   // Features to add to the dev container. More info: https://containers.dev/features.
   "features": {
@@ -47,7 +44,7 @@
   // "postCreateCommand": "yarn install",
 
   // Use 'postStartCommand' to run commands after the container is started.
-  "postStartCommand": "yarn install"
+  "postStartCommand": "yarn dlx update-browserslist-db@latest && yarn install"
 
   // Use 'forwardPorts' to make a list of ports inside the container available locally.
   // "forwardPorts": [],

ui/src/lib/api.ts

@@ -16,9 +16,19 @@ interface Params {
 }
 
 export class API {
+  private static get api_baseurl(): string {
+    // in production mode, return "proto://hostname/api"
+    if (import.meta.env.PROD) {
+      return `${window.location.protocol}//${window.location.host}/api`;
+    }
+
+    // in development mode, return "proto://hostname:8000/api"
+    return `${window.location.protocol}//${window.location.hostname}:8000/api`;
+  }
+
   private static readonly axios = axios.create({
-    timeout: 15e3,
+    timeout: 10e3,
-    baseURL: "/api",
+    baseURL: this.api_baseurl,
   });
 
   private static readonly creds_key = "advent22/credentials";

ui/vite.config.ts

@@ -9,8 +9,8 @@ import vueDevTools from "vite-plugin-vue-devtools";
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [
-    vue(),
+vue(),
-    vueDevTools(),
+vueDevTools(),
     analyzer({
       analyzerMode: "static",
     }),
@@ -22,24 +22,12 @@ export default defineConfig({
       },
     }),
   ],
-
   resolve: {
     alias: {
       "@": fileURLToPath(new URL("./src", import.meta.url)),
     },
   },
-
   build: {
     sourcemap: true,
   },
-
-  server: {
-    proxy: {
-      '/api': {
-        target: 'http://api:8000',
-        changeOrigin: true,
-        secure: false,
-      },
-    },
-  },
 });