From d8f3d5d13c907f86e739efd2a771b957a9cf9315 Mon Sep 17 00:00:00 2001
From: MayaTheShy <MayaTheShy@gmail.com>
Date: Fri, 20 Feb 2026 02:34:48 -0500
Subject: [PATCH] feat: Update TurtleCard to display turtle label instead of ID

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

diff --git a/client/src/components/ControlPanel.jsx b/client/src/components/ControlPanel.jsx
index eabeb21..c5caa80 100644
--- a/client/src/components/ControlPanel.jsx
+++ b/client/src/components/ControlPanel.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState, useCallback } from 'react';
 import { useTurtleStore } from '../store/turtleStore';
 import './ControlPanel.css';
 
@@ -6,6 +6,7 @@ function TurtleCard({ turtle, isSelected, onSelect }) {
   const activeState = turtle.state || turtle.mode || 'idle';
   const fuel = turtle.fuel === 'unlimited' ? '∞' : (turtle.fuel || '?');
   const inventoryCount = turtle.inventory?.length || 0;
+  const displayName = turtle.label || `Turtle ${turtle.turtleID}`;
 
   const modeColors = {
     mining: '#4ade80',
@@ -33,7 +34,7 @@ function TurtleCard({ turtle, isSelected, onSelect }) {
       style={{ borderColor: modeColors[activeState] || modeColors.unknown }}
     >
       <div className="turtle-header">
-        <h3>Turtle {turtle.turtleID}</h3>
+        <h3>{displayName}</h3>
         <span className="mode-badge" style={{ background: modeColors[activeState] || modeColors.unknown }}>
           {activeState}
         </span>