✨ into shared compose project

- vite can proxy requests to the api in dev mode
- no more CORS needed in api
- static api_baseurl in axios config

.devcontainer/docker_compose.yml

@@ -0,0 +1,14 @@
+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"

api/.devcontainer/devcontainer.json

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

api/advent22_api/app.py

@@ -1,5 +1,4 @@
 from fastapi import FastAPI
-from fastapi.middleware.cors import CORSMiddleware
 from fastapi.staticfiles import StaticFiles
 
 from .core.settings import SETTINGS
@@ -33,15 +32,3 @@ 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,7 +4,10 @@
   "name": "Advent22 UI",
 
   // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
-  "image": "mcr.microsoft.com/devcontainers/javascript-node:4-24-trixie",
+	"dockerComposeFile": "../../.devcontainer/docker_compose.yml",
+	"service": "ui",
+	"workspaceFolder": "/workspaces/advent22/ui",
+  "runServices": ["ui"],
 
   // Features to add to the dev container. More info: https://containers.dev/features.
   "features": {

ui/src/lib/api.ts

@@ -16,19 +16,9 @@ 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: 10e3,
-    baseURL: this.api_baseurl,
+    timeout: 15e3,
+    baseURL: "/api",
   });
 
   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(),
-vueDevTools(),
+    vue(),
+    vueDevTools(),
     analyzer({
       analyzerMode: "static",
     }),
@@ -22,12 +22,24 @@ vueDevTools(),
       },
     }),
   ],
+
   resolve: {
     alias: {
       "@": fileURLToPath(new URL("./src", import.meta.url)),
     },
   },
+
   build: {
     sourcemap: true,
   },
+
+  server: {
+    proxy: {
+      '/api': {
+        target: 'http://api:8000',
+        changeOrigin: true,
+        secure: false,
+      },
+    },
+  },
 });