diff --git a/dev/dev.env.example b/dev/dev.env.example index fb338e0f..6439921b 100644 --- a/dev/dev.env.example +++ b/dev/dev.env.example @@ -9,7 +9,7 @@ POSTGRES_PASSWORD= ENVIRON=dev DEBUG=True SECRET_KEY= -DJANGO_ALLOWED_HOSTS=localhost 127.0.0.1 [::1] +DJANGO_ALLOWED_HOSTS=localhost 127.0.0.1 [::1] django SQL_ENGINE=django.db.backends.postgresql SQL_DATABASE= SQL_USER=postgres diff --git a/docker-compose.yml b/docker-compose.yml index ed4ed34c..4cd01664 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -48,6 +48,9 @@ services: container_name: vite env_file: - dev/dev.env + environment: + - VITE_APP_SERVER_URL=django://django:8000 + - VITE_APP_CLIENT_URL=vite://vite:5175 ports: - "5175:5175" develop: diff --git a/frontend/eslint.config.mjs b/frontend/eslint.config.mjs index 1c25763c..4d84a018 100644 --- a/frontend/eslint.config.mjs +++ b/frontend/eslint.config.mjs @@ -28,7 +28,12 @@ export default [ "no-console": "warn", indent: ["error", 2], "no-irregular-whitespace": "error", - "prettier/prettier": "error", + "prettier/prettier": [ + "error", + { + endOfLine: "auto", + }, + ], "react/no-unescaped-entities": "off", "@typescript-eslint/no-unused-vars": ["error"], "tailwindcss/no-contradicting-classname": "error", diff --git a/frontend/src/tw-components/CookieBanner.tsx b/frontend/src/tw-components/CookieBanner.tsx index a8e71781..0d91c25d 100644 --- a/frontend/src/tw-components/CookieBanner.tsx +++ b/frontend/src/tw-components/CookieBanner.tsx @@ -7,8 +7,7 @@ import Cookies from "js-cookie"; import { IconButton } from "components/components"; import { iconX } from "assets/images/images"; -// eslint-disable-next-line @typescript-eslint/no-unused-vars -function CookieBanner(props: { children: React.ReactNode }) { +function CookieBanner() { const [hidden, setIsHidden] = useState( Cookies.get("cookieConsent") !== undefined, ); diff --git a/frontend/src/vite-env.d.ts b/frontend/src/vite-env.d.ts new file mode 100644 index 00000000..87da5bc1 --- /dev/null +++ b/frontend/src/vite-env.d.ts @@ -0,0 +1,10 @@ +/// + +interface ImportMetaEnv { + readonly VITE_APP_TITLE: string; + // more env variables... +} + +interface ImportMeta { + readonly env: ImportMetaEnv; +} diff --git a/frontend/vite.config.mts b/frontend/vite.config.mts index 25057249..2feb224e 100644 --- a/frontend/vite.config.mts +++ b/frontend/vite.config.mts @@ -1,10 +1,16 @@ -import { defineConfig } from "vite"; +import { defineConfig, loadEnv } from "vite"; import react from "@vitejs/plugin-react"; import tsconfigPaths from "vite-tsconfig-paths"; import svgr from "vite-plugin-svgr"; import { resolve } from "path"; -export default defineConfig(() => { +export default defineConfig(({ mode }) => { + process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }; + + const SERVER_URL = `${ + process.env.VITE_APP_SERVER_URL ?? "http://localhost:8000" + }`; + return { //to resolve relative file paths for sass (no plugin) resolve: { @@ -22,6 +28,13 @@ export default defineConfig(() => { host: true, port: 5175, origin: "http://127.0.0.1:5175", + proxy: { + "/api": { + target: `${SERVER_URL}/api`, + changeOrigin: true, + rewrite: (path) => path.replace(/^\/api/, ""), + }, + }, watch: { usePolling: true, },