Release Healer Man 0.1.29

src/ui/EquipmentPanel.tsx

@@ -184,7 +184,7 @@ function itemType(item: InventoryItem): string {
   ].filter(Boolean).join(" · ");
 }
 
-function EquipmentDialog() {
+function EquipmentDialog({ readOnly = false }: { readOnly?: boolean }) {
   const character = useShellStore((state) => state.activeCharacter);
   const inventory = useCombatStore((state) => state.inventory);
   const equipment = useCombatStore((state) => state.equipment);
@@ -255,6 +255,7 @@ function EquipmentDialog() {
 
   const equip = (item: InventoryItem) => {
     setInspectedId(item.instanceId);
+    if (readOnly) return;
     useCombatStore.getState().equipItem(item.instanceId, owner.id);
   };
   const actions = useMemo<MenuAction[]>(() => [
@@ -264,7 +265,7 @@ function EquipmentDialog() {
     })),
     ...EQUIPMENT_SLOTS.flatMap((slot) => earnedLoadout[slot] ? [{
       id: `equipment-slot-${slot}`,
-      run: () => useCombatStore.getState().unequipItem(owner.id, slot),
+      run: () => { if (!readOnly) useCombatStore.getState().unequipItem(owner.id, slot); },
     }] : []),
     ...STAT_PAGES.map((page) => ({
       id: `equipment-stat-${page}`,
@@ -393,7 +394,7 @@ function EquipmentDialog() {
                     type="button"
                     className={`equipment-slot equipment-quality--${item.quality}`}
                     onFocus={() => setInspectedId(item.instanceId)}
-                    disabled={!earned}
+                    disabled={readOnly || !earned}
                     onClick={() => earned && useCombatStore.getState().unequipItem(owner.id, slot)}
                   >
                     <span><small>{SLOT_LABELS[slot]}</small><strong>{item.name}</strong></span>
@@ -484,7 +485,7 @@ function EquipmentDialog() {
                 <button
                   type="button"
                   className="button button--primary"
-                  disabled={!compatible}
+                  disabled={readOnly || !compatible}
                   onClick={() => equip(inspected)}
                 >{inspectedOwnerId === owner.id ? "Re-equip item" : `Equip on ${owner.name}`}</button>
               </>
@@ -505,7 +506,7 @@ function EquipmentDialog() {
   );
 }
 
-export function EquipmentPanel() {
+export function EquipmentPanel({ readOnly = false }: { readOnly?: boolean } = {}) {
   const open = useGameStore((state) => state.overlay === "inventory");
-  return open ? <EquipmentDialog /> : null;
+  return open ? <EquipmentDialog readOnly={readOnly} /> : null;
 }