diff --git a/web/index.html b/web/index.html
index 05efba8..2246b38 100644
--- a/web/index.html
+++ b/web/index.html
@@ -6,6 +6,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=WDXL+Lubrifont+TC&display=swap" rel="stylesheet">
+    <script src="public/hmr-runtime-inject.js"></script>
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>ShiftSync</title>
   </head>
diff --git a/web/public/hmr-runtime-inject.js b/web/public/hmr-runtime-inject.js
new file mode 100644
index 0000000..6868556
--- /dev/null
+++ b/web/public/hmr-runtime-inject.js
@@ -0,0 +1,5 @@
+window.__vite_plugin_hmrOptions = {
+  protocol: location.protocol === 'https:' ? 'wss' : 'ws',
+  host: location.hostname,
+  port: location.port || (location.protocol === 'https:' ? 443 : 80),
+};
\ No newline at end of file
diff --git a/web/vite.config.js b/web/vite.config.js
index 51ebd1c..deaa114 100644
--- a/web/vite.config.js
+++ b/web/vite.config.js
@@ -3,39 +3,18 @@ import react from '@vitejs/plugin-react';
 import path from 'path';
 
 // https://vite.dev/config/
-export default defineConfig(({ mode = 'local' }) => {
-  const isDev = mode === 'dev';
-  const isProd = mode === 'prod';
-
-  return {
-    plugins: [react()],
-    server:{
-      host: true,
-      allowedHosts: true,
-      cors: true,
-      hmr: isDev
-        ? {
-            protocol: 'wss',
-            host: 'shift-dev.code-catalyst.com',
-            clientPort: 443,
-          }
-        : isProd ? 
-          {
-            protocol: 'wss',
-            host: 'shift.code-catalyst.com',
-            clientPort: 443,
-          }
-        : {
-            protocol: 'wss',
-            host: 'localhost',
-            clientPort: 443,
-        },
+export default defineConfig({
+  plugins: [react()],
+  server:{
+    host: true,
+    allowedHosts: true,
+    cors: true,
+    hmr: true
+  },
+  resolve: {
+    alias: {
+      '@src': path.resolve(__dirname, 'src'),
+      '@components': path.resolve(__dirname, 'components')
     },
-    resolve: {
-      alias: {
-        '@src': path.resolve(__dirname, 'src'),
-        '@components': path.resolve(__dirname, 'components')
-      },
-    },
-  }
+  },
 });