aboutsummaryrefslogtreecommitdiffstats
path: root/renderer/src/components/Header.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'renderer/src/components/Header.tsx')
-rw-r--r--renderer/src/components/Header.tsx14
1 files changed, 14 insertions, 0 deletions
diff --git a/renderer/src/components/Header.tsx b/renderer/src/components/Header.tsx
index b6bed26..b4faa6e 100644
--- a/renderer/src/components/Header.tsx
+++ b/renderer/src/components/Header.tsx
@@ -1,6 +1,8 @@
1import React from "react"; 1import React from "react";
2import type { Project, Session, Phase } from "../types"; 2import type { Project, Session, Phase } from "../types";
3 3
4type Theme = "dark" | "light";
5
4interface HeaderProps { 6interface HeaderProps {
5 projects: Project[]; 7 projects: Project[];
6 sessions: Session[]; 8 sessions: Session[];
@@ -12,6 +14,8 @@ interface HeaderProps {
12 onCreateSession: () => void; 14 onCreateSession: () => void;
13 onDeleteProject?: (id: string) => void; 15 onDeleteProject?: (id: string) => void;
14 onDeleteSession?: (id: string) => void; 16 onDeleteSession?: (id: string) => void;
17 theme: Theme;
18 onToggleTheme: () => void;
15} 19}
16 20
17const phaseLabels: Record<Phase, string> = { 21const phaseLabels: Record<Phase, string> = {
@@ -33,6 +37,8 @@ export function Header({
33 onCreateSession, 37 onCreateSession,
34 onDeleteProject, 38 onDeleteProject,
35 onDeleteSession, 39 onDeleteSession,
40 theme,
41 onToggleTheme,
36}: HeaderProps) { 42}: HeaderProps) {
37 const handleDeleteProject = () => { 43 const handleDeleteProject = () => {
38 if (!selectedProject || !onDeleteProject) return; 44 if (!selectedProject || !onDeleteProject) return;
@@ -51,6 +57,9 @@ export function Header({
51 return ( 57 return (
52 <header className="header"> 58 <header className="header">
53 <div className="header-left"> 59 <div className="header-left">
60 {/* ── Wordmark ── */}
61 <span className="app-wordmark">Claude Flow</span>
62
54 <select 63 <select
55 value={selectedProject?.id || ""} 64 value={selectedProject?.id || ""}
56 onChange={(e) => { 65 onChange={(e) => {
@@ -129,6 +138,11 @@ export function Header({
129 })} 138 })}
130 </div> 139 </div>
131 )} 140 )}
141
142 {/* ── Theme toggle ── */}
143 <button className="theme-toggle" onClick={onToggleTheme}>
144 {theme === "dark" ? "[light]" : "[dark]"}
145 </button>
132 </div> 146 </div>
133 </header> 147 </header>
134 ); 148 );