fix: use environment variables

app/package.json

@@ -3,6 +3,7 @@
   "version": "1.0.0",
   "description": "",
   "main": "index.js",
+  "type": "module",
   "scripts": {
     "dev": "vite",
     "build": "vite build"

app/src/services/ObsClient.ts

@@ -1,10 +1,12 @@
+import { getEnvOrThrow } from '../utils/env';
+
 class ObsClient {
   private client: WebSocket;
   private connected: boolean = false;
 
   constructor() {
     console.log('ObsClient constructor');
-    this.client = new WebSocket('ws://bc.talpa-world.com:4455');
+    this.client = new WebSocket(getEnvOrThrow('VITE_OBS_WEBSOCKET_URL'));
 
     this.client.onopen = () => {
       console.log('ObsClient connected');

app/src/utils/env.ts

@@ -0,0 +1,5 @@
+export const getEnvOrThrow = (key: string): string => {
+  const value = import.meta.env[key];
+  if (!value) throw new Error(`Missing environment variable: ${key}`);
+  return value;
+};

app/tsconfig.json

@@ -2,8 +2,9 @@
   "compilerOptions": {
     "esModuleInterop": true,
     "jsx": "react",
-    "module": "NodeNext",
+    "module": "ESNext",
     "moduleResolution": "Node",
-    "target": "ESNext"
+    "target": "ESNext",
+    "types": ["vite/client"]
   }
 }

docker-compose.yml

@@ -20,12 +20,16 @@ services:
       - ./server/assets:/app/assets:rw
     ports:
       - "3000:3000"
+    environment:
+      - OBS_WEBSOCKET_URL=ws://bc.talpa-world.com:4455
   front:
     build:
       context: app
       dockerfile: Dockerfile
     container_name: front
     ports:
       - "5173:5173"
+    environment:
+      - VITE_OBS_WEBSOCKET_URL=ws://bc.talpa-world.com:4455
     depends_on:
       - api

server/src/services/ObsClient.ts

@@ -1,4 +1,5 @@
 import WebSocket from "ws";
+import { getEnvOrThrow } from "../utils/env";
 
 class ObsClient {
   public client: WebSocket;
@@ -7,7 +8,7 @@ class ObsClient {
   async connect(): Promise<void> {
     console.log("ObsClient connecting...");
     return new Promise<void>((resolve, reject) => {
-      this.client = new WebSocket("ws://bc.talpa-world.com:4455");
+      this.client = new WebSocket(getEnvOrThrow("OBS_WEBSOCKET_URL"));
 
       this.client.onopen = () => {
         console.log("ObsClient connected");

server/src/utils/env.ts

@@ -0,0 +1,5 @@
+export const getEnvOrThrow = (key: string): string => {
+  const value = process.env[key];
+  if (!value) throw new Error(`Missing environment variable: ${key}`);
+  return value;
+};