File size: 4,241 Bytes
cfaaa6c
 
1dd9186
cfaaa6c
 
 
 
1dd9186
cfaaa6c
 
 
 
 
 
 
 
1dd9186
 
cfaaa6c
 
 
 
 
 
 
 
 
 
 
 
 
 
1dd9186
 
 
cfaaa6c
 
1dd9186
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
cfaaa6c
 
 
1dd9186
cfaaa6c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1dd9186
 
 
 
 
 
 
 
 
cfaaa6c
 
 
 
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
export default function Toolbar({
  backendUrl,
  liveDebugUrl,
  breadcrumbs,
  canCreateComponent,
  isRunning,
  isInsideComponent,
  isDemo,
  notice,
  onCreateComponent,
  onGoBack,
  onGoRoot,
  onOpenSettings,
  theme,
  onToggleTheme,
  onRun,
  liveDebugStatus = 'off',
  onToggleLiveDebug,
  llmTestMode,
  onLlmTestRun,
  onStopLlmTest,
  onNew,
  onSave,
  onSaveAs,
  onLoad,
}) {
  return (
    <header className="toolbar">
      <div className="toolbar__group">
        <button type="button" className="toolbar__button toolbar__button--primary" onClick={onRun} disabled={isRunning}>
          {isRunning ? 'Идет...' : 'Интерактивный прогон'}
        </button>
        {isDemo ? (
          <button type="button" className="toolbar__button" onClick={onLoad} disabled={isRunning}>
            Открыть
          </button>
        ) : null}

        {!isDemo ? (
          <>
            <button
              type="button"
              className="toolbar__button"
              onClick={llmTestMode ? onStopLlmTest : onLlmTestRun}
              disabled={isRunning && !llmTestMode}
            >
              {llmTestMode ? 'Остановить LLM тест' : 'LLM тест'}
            </button>
            <button
              type="button"
              className={`toolbar__button toolbar__button--live ${liveDebugStatus === 'connected' ? 'is-connected' : ''}`}
              onClick={onToggleLiveDebug}
              disabled={liveDebugStatus === 'connecting'}
              title="Подключиться к live-состоянию workflow runtime"
            >
              {liveDebugStatus === 'connected'
                ? 'Отключить live'
                : liveDebugStatus === 'connecting'
                  ? 'Live...'
                  : 'Live debug'}
            </button>
            <button type="button" className="toolbar__button" onClick={onCreateComponent} disabled={!canCreateComponent || isRunning}>
              Создать компонент
            </button>
            {isInsideComponent ? (
              <button type="button" className="toolbar__button" onClick={onGoBack} disabled={isRunning}>
                Назад
              </button>
            ) : null}
            <button type="button" className="toolbar__button" onClick={onOpenSettings}>
              Настройки
            </button>
            <button type="button" className="toolbar__button" onClick={onNew} disabled={isRunning}>
              Новый
            </button>
            <button type="button" className="toolbar__button" onClick={onSave} disabled={isRunning}>
              Сохранить
            </button>
            <button type="button" className="toolbar__button" onClick={onSaveAs} disabled={isRunning}>
              Сохранить как
            </button>
            <button type="button" className="toolbar__button" onClick={onLoad} disabled={isRunning}>
              Открыть
            </button>
          </>
        ) : null}
      </div>

      <div className="toolbar__meta">
        {!isDemo && breadcrumbs?.length ? (
          <div className="toolbar__breadcrumbs">
            {breadcrumbs.map((crumb, index) => (
              <button
                key={crumb.id}
                type="button"
                className={`toolbar__crumb ${index === breadcrumbs.length - 1 ? 'is-current' : ''}`}
                onClick={index === 0 ? onGoRoot : () => crumb.onClick?.()}
              >
                {crumb.label}
              </button>
            ))}
          </div>
        ) : null}
        <button type="button" className="toolbar__button toolbar__button--theme" onClick={onToggleTheme}>
          {theme === 'dark' ? 'Светлая тема' : 'Темная тема'}
        </button>
        {!isDemo ? (
          <>
            <span className="toolbar__backend">Backend: {backendUrl}</span>
            {liveDebugUrl && liveDebugUrl !== backendUrl ? (
              <span className="toolbar__backend">Live: {liveDebugUrl}</span>
            ) : null}
            <span className="toolbar__notice">{notice}</span>
          </>
        ) : null}
      </div>
    </header>
  );
}