diff --git a/apps/web/package.json b/apps/web/package.json
index 350483e427..bed8262eb9 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -23,6 +23,7 @@
 		"vite": "catalog:"
 	},
 	"dependencies": {
+		"@rails/actioncable": "^7.2.100",
 		"@sentry/sveltekit": "^8.9.2",
 		"highlight.js": "^11.10.0",
 		"marked": "^10.0.0",
diff --git a/apps/web/src/routes/projects/[projectId]/branches/[branchId]/stack/[changeId]/+page.svelte b/apps/web/src/routes/projects/[projectId]/branches/[branchId]/stack/[changeId]/+page.svelte
index 8a7d2b3f78..70f20be350 100644
--- a/apps/web/src/routes/projects/[projectId]/branches/[branchId]/stack/[changeId]/+page.svelte
+++ b/apps/web/src/routes/projects/[projectId]/branches/[branchId]/stack/[changeId]/+page.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import DiffPatch from '$lib/components/DiffPatch.svelte';
 	import DiffPatchArray from '$lib/components/DiffPatchArray.svelte';
+	import { createConsumer } from '@rails/actioncable';
 	import { marked } from 'marked';
 	import { onMount } from 'svelte';
 	import Gravatar from 'svelte-gravatar';
@@ -13,12 +14,15 @@
 	let events: any = [];
 	let key: any = '';
 	let uuid: any = '';
+	let consumer;
 
 	export let data: any;
 
 	onMount(() => {
 		key = localStorage.getItem('gb_access_token');
 
+		listenToChat(key);
+
 		let projectId = data.projectId;
 		let branchId = data.branchId;
 		let changeId = data.changeId;
@@ -46,6 +50,21 @@
 		}
 	});
 
+	function listenToChat(token: string) {
+		// connect to actioncable to subscribe to chat events
+		let wsHost = env.PUBLIC_APP_HOST.replace('http', 'ws') + 'cable';
+		consumer = createConsumer(wsHost + '?token=' + token);
+		consumer.subscriptions.create(
+			{ channel: 'ChatChannel', change_id: data.changeId, project_id: data.projectId },
+			{
+				received(data: any) {
+					// todo: update chat window with new message
+					console.log('received', data);
+				}
+			}
+		);
+	}
+
 	function scrollToBottom() {
 		let chatWindow = document.querySelector<HTMLElement>('.chatWindow');
 		if (chatWindow) {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index eb7641bcd3..d43ed08a55 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -273,6 +273,9 @@ importers:
 
   apps/web:
     dependencies:
+      '@rails/actioncable':
+        specifier: ^7.2.100
+        version: 7.2.100
       '@sentry/sveltekit':
         specifier: ^8.9.2
         version: 8.9.2(@opentelemetry/api@1.9.0)(@opentelemetry/core@1.25.0(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.52.0(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.25.0(@opentelemetry/api@1.9.0))(@opentelemetry/semantic-conventions@1.25.0)(@sveltejs/kit@2.5.25(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@5.0.0-next.243)(vite@5.2.13(@types/node@22.3.0)))(svelte@5.0.0-next.243)(vite@5.2.13(@types/node@22.3.0)))(svelte@5.0.0-next.243)
@@ -1200,6 +1203,9 @@ packages:
     engines: {node: '>=16.3.0'}
     hasBin: true
 
+  '@rails/actioncable@7.2.100':
+    resolution: {integrity: sha512-7xtIENf0Yw59AFDM3+xqxPCZxev3QVAqjPmUzmgsB9eL8S/zTpB0IU9srNc7XknzJI4e09XKNnCaJRx3gfYzXA==}
+
   '@replit/codemirror-lang-svelte@6.0.0':
     resolution: {integrity: sha512-U2OqqgMM6jKelL0GNWbAmqlu1S078zZNoBqlJBW+retTc5M4Mha6/Y2cf4SVg6ddgloJvmcSpt4hHrVoM4ePRA==}
     peerDependencies:
@@ -6982,6 +6988,8 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@rails/actioncable@7.2.100': {}
+
   '@replit/codemirror-lang-svelte@6.0.0(@codemirror/autocomplete@6.16.2(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.26.3)(@lezer/common@1.2.1))(@codemirror/lang-css@6.2.1(@codemirror/view@6.26.3))(@codemirror/lang-html@6.4.9)(@codemirror/lang-javascript@6.2.2)(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.26.3)(@lezer/common@1.2.1)(@lezer/highlight@1.2.0)(@lezer/javascript@1.4.16)(@lezer/lr@1.4.1)':
     dependencies:
       '@codemirror/autocomplete': 6.16.2(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.26.3)(@lezer/common@1.2.1)