Added Gold & Troop donate button (#373)

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
- [x] I understand that submitting code with bugs that could have been
caught through manual testing blocks releases and new features for all
contributors

Changed the icon for the troop donation button, as it looked like it was
donating gold.
I replaced it with a soldier icon to better reflect its function.
Additionally, I updated the icon below it to clearly represent gold
donation instead.

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

The cat is because of an extension I have put in. Please ignore it.
<img width="345" alt="スクリーンショット 2025-03-30 10 13 06"
src="https://github.com/user-attachments/assets/9088be1a-57b4-4d10-9507-ca8dc0fcc68c"
/>
<img width="396" alt="スクリーンショット 2025-03-30 10 18 10"
src="https://github.com/user-attachments/assets/2555fd24-0bbc-4b40-8f80-ccf43a1e9a75"
/>

---------

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

src/client/Transport.ts

@@ -96,7 +96,15 @@ export class SendEmojiIntentEvent implements GameEvent {
   ) {}
 }
 
-export class SendDonateIntentEvent implements GameEvent {
+export class SendDonateGoldIntentEvent implements GameEvent {
+  constructor(
+    public readonly sender: PlayerView,
+    public readonly recipient: PlayerView,
+    public readonly gold: number | null,
+  ) {}
+}
+
+export class SendDonateTroopsIntentEvent implements GameEvent {
   constructor(
     public readonly sender: PlayerView,
     public readonly recipient: PlayerView,
@@ -187,7 +195,12 @@ export class Transport {
       this.onSendTargetPlayerIntent(e),
     );
     this.eventBus.on(SendEmojiIntentEvent, (e) => this.onSendEmojiIntent(e));
-    this.eventBus.on(SendDonateIntentEvent, (e) => this.onSendDonateIntent(e));
+    this.eventBus.on(SendDonateGoldIntentEvent, (e) =>
+      this.onSendDonateGoldIntent(e),
+    );
+    this.eventBus.on(SendDonateTroopsIntentEvent, (e) =>
+      this.onSendDonateTroopIntent(e),
+    );
     this.eventBus.on(SendEmbargoIntentEvent, (e) =>
       this.onSendEmbargoIntent(e),
     );
@@ -425,9 +438,18 @@ export class Transport {
     });
   }
 
-  private onSendDonateIntent(event: SendDonateIntentEvent) {
+  private onSendDonateGoldIntent(event: SendDonateGoldIntentEvent) {
     this.sendIntent({
-      type: "donate",
+      type: "donate_gold",
+      clientID: this.lobbyConfig.clientID,
+      recipient: event.recipient.id(),
+      gold: event.gold,
+    });
+  }
+
+  private onSendDonateTroopIntent(event: SendDonateTroopsIntentEvent) {
+    this.sendIntent({
+      type: "donate_troops",
       clientID: this.lobbyConfig.clientID,
       recipient: event.recipient.id(),
       troops: event.troops,

src/client/graphics/layers/PlayerPanel.ts

@@ -15,13 +15,15 @@ import { TileRef } from "../../../core/game/GameMap";
 import { renderNumber, renderTroops } from "../../Utils";
 import targetIcon from "../../../../resources/images/TargetIconWhite.svg";
 import emojiIcon from "../../../../resources/images/EmojiIconWhite.svg";
-import donateIcon from "../../../../resources/images/DonateIconWhite.svg";
+import donateTroopIcon from "../../../../resources/images/DonateTroopIconWhite.svg";
+import donateGoldIcon from "../../../../resources/images/DonateGoldIconWhite.svg";
 import traitorIcon from "../../../../resources/images/TraitorIconWhite.svg";
 import allianceIcon from "../../../../resources/images/AllianceIconWhite.svg";
 import {
   SendAllianceRequestIntentEvent,
   SendBreakAllianceIntentEvent,
-  SendDonateIntentEvent,
+  SendDonateGoldIntentEvent,
+  SendDonateTroopsIntentEvent,
   SendEmojiIntentEvent,
   SendTargetPlayerIntentEvent,
   SendEmbargoIntentEvent,
@@ -77,9 +79,23 @@ export class PlayerPanel extends LitElement implements Layer {
     this.hide();
   }
 
-  private handleDonateClick(e: Event, myPlayer: PlayerView, other: PlayerView) {
+  private handleDonateTroopClick(
+    e: Event,
+    myPlayer: PlayerView,
+    other: PlayerView,
+  ) {
     e.stopPropagation();
-    this.eventBus.emit(new SendDonateIntentEvent(myPlayer, other, null));
+    this.eventBus.emit(new SendDonateTroopsIntentEvent(myPlayer, other, null));
+    this.hide();
+  }
+
+  private handleDonateGoldClick(
+    e: Event,
+    myPlayer: PlayerView,
+    other: PlayerView,
+  ) {
+    e.stopPropagation();
+    this.eventBus.emit(new SendDonateGoldIntentEvent(myPlayer, other, null));
     this.hide();
   }
 
@@ -302,12 +318,24 @@ export class PlayerPanel extends LitElement implements Layer {
                 : ""}
               ${canDonate
                 ? html`<button
-                    @click=${(e) => this.handleDonateClick(e, myPlayer, other)}
+                    @click=${(e) =>
+                      this.handleDonateTroopClick(e, myPlayer, other)}
                     class="w-10 h-10 flex items-center justify-center
                            bg-opacity-50 bg-gray-700 hover:bg-opacity-70
                            text-white rounded-lg transition-colors"
                   >
-                    <img src=${donateIcon} alt="Donate" class="w-6 h-6" />
+                    <img src=${donateTroopIcon} alt="Donate" class="w-6 h-6" />
+                  </button>`
+                : ""}
+              ${canDonate
+                ? html`<button
+                    @click=${(e) =>
+                      this.handleDonateGoldClick(e, myPlayer, other)}
+                    class="w-10 h-10 flex items-center justify-center
+                          bg-opacity-50 bg-gray-700 hover:bg-opacity-70
+                          text-white rounded-lg transition-colors"
+                  >
+                    <img src=${donateGoldIcon} alt="Donate" class="w-6 h-6" />
                   </button>`
                 : ""}
               ${canSendEmoji

src/client/graphics/layers/RadialMenu.ts

@@ -18,7 +18,8 @@ import {
   SendAttackIntentEvent,
   SendBoatAttackIntentEvent,
   SendBreakAllianceIntentEvent,
-  SendDonateIntentEvent,
+  SendDonateTroopsIntentEvent,
+  SendDonateGoldIntentEvent,
   SendEmojiIntentEvent,
   SendSpawnIntentEvent,
   SendTargetPlayerIntentEvent,

src/client/styles.css

@@ -360,8 +360,8 @@ label.option-card:hover {
 }
 
 #helpModal .donate-icon {
-  mask: url("../../resources/images/DonateIconWhite.svg") no-repeat center /
-    cover;
+  mask: url("../../resources/images/DonateTroopIconWhite.svg") no-repeat
+    center / cover;
 }
 
 #helpModal .build-icon {