'use client';

import { NodeShell } from './node-shell';

interface DelayNodeData {
  duration?: string;
  cancelOn?: string;
  reminder?: string;
  isStart?: boolean;
  nodeId?: string;
  [key: string]: unknown;
}

export function DelayNode({ data, id }: { data: DelayNodeData; id: string }) {
  const duration = data.duration ?? '?';
  const cancelOn = data.cancelOn;
  const isStart = data.isStart;
  const nodeId = (data.nodeId as string) || id;

  return (
    <NodeShell
      accentColor="#ff7043"
      icon={'\u23F0'}
      title="Задержка"
      nodeId={nodeId}
      isStart={isStart}
    >
      {/* Duration — large text */}
      <p
        style={{
          fontSize: 16,
          fontWeight: 700,
          color: '#ff7043',
          textAlign: 'center',
          margin: '4px 0',
        }}
      >
        {duration}
      </p>

      {/* cancelOn below */}
      {cancelOn && (
        <p
          style={{
            fontSize: 10,
            color: '#999',
            textAlign: 'center',
            margin: '0 0 2px',
          }}
        >
          Отмена: {cancelOn}
        </p>
      )}
    </NodeShell>
  );
}
