Replace polling with websocket live sync

src/App.test.tsx

@@ -1,7 +1,9 @@
-import { render, screen, within } from '@testing-library/react';
+import { render, screen, waitFor, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { beforeEach, describe, expect, it } from 'vitest';
 import App from './App';
+import { fallbackDashboardSnapshot } from './data/mockDashboard';
+import { MockWebSocket } from './test/setup';
 
 async function loginIntoPanel(user: ReturnType<typeof userEvent.setup>) {
   await user.type(screen.getByLabelText(/login/i), 'admin');
@@ -13,6 +15,7 @@ beforeEach(() => {
   document.documentElement.dataset.theme = '';
   window.sessionStorage.clear();
   window.localStorage.clear();
+  window.history.replaceState(null, '', '/');
 });
 
 describe('App login gate', () => {
@@ -66,7 +69,7 @@ describe('App login gate', () => {
     render(<App />);
 
     expect(screen.getByRole('button', { name: /панель/i })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: /настройки/i })).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: /^настройки$/i })).toBeInTheDocument();
   });
 
   it('stores panel theme in localStorage and restores it after a remount', async () => {
@@ -85,6 +88,23 @@ describe('App login gate', () => {
     expect(document.documentElement.dataset.theme).toBe('dark');
   });
 
+  it('keeps tab navigation in the hash and restores the active tab after remount', async () => {
+    const user = userEvent.setup();
+    const firstRender = render(<App />);
+
+    await loginIntoPanel(user);
+    await user.click(screen.getByRole('button', { name: /users/i }));
+
+    expect(window.location.hash).toBe('#users');
+    expect(screen.getByRole('button', { name: /new user/i })).toBeInTheDocument();
+
+    firstRender.unmount();
+    render(<App />);
+
+    expect(window.location.hash).toBe('#users');
+    expect(screen.getByRole('button', { name: /new user/i })).toBeInTheDocument();
+  });
+
   it('opens add-user flow in a modal and closes it on escape', async () => {
     const user = userEvent.setup();
     render(<App />);
@@ -170,6 +190,33 @@ describe('App login gate', () => {
     expect(screen.getAllByText(/gw\.example\.net:1180/i).length).toBeGreaterThan(0);
   });
 
+  it('does not overwrite dirty system settings when a websocket patch arrives', async () => {
+    const user = userEvent.setup();
+    render(<App />);
+
+    await loginIntoPanel(user);
+    await waitFor(() => expect(MockWebSocket.instances.length).toBeGreaterThan(0));
+    const socket = MockWebSocket.instances[0];
+
+    await user.click(screen.getByRole('button', { name: /settings/i }));
+
+    const endpointInput = screen.getByLabelText(/proxy endpoint/i);
+    await user.clear(endpointInput);
+    await user.type(endpointInput, 'draft.example.net');
+
+    socket.emitMessage({
+      type: 'snapshot.patch',
+      patch: {
+        system: {
+          ...fallbackDashboardSnapshot.system,
+          publicHost: 'server-sync.example.net',
+        },
+      },
+    });
+
+    expect(screen.getByLabelText(/proxy endpoint/i)).toHaveValue('draft.example.net');
+  });
+
   it('warns before deleting a service and removes linked users after confirmation', async () => {
     const user = userEvent.setup();
     render(<App />);