decompose structure

src/features/edge-detail/components/EdgeTopbar.tsx

@@ -0,0 +1,46 @@
+import { LogOut, Menu, RefreshCw } from 'lucide-react';
+
+type EdgeTopbarProps = {
+  authEnabled: boolean;
+  currentEventsConnected: boolean;
+  edgeId: string;
+  onBack: () => void;
+  onLogout: () => void;
+  onRefresh: () => void;
+};
+
+export function EdgeTopbar({
+  authEnabled,
+  currentEventsConnected,
+  edgeId,
+  onBack,
+  onLogout,
+  onRefresh,
+}: EdgeTopbarProps) {
+  return (
+    <header className="topbar">
+      <div>
+        <span className="page-kicker">Операторская панель</span>
+        <h1>Буровая установка {edgeId}</h1>
+        <span className={`current-transport current-transport--${currentEventsConnected ? 'sse' : 'polling'}`}>
+          {currentEventsConnected ? 'SSE live' : 'polling'}
+        </span>
+      </div>
+      <div className="topbar-actions">
+        <button type="button" className="ghost-button" onClick={onBack}>
+          <Menu size={17} />
+          К списку
+        </button>
+        <button type="button" className="icon-button" onClick={onRefresh} title="Обновить данные">
+          <RefreshCw size={18} />
+        </button>
+        {authEnabled ? (
+          <button type="button" className="ghost-button" onClick={onLogout}>
+            <LogOut size={17} />
+            Выйти
+          </button>
+        ) : null}
+      </div>
+    </header>
+  );
+}