From c0865d51967fb9ba9b0f268f9b84e8524f396186 Mon Sep 17 00:00:00 2001
From: MayaTheShy <MayaTheShy@gmail.com>
Date: Fri, 20 Feb 2026 02:35:41 -0500
Subject: [PATCH] feat: Add equipment and inventory action buttons to
 TurtleCard

---
 client/src/components/ControlPanel.jsx | 75 ++++++++++++++++++++++++--
 1 file changed, 72 insertions(+), 3 deletions(-)

diff --git a/client/src/components/ControlPanel.jsx b/client/src/components/ControlPanel.jsx
index bc105d5..6ed0763 100644
--- a/client/src/components/ControlPanel.jsx
+++ b/client/src/components/ControlPanel.jsx
@@ -487,17 +487,86 @@ function TurtleDetails({ turtle }) {
         </div>
       </div>
 
+      {/* Equipment & Inventory Actions */}
+      <div className="detail-section">
+        <h3>Equipment & Inventory</h3>
+        <div className="action-grid">
+          <button
+            className="action-btn"
+            onClick={() => equipLeft(turtle.turtleID)}
+            title="Equip selected item on left side"
+          >
+            🛡️ Equip L
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => equipRight(turtle.turtleID)}
+            title="Equip selected item on right side"
+          >
+            🗡️ Equip R
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => sortInventory(turtle.turtleID)}
+            title="Sort and compact inventory"
+          >
+            📋 Sort
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => dropItems(turtle.turtleID, 'front')}
+            title="Drop items forward"
+          >
+            📤 Drop
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => dropItems(turtle.turtleID, 'up')}
+            title="Drop items upward"
+          >
+            ⬆️ Drop Up
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => dropItems(turtle.turtleID, 'down')}
+            title="Drop items downward"
+          >
+            ⬇️ Drop Down
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => suckItems(turtle.turtleID, 'front')}
+            title="Suck items from front"
+          >
+            📥 Suck
+          </button>
+          <button
+            className="action-btn"
+            onClick={() => {
+              const side = prompt('Enter peripheral side (front/top/bottom/left/right):');
+              if (side) connectToInventory(turtle.turtleID, side);
+            }}
+            title="Read adjacent inventory peripheral contents"
+          >
+            📦 Read Inv
+          </button>
+        </div>
+      </div>
+
       {turtle.inventory && turtle.inventory.length > 0 && (
         <div className="detail-section">
-          <h3>Inventory ({turtle.inventoryCount || turtle.inventory.length}/16)</h3>
+          <h3>Inventory ({turtle.inventoryCount || turtle.inventory.length}/16) — Slot: {turtle.selectedSlot || 1}</h3>
           <div className="inventory-grid">
             {Array.from({ length: 16 }, (_, slotIndex) => {
               const item = turtle.inventory[slotIndex];
+              const isSelected = (turtle.selectedSlot || 1) === (slotIndex + 1);
               return (
                 <div 
                   key={slotIndex} 
-                  className={`inventory-slot ${item ? 'filled' : 'empty'}`}
-                  title={item ? `${item.name.replace('minecraft:', '').replace(/_/g, ' ')} (${item.count})` : 'Empty'}
+                  className={`inventory-slot ${item ? 'filled' : 'empty'} ${isSelected ? 'selected-slot' : ''}`}
+                  title={item ? `${item.name.replace('minecraft:', '').replace(/_/g, ' ')} (${item.count}) — Click to select` : `Slot ${slotIndex + 1} — Click to select`}
+                  onClick={() => handleSlotClick(slotIndex)}
+                  style={isSelected ? { outline: '2px solid #60a5fa', outlineOffset: '-2px' } : {}}
                 >
                   {item ? (
                     <>