feat(web): ws - on_config_update (#4378)

web/src/lib/components/admin-page/settings/map-settings/map-settings.svelte

@@ -12,7 +12,6 @@
   import SettingInputField, { SettingInputFieldType } from '../setting-input-field.svelte';
   import SettingSwitch from '../setting-switch.svelte';
   import SettingSelect from '../setting-select.svelte';
-  import { loadConfig } from '$lib/stores/server-config.store';
 
   export let config: SystemConfigDto; // this is the config that is being edited
   export let disabled = false;
@@ -48,9 +47,6 @@
       savedConfig = cloneDeep(updated);
 
       notificationController.show({ message: 'Settings saved', type: NotificationType.Info });
-      // TODO: Use websockets to reload feature params instead once websocket for client is merged
-      // Reload feature params in the background
-      loadConfig();
     } catch (error) {
       handleError(error, 'Unable to save settings');
     }

web/src/lib/components/admin-page/settings/trash-settings/trash-settings.svelte

@@ -10,7 +10,6 @@
   import SettingButtonsRow from '../setting-buttons-row.svelte';
   import SettingSwitch from '../setting-switch.svelte';
   import SettingInputField, { SettingInputFieldType } from '../setting-input-field.svelte';
-  import { loadConfig } from '$lib/stores/server-config.store';
 
   export let trashConfig: SystemConfigTrashDto; // this is the config that is being edited
   export let disabled = false;
@@ -36,9 +35,6 @@
       savedConfig = { ...updated.trash };
 
       notificationController.show({ message: 'Settings saved', type: NotificationType.Info });
-      // TODO: Use websockets to reload feature params instead once websocket for client is merged
-      // Reload feature params in the background
-      loadConfig();
     } catch (error) {
       handleError(error, 'Unable to save settings');
     }

web/src/lib/stores/websocket.ts

@@ -1,6 +1,7 @@
 import type { AssetResponseDto, ServerVersionResponseDto } from '@api';
 import { io } from 'socket.io-client';
 import { writable } from 'svelte/store';
+import { loadConfig } from './server-config.store';
 
 export const websocketStore = {
   onUploadSuccess: writable<AssetResponseDto>(),
@@ -29,6 +30,7 @@ export const openWebsocketConnection = () => {
       .on('on_asset_trash', (data) => websocketStore.onAssetTrash.set(JSON.parse(data) as string[]))
       .on('on_person_thumbnail', (data) => websocketStore.onPersonThumbnail.set(JSON.parse(data) as string))
       .on('on_server_version', (data) => websocketStore.serverVersion.set(JSON.parse(data) as ServerVersionResponseDto))
+      .on('on_config_update', () => loadConfig())
       .on('error', (e) => console.log('Websocket Error', e));
 
     return () => websocket?.close();