import { useWorkbenchStore } from '@/features/workspace/WorkspaceStore';

function statusLabel(status: string): string {
  switch (status) {
    case 'running':
      return 'Running';
    case 'complete':
      return 'Complete';
    case 'failed':
      return 'Failed';
    default:
      return 'Idle';
  }
}

export function AgentStatusBar() {
  const agentRun = useWorkbenchStore((s) => s.agentRun);
  const vigthoriaCliPath = useWorkbenchStore((s) => s.vigthoriaCliPath);
  const auth = useWorkbenchStore((s) => s.auth);
  const authChecking = useWorkbenchStore((s) => s.authChecking);
  const refreshAuth = useWorkbenchStore((s) => s.refreshAuth);
  const startLogin = useWorkbenchStore((s) => s.startLogin);

  const authClass = auth.authenticated ? 'ok' : auth.hasToken ? 'warn' : 'error';

  return (
    <div className={`agent-status agent-status--${agentRun.status}`}>
      <div className="agent-status__group">
        <span className="agent-status__label">Agent</span>
        <span className="agent-status__value">{statusLabel(agentRun.status)}</span>
      </div>
      <div className="agent-status__group">
        <span className="agent-status__label">Tools</span>
        <span className="agent-status__value">{agentRun.toolCount}</span>
      </div>
      {agentRun.currentTool && (
        <div className="agent-status__group agent-status__group--grow">
          <span className="agent-status__label">Current</span>
          <span className="agent-status__value agent-status__mono">{agentRun.currentTool}</span>
        </div>
      )}
      {agentRun.elapsed && (
        <div className="agent-status__group">
          <span className="agent-status__label">Elapsed</span>
          <span className="agent-status__value">{agentRun.elapsed}</span>
        </div>
      )}
      {agentRun.summaryTitle && (
        <div className="agent-status__group agent-status__group--grow">
          <span className="agent-status__label">Report</span>
          <span className="agent-status__value">{agentRun.summaryTitle}</span>
        </div>
      )}
      <div className="agent-status__group">
        <span className="agent-status__label">CLI</span>
        <span className={`agent-status__value ${vigthoriaCliPath ? 'ok' : 'warn'}`}>
          {vigthoriaCliPath ? 'ready' : 'missing'}
        </span>
      </div>
      <div className="agent-status__group agent-status__group--auth">
        <span className="agent-status__label">Account</span>
        <button
          type="button"
          className={`agent-status__auth ${authClass}`}
          title={auth.message}
          onClick={() => {
            if (auth.authenticated || auth.hasToken) {
              void refreshAuth(true);
            } else {
              void startLogin().then(() => refreshAuth(true)).catch(() => refreshAuth(true));
            }
          }}
        >
          {authChecking
            ? 'checking…'
            : auth.authenticated
              ? auth.email || 'logged in'
              : auth.hasToken
                ? 'session expired'
                : 'not logged in'}
        </button>
      </div>
    </div>
  );
}
