Improve Notification Panel (#3913)

Resolves #3910

## Description:

- Split the events HUD into two components: a new
**`<actionable-events>`** that owns alliance prompts (request / renew)
and a slimmed-down **`<events-display>`** for everything else.
- Reworked `<events-display>` into two visual tiers: dim/scrolling tier
2 on top (trade results, unit losses, donations, alliance status),
prominent tier 1 anchored at the bottom (inbound nukes, naval invasion,
attack requests, alliance broken, conquered player, chat). Tier 2 caps
at the 4 newest entries; events expire after 8s.
- Added a transient **+gold pip** above the gold pill in
`<control-panel>`, animated with a small fade-in. Fires for trade ships,
trains, donations, and conquest. Trade-ship and train arrivals are
removed from the events scroll since they're surfaced here instead.
- New `MessageType.NUKE_DETONATED` and a server-side emission in
`NukeExecution.detonate` — once an inbound nuke lands or gets
intercepted, the inbound warning vanishes and a "detonated" entry takes
its place.
- `displayMessage` gained optional `unitID` and `focusPlayerID` params
so events can link to a unit or a player. Unit captures and destructions
now navigate to the unit's last tile when clicked; donations navigate to
the other player.
- ActionableEvents card width matches `<events-display>`; cards persist
until the user clicks Accept/Reject/Renew/Ignore or the server-side
request timeout expires.
- Removed the in-events category filter UI and the gold-amount banner —
`<events-display>` is now a lightweight log that hides entirely when
empty.

<img width="570" height="444" alt="Screenshot 2026-05-21 at 1 42 30 PM"
src="https://github.com/user-attachments/assets/f103efb3-0e11-4b72-a11b-91ff6896177c"
/>

<img width="430" height="296" alt="Screenshot 2026-05-21 at 1 41 34 PM"
src="https://github.com/user-attachments/assets/ae58475a-b252-4aa6-9ce5-99dea7575ce3"
/>

## 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:

evan
This commit is contained in:
Evan
2026-05-21 11:50:10 -07:00
committed by GitHub
parent 513057a62c
commit 41ef675e98
19 changed files with 782 additions and 614 deletions
+21
View File
@@ -386,6 +386,27 @@ export class NukeExecution implements Execution {
this.nuke.setReachedTarget();
this.nuke.delete(false);
if (
this.nukeType === UnitType.AtomBomb ||
this.nukeType === UnitType.HydrogenBomb
) {
const messageKey =
this.nukeType === UnitType.AtomBomb
? "events_display.atom_bomb_detonated"
: "events_display.hydrogen_bomb_detonated";
for (const [impactedPlayer] of tilesPerPlayers) {
mg.displayMessage(
messageKey,
MessageType.NUKE_DETONATED,
impactedPlayer.id(),
undefined,
{ name: this.player.displayName() },
undefined,
this.player.id(),
);
}
}
// Record stats
this.mg
.stats()
+1 -21
View File
@@ -189,28 +189,8 @@ export class TradeShipExecution implements Execution {
.stats()
.boatCapturedTrade(this.tradeShip!.owner(), this.origOwner, gold);
} else {
this.srcPort.owner().addGold(gold);
this.srcPort.owner().addGold(gold, this.srcPort.tile());
this._dstPort.owner().addGold(gold, this._dstPort.tile());
this.mg.displayMessage(
"events_display.received_gold_from_trade",
MessageType.RECEIVED_GOLD_FROM_TRADE,
this._dstPort.owner().id(),
gold,
{
gold: renderNumber(gold),
name: this.srcPort.owner().displayName(),
},
);
this.mg.displayMessage(
"events_display.received_gold_from_trade",
MessageType.RECEIVED_GOLD_FROM_TRADE,
this.srcPort.owner().id(),
gold,
{
gold: renderNumber(gold),
name: this._dstPort.owner().displayName(),
},
);
// Record stats
this.mg
.stats()