Add deletion duration and indicators (#2216)

## Description:

Adds a timer before self deleting units
Adds a loading bar under deleting units
Adds a timer in radial menu for clarity purposes


![deletecd](https://github.com/user-attachments/assets/613bf742-ef90-42b5-a258-b928daae6aaa)

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

Mr.Box

---------

Co-authored-by: Evan <evanpelle@gmail.com>

src/core/configuration/Config.ts

@@ -130,6 +130,7 @@ export interface Config {
   emojiMessageCooldown(): Tick;
   emojiMessageDuration(): Tick;
   donateCooldown(): Tick;
+  deletionMarkDuration(): Tick;
   deleteUnitCooldown(): Tick;
   defaultDonationAmount(sender: Player): number;
   unitInfo(type: UnitType): UnitInfo;

src/core/configuration/DefaultConfig.ts

@@ -569,6 +569,9 @@ export class DefaultConfig implements Config {
   donateCooldown(): Tick {
     return 10 * 10;
   }
+  deletionMarkDuration(): Tick {
+    return 15 * 10;
+  }
   deleteUnitCooldown(): Tick {
     return 5 * 10;
   }

src/core/execution/DeleteUnitExecution.ts

@@ -1,8 +1,9 @@
-import { Execution, Game, MessageType, Player } from "../game/Game";
+import { Execution, Game, MessageType, Player, Unit } from "../game/Game";
 
 export class DeleteUnitExecution implements Execution {
   private active: boolean = true;
   private mg: Game;
+  private unit: Unit | null = null;
 
   constructor(
     private player: Player,
@@ -33,6 +34,7 @@ export class DeleteUnitExecution implements Execution {
       this.active = false;
       return;
     }
+    this.unit = unit;
 
     const tileOwner = mg.owner(unit.tile());
     if (!tileOwner.isPlayer() || tileOwner.id() !== this.player.id()) {
@@ -61,19 +63,29 @@ export class DeleteUnitExecution implements Execution {
       return;
     }
 
-    unit.delete(false);
     this.player.recordDeleteUnit();
-
-    this.mg.displayMessage(
-      `events_display.unit_voluntarily_deleted`,
-      MessageType.UNIT_DESTROYED,
-      this.player.id(),
-    );
-
-    this.active = false;
+    unit.markForDeletion();
   }
 
-  tick(ticks: number) {}
+  tick(ticks: number) {
+    if (!this.active || !this.unit) {
+      return;
+    }
+    if (!this.unit.isActive()) {
+      this.active = false;
+      return;
+    }
+    if (this.unit.isOverdueDeletion()) {
+      this.unit.delete(false);
+
+      this.mg.displayMessage(
+        `events_display.unit_voluntarily_deleted`,
+        MessageType.UNIT_DESTROYED,
+        this.player.id(),
+      );
+      this.active = false;
+    }
+  }
 
   isActive(): boolean {
     return this.active;

src/core/execution/UpgradeStructureExecution.ts

@@ -19,7 +19,7 @@ export class UpgradeStructureExecution implements Execution {
       return;
     }
 
-    if (!this.player.canUpgradeUnit(this.structure.type())) {
+    if (!this.player.canUpgradeUnit(this.structure)) {
       console.warn(
         `[UpgradeStructureExecution] unit type ${this.structure.type()} cannot be upgraded`,
       );

src/core/game/Game.ts

@@ -432,6 +432,9 @@ export interface Unit {
   type(): UnitType;
   owner(): Player;
   info(): UnitInfo;
+  isMarkedForDeletion(): boolean;
+  markForDeletion(): void;
+  isOverdueDeletion(): boolean;
   delete(displayMessage?: boolean, destroyer?: Player): void;
   tile(): TileRef;
   lastTile(): TileRef;
@@ -573,7 +576,7 @@ export interface Player {
   // New units of the same type can upgrade existing units.
   // e.g. if a place a new city here, can it upgrade an existing city?
   findUnitToUpgrade(type: UnitType, targetTile: TileRef): Unit | false;
-  canUpgradeUnit(unitType: UnitType): boolean;
+  canUpgradeUnit(unit: Unit): boolean;
   upgradeUnit(unit: Unit): void;
   captureUnit(unit: Unit): void;
 

src/core/game/GameUpdates.ts

@@ -123,6 +123,7 @@ export interface UnitUpdate {
   reachedTarget: boolean;
   retreating: boolean;
   targetable: boolean;
+  markedForDeletion: number | false;
   targetUnitId?: number; // Only for trade ships
   targetTile?: TileRef; // Only for nukes
   health?: number;

src/core/game/GameView.ts

@@ -87,6 +87,10 @@ export class UnitView {
     return this.data.targetable;
   }
 
+  markedForDeletion(): number | false {
+    return this.data.markedForDeletion;
+  }
+
   type(): UnitType {
     return this.data.unitType;
   }
@@ -430,10 +434,13 @@ export class PlayerView {
     return this.data.lastDeleteUnitTick;
   }
 
-  canDeleteUnit(): boolean {
+  deleteUnitCooldown(): number {
     return (
-      this.game.ticks() + 1 - this.lastDeleteUnitTick() >=
-      this.game.config().deleteUnitCooldown()
+      Math.max(
+        0,
+        this.game.config().deleteUnitCooldown() -
+          (this.game.ticks() + 1 - this.lastDeleteUnitTick()),
+      ) / 10
     );
   }
 }
@@ -573,7 +580,7 @@ export class GameView implements GameMap {
     tile: TileRef,
     searchRange: number,
     type: UnitType,
-    playerId: PlayerID,
+    playerId?: PlayerID,
   ) {
     return this.unitGrid.hasUnitNearby(tile, searchRange, type, playerId);
   }

src/core/game/PlayerImpl.ts

@@ -853,20 +853,23 @@ export class PlayerImpl implements Player {
       return false;
     }
     const unit = existing[0].unit;
-    if (!this.canUpgradeUnit(unit.type())) {
+    if (!this.canUpgradeUnit(unit)) {
       return false;
     }
     return unit;
   }
 
-  public canUpgradeUnit(unitType: UnitType): boolean {
-    if (!this.mg.config().unitInfo(unitType).upgradable) {
+  public canUpgradeUnit(unit: Unit): boolean {
+    if (unit.isMarkedForDeletion()) {
       return false;
     }
-    if (this.mg.config().isUnitDisabled(unitType)) {
+    if (!this.mg.config().unitInfo(unit.type()).upgradable) {
       return false;
     }
-    if (this._gold < this.mg.config().unitInfo(unitType).cost(this)) {
+    if (this.mg.config().isUnitDisabled(unit.type())) {
+      return false;
+    }
+    if (this._gold < this.mg.config().unitInfo(unit.type()).cost(this)) {
       return false;
     }
     return true;

src/core/game/UnitImpl.ts

@@ -39,6 +39,7 @@ export class UnitImpl implements Unit {
   // Nuke only
   private _trajectoryIndex: number = 0;
   private _trajectory: TrajectoryTile[];
+  private _deletionAt: number | null = null;
 
   constructor(
     private _type: UnitType,
@@ -126,6 +127,7 @@ export class UnitImpl implements Unit {
       reachedTarget: this._reachedTarget,
       retreating: this._retreating,
       pos: this._tile,
+      markedForDeletion: this._deletionAt ?? false,
       targetable: this._targetable,
       lastPos: this._lastTile,
       health: this.hasHealth() ? Number(this._health) : undefined,
@@ -182,6 +184,7 @@ export class UnitImpl implements Unit {
   }
 
   setOwner(newOwner: PlayerImpl): void {
+    this.clearPendingDeletion();
     switch (this._type) {
       case UnitType.Warship:
       case UnitType.Port:
@@ -221,6 +224,30 @@ export class UnitImpl implements Unit {
     }
   }
 
+  clearPendingDeletion(): void {
+    this._deletionAt = null;
+  }
+
+  isMarkedForDeletion(): boolean {
+    return this._deletionAt !== null;
+  }
+
+  markForDeletion(): void {
+    if (!this.isActive()) {
+      return;
+    }
+    this._deletionAt =
+      this.mg.ticks() + this.mg.config().deletionMarkDuration();
+    this.mg.addUpdate(this.toUpdate());
+  }
+
+  isOverdueDeletion(): boolean {
+    if (!this.isActive()) {
+      return false;
+    }
+    return this._deletionAt !== null && this.mg.ticks() - this._deletionAt > 0;
+  }
+
   delete(displayMessage?: boolean, destroyer?: Player): void {
     if (!this.isActive()) {
       throw new Error(`cannot delete ${this} not active`);