import { useSystemStore } from '../../stores/systemStore'

export function MockModeIndicator() {
  const { systemInfo, isConnected } = useSystemStore()
  
  const isMockMode = systemInfo?.environment === 'mock' || !isConnected
  
  if (!isMockMode) return null

  return (
    <div className="bg-yellow-100 border-l-4 border-yellow-500 p-3 mb-4">
      <div className="flex items-center">
        <div className="flex-shrink-0">
          <span className="text-yellow-600 text-lg">⚠️</span>
        </div>
        <div className="ml-3">
          <p className="text-sm text-yellow-700">
            <strong>Demo Mode:</strong> Running without hardware connection. 
            All data is simulated for testing purposes.
          </p>
        </div>
      </div>
    </div>
  )
}
