apunkt/trustgraph
1
0
Fork 0
mirror of https://github.com/trustgraph-ai/trustgraph.git synced 2026-07-02 02:58:10 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Merge commit '9b2f675702' as 'ai-context/context-graph-demo'

Browse source
This commit is contained in:
elpresidank 2026-04-05 21:08:35 -05:00
commit ecaf3489f1
54 changed files with 10078 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

58
ai-context/context-graph-demo/src/components/common/Header.tsx Normal file
View file

@ -0,0 +1,58 @@
import type { TabKey } from "../../types";
interface HeaderProps {
activeTab: TabKey;
onTabChange: (tab: TabKey) => void;
}
export function Header({ activeTab, onTabChange }: HeaderProps) {
return (
<div style={{
borderBottom: "1px solid rgba(255,255,255,0.06)",
padding: "16px 28px", display: "flex", alignItems: "center", justifyContent: "space-between",
background: "linear-gradient(180deg, rgba(15,15,22,1) 0%, rgba(10,10,15,1) 100%)",
}}>
<div style={{ display: "flex", alignItems: "center", gap: 14 }}>
<img
src="/tg.svg"
alt="TrustGraph"
style={{ width: 36, height: 36, borderRadius: 8 }}
/>
<div>
<div style={{ fontWeight: 700, fontSize: 16, letterSpacing: "-0.02em", color: "#fff" }}>
TrustGraph
</div>
<div style={{ fontSize: 11, color: "#666", fontFamily: "'IBM Plex Mono', monospace", letterSpacing: "0.05em" }}>
CONTEXT GRAPH DEMO
</div>
</div>
</div>
<div style={{ display: "flex", gap: 6, fontFamily: "'IBM Plex Mono', monospace", fontSize: 12 }}>
{(["graph", "query", "explain", "data", "ontology"] as const).map((tab) => {
const labels: Record<typeof tab, string> = {
graph: "◈ Context Graph",
query: "⚡ Agent Query",
explain: "◉ Explain",
data: "▤ Table Explorer",
ontology: "◇ Ontology",
};
return (
<button
key={tab}
onClick={() => onTabChange(tab)}
style={{
padding: "7px 16px", borderRadius: 6, border: "none", cursor: "pointer",
background: activeTab === tab ? "rgba(255,255,255,0.1)" : "transparent",
color: activeTab === tab ? "#fff" : "#666",
fontFamily: "'IBM Plex Mono', monospace", fontSize: 12, fontWeight: activeTab === tab ? 600 : 400,
transition: "all 0.2s",
}}
>
{labels[tab]}
</button>
);
})}
</div>
</div>
);
}