make bottom radial ally/traitor button

src/client/graphics/layers/RadialMenu.ts

@@ -1,10 +1,11 @@
 import * as d3 from "d3";
+import allianceIcon from "../../../../resources/images/AllianceIconWhite.svg";
 import boatIcon from "../../../../resources/images/BoatIconWhite.svg";
 import buildIcon from "../../../../resources/images/BuildIconWhite.svg";
 import disabledIcon from "../../../../resources/images/DisabledIcon.svg";
 import infoIcon from "../../../../resources/images/InfoIcon.svg";
 import swordIcon from "../../../../resources/images/SwordIconWhite.svg";
-import xIcon from "../../../../resources/images/XIcon.svg";
+import traitorIcon from "../../../../resources/images/TraitorIconWhite.svg";
 import { consolex } from "../../../core/Consolex";
 import { EventBus } from "../../../core/EventBus";
 import { Cell, PlayerActions } from "../../../core/game/Game";
@@ -18,8 +19,10 @@ import {
   ShowBuildMenuEvent,
 } from "../../InputHandler";
 import {
+  SendAllianceRequestIntentEvent,
   SendAttackIntentEvent,
   SendBoatAttackIntentEvent,
+  SendBreakAllianceIntentEvent,
   SendSpawnIntentEvent,
 } from "../../Transport";
 import { TransformHandler } from "../TransformHandler";
@@ -34,7 +37,7 @@ enum Slot {
   Info,
   Boat,
   Build,
-  Close,
+  Ally,
 }
 
 export class RadialMenu implements Layer {
@@ -54,7 +57,7 @@ export class RadialMenu implements Layer {
         icon: null,
       },
     ],
-    [Slot.Close, { name: "close", disabled: true, action: () => {} }],
+    [Slot.Ally, { name: "ally", disabled: true, action: () => {} }],
     [Slot.Build, { name: "build", disabled: true, action: () => {} }],
     [
       Slot.Info,
@@ -337,8 +340,27 @@ export class RadialMenu implements Layer {
         this.playerPanel.show(actions, tile);
       });
     }
-    this.activateMenuElement(Slot.Close, "#DC2626", xIcon, () => {});
 
+    if (actions?.interaction?.canSendAllianceRequest) {
+      this.activateMenuElement(Slot.Ally, "#53ac75", allianceIcon, () => {
+        this.eventBus.emit(
+          new SendAllianceRequestIntentEvent(
+            myPlayer,
+            this.g.owner(tile) as PlayerView,
+          ),
+        );
+      });
+    }
+    if (actions?.interaction?.canBreakAlliance) {
+      this.activateMenuElement(Slot.Ally, "#c74848", traitorIcon, () => {
+        this.eventBus.emit(
+          new SendBreakAllianceIntentEvent(
+            myPlayer,
+            this.g.owner(tile) as PlayerView,
+          ),
+        );
+      });
+    }
     if (actions.canBoat) {
       this.activateMenuElement(Slot.Boat, "#3f6ab1", boatIcon, () => {
         this.eventBus.emit(