refactor: replace LobbyPresetStore with LobbyPresetControls for preset management in HostLobbyModal and SinglePlayerModal

Author: Aotumuri

src/client/HostLobbyModal.ts

@@ -27,7 +27,7 @@ import {
 import { generateID } from "../core/Util";
 import "./components/baseComponents/Modal";
 import "./components/Difficulties";
-import { LobbyPresetStore } from "./components/lobbyConfig/PresetControls";
+import { LobbyPresetControls } from "./components/lobbyConfig/PresetControls";
 import "./components/LobbyTeamView";
 import "./components/Maps";
 import { JoinLobbyEvent } from "./Main";
@@ -70,7 +70,6 @@ export class HostLobbyModal extends LitElement {
   // Add a new timer for debouncing bot changes
   private botsUpdateTimer: number | null = null;
   private userSettings: UserSettings = new UserSettings();
-  private presetStore = new LobbyPresetStore(this.userSettings);
   private mapLoader = terrainMapFileLoader;
 
   connectedCallback() {
@@ -664,7 +663,7 @@ export class HostLobbyModal extends LitElement {
   }
 
   private loadPresets() {
-    this.lobbyPresets = this.presetStore.list();
+    this.lobbyPresets = LobbyPresetControls.listPresets(this.userSettings);
   }
 
   private handlePresetSelect(e: CustomEvent<string>) {
@@ -706,7 +705,11 @@ export class HostLobbyModal extends LitElement {
     if (!name) {
       return;
     }
-    this.lobbyPresets = this.presetStore.save(name, this.buildPresetConfig());
+    this.lobbyPresets = LobbyPresetControls.savePreset(
+      this.userSettings,
+      name,
+      this.buildPresetConfig(),
+    );
     this.selectedPresetName = name;
     this.presetNameInput = "";
   }
@@ -748,7 +751,10 @@ export class HostLobbyModal extends LitElement {
     if (!presetName) {
       return;
     }
-    this.lobbyPresets = this.presetStore.delete(presetName);
+    this.lobbyPresets = LobbyPresetControls.deletePreset(
+      this.userSettings,
+      presetName,
+    );
     if (this.selectedPresetName === presetName) {
       this.selectedPresetName = "";
     }

src/client/SinglePlayerModal.ts

@@ -25,7 +25,7 @@ import { generateID } from "../core/Util";
 import "./components/baseComponents/Button";
 import "./components/baseComponents/Modal";
 import "./components/Difficulties";
-import { LobbyPresetStore } from "./components/lobbyConfig/PresetControls";
+import { LobbyPresetControls } from "./components/lobbyConfig/PresetControls";
 import "./components/Maps";
 import { fetchCosmetics } from "./Cosmetics";
 import { FlagInput } from "./FlagInput";
@@ -62,7 +62,6 @@ export class SinglePlayerModal extends LitElement {
   @state() private presetNameInput = "";
 
   private userSettings: UserSettings = new UserSettings();
-  private presetStore = new LobbyPresetStore(this.userSettings);
 
   connectedCallback() {
     super.connectedCallback();
@@ -450,7 +449,7 @@ export class SinglePlayerModal extends LitElement {
   }
 
   private loadPresets() {
-    this.lobbyPresets = this.presetStore.list();
+    this.lobbyPresets = LobbyPresetControls.listPresets(this.userSettings);
   }
 
   private handlePresetSelect(e: CustomEvent<string>) {
@@ -492,7 +491,11 @@ export class SinglePlayerModal extends LitElement {
     if (!name) {
       return;
     }
-    this.lobbyPresets = this.presetStore.save(name, this.buildPresetConfig());
+    this.lobbyPresets = LobbyPresetControls.savePreset(
+      this.userSettings,
+      name,
+      this.buildPresetConfig(),
+    );
     this.selectedPresetName = name;
     this.presetNameInput = "";
   }
@@ -531,7 +534,10 @@ export class SinglePlayerModal extends LitElement {
     if (!presetName) {
       return;
     }
-    this.lobbyPresets = this.presetStore.delete(presetName);
+    this.lobbyPresets = LobbyPresetControls.deletePreset(
+      this.userSettings,
+      presetName,
+    );
     if (this.selectedPresetName === presetName) {
       this.selectedPresetName = "";
     }

src/client/components/lobbyConfig/PresetControls.ts

@@ -11,37 +11,53 @@ import {
 import { translateText } from "../../Utils";
 import "../baseComponents/Button";
 
-export class LobbyPresetStore {
-  constructor(private userSettings = new UserSettings()) {}
+@customElement("lobby-preset-controls")
+export class LobbyPresetControls extends LitElement {
+  @property({ type: Array }) presets: LobbyPreset[] = [];
+  @property({ type: String }) selectedName = "";
+  @property({ type: String }) nameInput = "";
 
-  list(): LobbyPreset[] {
-    return this.userSettings
+  static listPresets(userSettings = new UserSettings()): LobbyPreset[] {
+    return userSettings
       .getLobbyPresets()
-      .map((preset) => this.normalizePreset(preset));
+      .map((preset) => LobbyPresetControls.normalizePreset(preset));
   }
 
-  save(name: string, config: LobbyPresetConfig): LobbyPreset[] {
-    const presets = this.list().filter((preset) => preset.name !== name);
+  static savePreset(
+    userSettings: UserSettings,
+    name: string,
+    config: LobbyPresetConfig,
+  ): LobbyPreset[] {
+    const presets = LobbyPresetControls.listPresets(userSettings).filter(
+      (preset) => preset.name !== name,
+    );
     const updated = [
       ...presets,
-      { name, config: this.normalizePresetConfig(config) },
+      {
+        name,
+        config: LobbyPresetControls.normalizePresetConfig(config),
+      },
     ];
-    this.userSettings.setLobbyPresets(updated);
+    userSettings.setLobbyPresets(updated);
     return updated;
   }
 
-  delete(name: string): LobbyPreset[] {
-    const updated = this.list().filter((preset) => preset.name !== name);
-    this.userSettings.setLobbyPresets(updated);
+  static deletePreset(userSettings: UserSettings, name: string): LobbyPreset[] {
+    const updated = LobbyPresetControls.listPresets(userSettings).filter(
+      (preset) => preset.name !== name,
+    );
+    userSettings.setLobbyPresets(updated);
     return updated;
   }
 
-  private normalizePreset(preset: LobbyPreset): LobbyPreset {
-    const config = this.normalizePresetConfig(preset?.config ?? {});
+  private static normalizePreset(preset: LobbyPreset): LobbyPreset {
+    const config = LobbyPresetControls.normalizePresetConfig(
+      preset?.config ?? {},
+    );
     return { name: preset?.name ?? "Preset", config };
   }
 
-  private normalizePresetConfig(
+  private static normalizePresetConfig(
     config: Partial<LobbyPresetConfig>,
   ): LobbyPresetConfig {
     const parsed = LobbyPresetConfigSchema.parse(config);
@@ -65,13 +81,6 @@ export class LobbyPresetStore {
       disabledUnits: parsed.disabledUnits ?? [],
     };
   }
-}
-
-@customElement("lobby-preset-controls")
-export class LobbyPresetControls extends LitElement {
-  @property({ type: Array }) presets: LobbyPreset[] = [];
-  @property({ type: String }) selectedName = "";
-  @property({ type: String }) nameInput = "";
 
   createRenderRoot() {
     return this;