From dcd0f7a030cd3ba639ed4895221595ce4265b471 Mon Sep 17 00:00:00 2001
From: cpojer <christoph.pojer@gmail.com>
Date: Tue, 3 Dec 2024 09:04:23 +0900
Subject: [PATCH] Allow for secondary action styles to be shown on top of
 units.

GitOrigin-RevId: 380aea763c54a8d4a470b1c01c3ba698a15713f8
---
 hera/Unit.tsx | 27 ++++++++++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

diff --git a/hera/Unit.tsx b/hera/Unit.tsx
index 7f1c9c62..a57130f7 100644
--- a/hera/Unit.tsx
+++ b/hera/Unit.tsx
@@ -109,11 +109,13 @@ const getAmmoStyle = (unit: Unit) => {
 const Action = ({
   actionStyle,
   hide,
+  position,
   rescuer,
   unit,
 }: {
   actionStyle: ActionStyle | null;
   hide: boolean;
+  position?: 'secondary';
   rescuer: PlayerID | null;
   unit: Unit;
 }) => {
@@ -134,6 +136,7 @@ const Action = ({
         absoluteStyle,
         baseIconStyle,
         statusStyle,
+        position === 'secondary' ? secondaryStyle : null,
         className,
         hide && hideStyle,
       )}
@@ -160,6 +163,7 @@ const Status = ({
   fuelStyle,
   hide,
   rescuer,
+  secondaryActionStyle,
   unit,
 }: {
   actionStyle: ActionStyle | null;
@@ -167,9 +171,12 @@ const Status = ({
   fuelStyle: FuelStyle | null;
   hide: boolean;
   rescuer: PlayerID | null;
+  secondaryActionStyle: ActionStyle | null;
   unit: Unit;
 }) => {
   const hasOne = !!(fuelStyle || ammoStyle);
+  const hasSecondaryAction =
+    secondaryActionStyle && secondaryActionStyle !== actionStyle;
   return (
     <>
       <Action
@@ -178,6 +185,15 @@ const Status = ({
         rescuer={rescuer}
         unit={unit}
       />
+      {hasSecondaryAction && (
+        <Action
+          actionStyle={secondaryActionStyle}
+          hide={hide}
+          position="secondary"
+          rescuer={rescuer}
+          unit={unit}
+        />
+      )}
       {unit.health ? (
         <div
           className={cx(
@@ -873,15 +889,15 @@ export default function UnitTile({
   };
 
   const hide = !!animation;
+  const secondaryActionStyle =
+    !isCompleted && unit.hasMoved() ? ActionStyle.Moved : null;
   const actionStyle = unit.isTransportingUnits()
     ? ActionStyle.Transport
     : unit.isCapturing()
       ? ActionStyle.Capture
       : unit.isBeingRescued()
         ? ActionStyle.Rescue
-        : !isCompleted && unit.hasMoved()
-          ? ActionStyle.Moved
-          : null;
+        : secondaryActionStyle;
   const fuelStyle = getFuelStyle(unit);
   const ammoStyle = getAmmoStyle(unit);
   const completedStyles = cx(
@@ -958,6 +974,7 @@ export default function UnitTile({
         fuelStyle={fuelStyle}
         hide={hide}
         rescuer={actionStyle === ActionStyle.Rescue ? unit.getRescuer() : null}
+        secondaryActionStyle={secondaryActionStyle}
         unit={unit}
       />
       <Health
@@ -1254,6 +1271,10 @@ const statusStyle = css`
   bottom: -1px;
 `;
 
+const secondaryStyle = css`
+  transform: translate3d(0, -100%, 0);
+`;
+
 const captureStyle = css`
   bottom: 0px;
 `;