import React from 'react';
import styles from './node/style/baseOther.module.less';

// 定义节点状态类型
export type NodeStatus = 'waiting' | 'running' | 'success' | 'failed';

// 节点状态指示器组件
const NodeStatusIndicator: React.FC<{ status: NodeStatus, isVisible: boolean }> = ({ status, isVisible }) => {
  // 如果不可见，不渲染任何内容
  if (!isVisible) {
    return null;
  }

  // 根据状态返回相应的指示器样式
  const getStatusIndicator = () => {
    switch (status) {
      case 'waiting':
        return <div className={styles['status-waiting']} />;
      case 'running':
        return <div className={styles['status-running']} />;
      case 'success':
        return <div className={styles['status-success']} />;
      case 'failed':
        return <div className={styles['status-failed']} />;
      default:
        return null;
    }
  };

  return (
    <div className={styles['node-status-indicator']}>
      {getStatusIndicator()}
    </div>
  );
};

export default NodeStatusIndicator;