web: restore CSS injection and degrade gracefully without WS endpoint

- Use style-loader + css-loader for .css files (fix dashboard styling)
- Add css/style loader deps to web package
- WebSocket service now falls back to REST-only mode when /ws is unavailable
  to avoid noisy reconnect/error spam in dev

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: vsilent

web/package.json

@@ -58,7 +58,9 @@
     "@typescript-eslint/parser": "^6.14.0",
     "@typescript-eslint/eslint-plugin": "^6.14.0",
     "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.6.0"
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "style-loader": "^4.0.0",
+    "css-loader": "^7.1.2"
   },
   "browserslist": {
     "production": [

web/src/services/websocket.ts

@@ -26,6 +26,7 @@ export class WebSocketService {
   private reconnectDelay = 1000;
   private eventHandlers: Map<WebSocketEvent, Set<EventHandler>> = new Map();
   private shouldReconnect = true;
+  private failedInitialConnect = false;
 
   constructor(url?: string) {
     const env = ((globalThis as { __STACKDOG_ENV__?: EnvLike }).__STACKDOG_ENV__ ??
@@ -37,6 +38,10 @@ export class WebSocketService {
   connect(): Promise<void> {
     return new Promise((resolve, reject) => {
       try {
+        if (this.failedInitialConnect) {
+          resolve();
+          return;
+        }
         this.ws = new WebSocket(this.url);
 
         this.ws.onopen = () => {
@@ -56,17 +61,23 @@ export class WebSocketService {
 
         this.ws.onclose = () => {
           console.log('WebSocket disconnected');
-          if (this.shouldReconnect && this.reconnectAttempts < this.maxReconnectAttempts) {
+          if (!this.failedInitialConnect && this.shouldReconnect && this.reconnectAttempts < this.maxReconnectAttempts) {
             this.scheduleReconnect();
           }
         };
 
         this.ws.onerror = (error) => {
-          console.error('WebSocket error:', error);
-          reject(error);
+          // WebSocket endpoint may be intentionally unavailable in some environments.
+          // Fall back to REST-only mode after the first failed connect.
+          this.failedInitialConnect = true;
+          this.shouldReconnect = false;
+          console.warn('WebSocket unavailable, running in polling mode');
+          resolve();
         };
       } catch (error) {
-        reject(error);
+        this.failedInitialConnect = true;
+        this.shouldReconnect = false;
+        resolve();
       }
     });
   }
@@ -110,6 +121,7 @@ export class WebSocketService {
 
   disconnect(): void {
     this.shouldReconnect = false;
+    this.failedInitialConnect = false;
     if (this.ws) {
       this.ws.close();
       this.ws = null;

web/webpack.config.js

@@ -22,7 +22,7 @@ module.exports = {
       },
       {
         test: /\.css$/,
-        type: 'asset/source',
+        use: ['style-loader', 'css-loader'],
       },
     ],
   },