File size: 2,377 Bytes
b040061
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
export default function Header({ scanProgress, scanPhase }) {
  return (
    <header style={{
      padding: '24px 32px',
      borderBottom: '1px solid var(--border)',
    }}>
      <div style={{
        display: 'flex',
        justifyContent: 'space-between',
        alignItems: 'center',
      }}>
        <div>
          <h1 style={{
            fontSize: '28px',
            fontWeight: 700,
            color: 'var(--green)',
            letterSpacing: '4px',
          }}>
            &#9632; OPERATOR
          </h1>
          <p style={{
            fontSize: '12px',
            color: 'var(--text-dim)',
            marginTop: '4px',
            fontStyle: 'italic',
          }}>
            The AI Agent That Works While You Talk.
          </p>
        </div>
        {scanProgress > 0 && scanProgress < 100 && (
          <span style={{
            fontSize: '12px',
            color: 'var(--green)',
            letterSpacing: '2px',
            fontWeight: 700,
            animation: 'pulse 1.5s infinite',
          }}>
            SCANNING...
          </span>
        )}
      </div>

      {/* Progress bar */}
      {scanProgress > 0 && scanProgress < 100 && (
        <div style={{ marginTop: '16px' }}>
          <div style={{
            display: 'flex',
            justifyContent: 'space-between',
            alignItems: 'center',
            marginBottom: '6px',
          }}>
            <span style={{
              fontSize: '11px',
              color: 'var(--text-dim)',
              letterSpacing: '1px',
            }}>
              {scanPhase}
            </span>
            <span style={{
              fontSize: '11px',
              color: 'var(--text-dim)',
              fontVariantNumeric: 'tabular-nums',
            }}>
              {scanProgress}%
            </span>
          </div>
          <div style={{
            width: '100%',
            height: '6px',
            background: '#1a1a1a',
            borderRadius: '3px',
            overflow: 'hidden',
          }}>
            <div style={{
              width: `${scanProgress}%`,
              height: '100%',
              background: 'linear-gradient(90deg, var(--green), #00cc6a)',
              borderRadius: '3px',
              boxShadow: '0 0 8px rgba(0, 255, 136, 0.4)',
            }} />
          </div>
        </div>
      )}
    </header>
  );
}