fix: realtime connection

src/lib/stores/sdk.ts

@@ -63,6 +63,9 @@ const endpoint = getApiEndpoint();
 const clientConsole = new Client();
 clientConsole.setEndpoint(endpoint).setProject('console');
 
+const clientRealtime = new Client();
+clientRealtime.setProject('console');
+
 const clientProject = new Client();
 clientProject.setMode('admin');
 
@@ -86,6 +89,16 @@ const sdkForProject = {
     migrations: new Migrations(clientProject)
 };
 
+export const realtime = {
+    forProject(region: string, _projectId: string) {
+        const endpoint = getApiEndpoint(region);
+        if (endpoint !== clientRealtime.config.endpoint) {
+            clientRealtime.setEndpoint(endpoint);
+        }
+        return clientRealtime;
+    }
+};
+
 export const sdk = {
     forConsole: {
         client: clientConsole,

src/routes/(console)/project-[region]-[project]/+layout.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
     import { BackupRestoreBox, MigrationBox, UploadBox } from '$lib/components';
-    import { sdk } from '$lib/stores/sdk';
+    import { realtime, sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
     import { project, stats } from './store';
 
@@ -25,9 +25,10 @@
     } from '$lib/stores/roles';
 
     onMount(() => {
-        return sdk
+        return realtime
             .forProject($page.params.region, $page.params.project)
-            .client.subscribe(['project', 'console'], (response) => {
+            .subscribe(['project', 'console'], (response) => {
+                console.log(response);
                 if (response.events.includes('stats.connections')) {
                     for (const [projectId, value] of Object.entries(response.payload)) {
                         stats.add(projectId, [new Date(response.timestamp).toISOString(), value]);

src/routes/(console)/project-[region]-[project]/functions/function-[function]/executions/+page.svelte

@@ -5,7 +5,7 @@
     import { Button } from '$lib/elements/forms';
     import { hoursToDays } from '$lib/helpers/date';
     import { Container, ContainerHeader } from '$lib/layout';
-    import { sdk } from '$lib/stores/sdk';
+    import { realtime, sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
     import { func } from '../store';
     import { organization } from '$lib/stores/organization';
@@ -147,9 +147,9 @@
     let showMobileFilters = false;
     onMount(() => {
         data?.query ? (showMobileFilters = true) : (showMobileFilters = false);
-        return sdk
+        return realtime
             .forProject($page.params.region, $page.params.project)
-            .client.subscribe('functions.*.executiole', (response) => {
+            .subscribe('functions.*.executions', (response) => {
                 if (response.events.includes('functions.*.executions.*')) {
                     invalidate(Dependencies.EXECUTIONS);
                 }