Good catches

frontend/sync-client/src/services/build-vault-url.ts

@@ -0,0 +1,8 @@
+import type { Settings } from "../persistence/settings";
+
+export function buildVaultUrl(settings: Settings, path: string): string {
+    const { vaultName, remoteUri } = settings.getSettings();
+    const remoteUriWithoutTrailingSlash = remoteUri.replace(/\/+$/, "");
+    const encodedVaultName = encodeURIComponent(vaultName.trim());
+    return `${remoteUriWithoutTrailingSlash}/vaults/${encodedVaultName}${path}`;
+}

frontend/sync-client/src/services/server-config.ts

@@ -1,6 +1,7 @@
 import { SUPPORTED_API_VERSION } from "../consts";
 import { AuthenticationError } from "../errors/authentication-error";
 import { ServerVersionMismatchError } from "../errors/server-version-mismatch-error";
+import type { Settings } from "../persistence/settings";
 import type { SyncService } from "./sync-service";
 import type { PingResponse } from "./types/PingResponse";
 
@@ -14,7 +15,20 @@ export class ServerConfig {
     private response: Promise<PingResponse> | undefined;
     private config: ServerConfigData | undefined;
 
-    public constructor(private readonly syncService: SyncService) { }
+    public constructor(
+        private readonly syncService: SyncService,
+        settings: Settings
+    ) {
+        settings.onSettingsChanged.add((newSettings, oldSettings) => {
+            if (
+                newSettings.token !== oldSettings.token ||
+                newSettings.vaultName !== oldSettings.vaultName ||
+                newSettings.remoteUri !== oldSettings.remoteUri
+            ) {
+                this.reset();
+            }
+        });
+    }
 
     private static validateConfig(config: ServerConfigData): void {
         if (config.supportedApiVersion !== SUPPORTED_API_VERSION) {

frontend/sync-client/src/services/sync-service.ts

@@ -17,6 +17,7 @@ import type { DocumentVersion } from "./types/DocumentVersion";
 import type { FetchLatestDocumentsResponse } from "./types/FetchLatestDocumentsResponse";
 import type { PingResponse } from "./types/PingResponse";
 import type { UpdateTextDocumentVersion } from "./types/UpdateTextDocumentVersion";
+import { buildVaultUrl } from "./build-vault-url";
 
 export class SyncService {
     private readonly client: typeof globalThis.fetch;
@@ -385,10 +386,7 @@ export class SyncService {
     }
 
     private getUrl(path: string): string {
-        const { vaultName, remoteUri } = this.settings.getSettings();
-        const remoteUriWithoutTrailingSlash = remoteUri.replace(/\/+$/, "");
-        const encodedVaultName = encodeURIComponent(vaultName.trim());
-        return `${remoteUriWithoutTrailingSlash}/vaults/${encodedVaultName}${path}`;
+        return buildVaultUrl(this.settings, path);
     }
 
     private getDefaultHeaders(

frontend/sync-client/src/services/websocket-manager.ts

@@ -12,6 +12,7 @@ import {
 import { removeFromArray } from "../utils/remove-from-array";
 import { EventListeners } from "../utils/data-structures/event-listeners";
 import { awaitAll } from "../utils/await-all";
+import { buildVaultUrl } from "./build-vault-url";
 
 export class WebSocketManager {
     public readonly onWebSocketStatusChanged = new EventListeners<
@@ -198,9 +199,11 @@ export class WebSocketManager {
             this.outstandingPromises.length = 0;
         }
 
-        const wsUri = new URL(this.settings.getSettings().remoteUri);
-        wsUri.protocol = wsUri.protocol === "https" ? "wss" : "ws";
-        wsUri.pathname = `/vaults/${this.settings.getSettings().vaultName}/ws`;
+        // Build the WS URL through the same vault-URL helper the HTTP client
+        // uses so vault-name encoding, trailing-slash stripping, and any path
+        // prefix in `remoteUri` stay in sync between transports.
+        const wsUri = new URL(buildVaultUrl(this.settings, "/ws"));
+        wsUri.protocol = wsUri.protocol.startsWith("https") ? "wss" : "ws";
 
         this.logger.info(`Connecting to WebSocket at ${wsUri.toString()}`);