From f0b3c490b15b3ca301ec58e07461bae01610cb4c Mon Sep 17 00:00:00 2001
From: VariableVince <24507472+VariableVince@users.noreply.github.com>
Date: Fri, 10 Apr 2026 04:49:27 +0200
Subject: [PATCH] Fix: flag not visually removed when selecting default/none
 flag + should not update flag on clearFlag (#3626)

## Description:

https://github.com/openfrontio/OpenFrontIO/pull/3479 put setFlag and
clearFlag in UserSettings.
https://github.com/openfrontio/OpenFrontIO/pull/3481 did some updates to
incorporate them into UserSettings cache. But made two misjudgments.

Which led to: when default/none flag was selected, FlagInput would still
display the previously selected flag. And on clearFlag call, unnecessary
updates where send to FlagInput > updateFlag.

This PR fixes it.

- Don't send update event on clearFlag by default, just like PR 3479
didn't. Although i could imagine potential cases where we would want to
update the displayed flag in FlagInput. Not when clearFlag is called
from Auth > logOut. But maybe in some, but not all, cases when it is
called from Cosmetics > getPlayerCosmeticsRefs. That is for future
investigations by another contributor.

- Do sent update event when clearFlag is called from setFlag, if the
"country:xx" (default/none) flag is set. Previously, it would have sent
event this.emitChange(FLAG_KEY, **"country:xx"**). Now, via clearFlag,
it sends this.emitChange(FLAG_KEY, **null**)

- Have FlagInput > updateFlag handle null. Previously it expected to
always recieve a string, even for default/none flag "country:xx". Now it
will also set this.flag to null if it recieves an event with null. It
being able to handle event value null actually hardens the code so seems
better to me either way. FlagInput > isDefaultFlagValue() already did
handle null values to determine the default flag, so no changes needed
there.

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

tryout33
---
 src/client/FlagInput.ts       | 9 +++++----
 src/core/game/UserSettings.ts | 6 +++---
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/client/FlagInput.ts b/src/client/FlagInput.ts
index db59a4eba..c156dbc53 100644
--- a/src/client/FlagInput.ts
+++ b/src/client/FlagInput.ts
@@ -21,12 +21,13 @@ export class FlagInput extends LitElement {
   }
 
   private updateFlag = (e: CustomEvent) => {
-    const parsed = FlagName.safeParse(e.detail);
+    const val = e.detail ?? "";
+    const parsed = FlagName.safeParse(val);
     if (!parsed.success) {
-      console.warn(`error parsing flag ${e.detail.value}, ${parsed.error}`);
+      console.warn(`error parsing flag ${val}, ${parsed.error}`);
     }
-    if (this.flag !== e.detail) {
-      this.flag = e.detail;
+    if (this.flag !== val) {
+      this.flag = val;
     }
   };
 
diff --git a/src/core/game/UserSettings.ts b/src/core/game/UserSettings.ts
index 4728a9875..e077f4079 100644
--- a/src/core/game/UserSettings.ts
+++ b/src/core/game/UserSettings.ts
@@ -243,14 +243,14 @@ export class UserSettings {
 
   setFlag(flag: string): void {
     if (flag === "country:xx") {
-      this.clearFlag();
+      this.clearFlag(true);
     } else {
       this.setCached(FLAG_KEY, flag);
     }
   }
 
-  clearFlag(): void {
-    this.removeCached(FLAG_KEY);
+  clearFlag(emitChange: boolean = false): void {
+    this.removeCached(FLAG_KEY, emitChange);
   }
 
   backgroundMusicVolume(): number {