Release Healer Man 0.1.44

src/ui/AbilityBindingsPanel.tsx

@@ -12,7 +12,7 @@ import {
 import { useCombatStore } from "../game/combatStore";
 import { abilityAtLevel, defaultActionBarForCharacter, type AbilityDefinition } from "../game/abilityCatalog";
 import { useGameStore } from "../game/store";
-import { actionKeyLabel, assignDesktopAbility, resetDesktopAbilities, type UiLayout } from "../game/uiLayout";
+import { actionKeyLabel, assignedActionBarAbilityIds, assignDesktopAbility, resetDesktopAbilities, type UiLayout } from "../game/uiLayout";
 import { currentUiDevice, useUiLayoutStore } from "../game/uiLayoutStore";
 import { getControllerHeldTokens, subscribeControllerToken } from "../input/controller";
 import { INPUT_ACTIONS, controllerBindingMatches, inputKeyForEvent } from "../input/keybinds";
@@ -130,6 +130,10 @@ function AbilityBindingsDialog({ onClose }: { onClose?: () => void }) {
   const [notice, setNotice] = useState("Choose a button, then choose the ability it should use.");
   const classColor = classById(classId).color;
   const isWow = layout === "wow";
+  const assignedIds = assignedActionBarAbilityIds(pcLayout, bindings, isWow);
+  const isMissing = (ability: AbilityDefinition) => ability.unlockLevel <= level
+    && (ability.talentEntryId === undefined || Boolean(talentRanks[`coa-entry-${ability.talentEntryId}`]))
+    && !assignedIds.has(ability.id);
   const assignment = (control: BindingControl) => typeof control === "number"
     ? pcLayout.bars[bar].slots[control].abilityId : bindings[actionBindingId(layer, control)];
   const controlLabel = (control: BindingControl) => typeof control === "number"
@@ -490,10 +494,11 @@ function AbilityBindingsDialog({ onClose }: { onClose?: () => void }) {
               <>
                 <p className="eyebrow">Assign {controlLabel(editingControl)}</p>
                 <h3>Choose an ability</h3>
+                <p className="action-bar-missing-legend">Light blue: missing from action bars</p>
                 <div className="ability-bindings__choices">
                   {pickerAbilities.map((ability) => (
                     <AbilityTooltipTarget key={ability.id} ability={tooltipData(ability)}>
-                    <ControllerButton controlId={choiceControlId(ability.id)} selectedId={controller.selectedId} select={controller.select} type="button" className={`${ability.id === editingAbilityId ? "is-current" : ""} ${ability.unlockLevel > level ? "is-locked" : ""}`} onClick={() => assign(ability.id)}>
+                    <ControllerButton controlId={choiceControlId(ability.id)} selectedId={controller.selectedId} select={controller.select} type="button" className={`${ability.id === editingAbilityId ? "is-current" : ""} ${ability.unlockLevel > level ? "is-locked" : ""} ${isMissing(ability) ? "is-missing-from-bars" : ""}`} aria-label={`${ability.name}${isMissing(ability) ? ", missing from action bars" : ""}`} onClick={() => assign(ability.id)}>
                       <AbilityBindingIcon icon={ability.icon} sigil={ability.sigil} color={classColor} />
                       <span><strong>{ability.name}</strong><small>{ability.unlockLevel > level ? `Unlocks at level ${ability.unlockLevel}` : ability.id === editingAbilityId ? "Current assignment" : ability.target === "friendly" ? "Friendly / self" : ability.target}</small></span>
                     </ControllerButton>