Skip to content

Commit 267fb82

Browse files
committed
feat: Contradiction Resolution, Visual Polish (Glassmorphism), and Doc Updates
1 parent ee4c7de commit 267fb82

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+4527
-1578
lines changed

App.tsx

Lines changed: 254 additions & 85 deletions
Large diffs are not rendered by default.

components/About.tsx

Lines changed: 19 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -10,27 +10,17 @@ const About = () => {
1010
<div className="text-center space-y-8 relative">
1111
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[500px] h-[500px] bg-purple-500/10 rounded-full blur-[100px] -z-10 pointer-events-none" />
1212

13-
<div className="inline-flex items-center gap-2 px-4 py-1.5 bg-indigo-500/10 border border-indigo-500/20 rounded-full mb-4">
14-
<span className="relative flex h-2 w-2">
15-
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-indigo-400 opacity-75"></span>
16-
<span className="relative inline-flex rounded-full h-2 w-2 bg-indigo-500"></span>
17-
</span>
18-
<span className="text-xs font-bold uppercase text-indigo-400 tracking-widest">Active Research Preview</span>
19-
</div>
20-
21-
<h1 className="text-7xl font-black text-white tracking-tighter mb-4">
13+
<h1 className="text-7xl font-black text-white tracking-tighter mb-4 pt-10">
2214
Synapse Context <span className="text-transparent bg-clip-text bg-gradient-to-r from-purple-400 to-indigo-500">Engine</span>
2315
</h1>
24-
<p className="text-lg text-slate-400 font-medium max-w-2xl mx-auto leading-relaxed">
25-
A biological memory architecture for LLMs. Replaces static RAG with dynamic, graph-based spreading activation.
26-
</p>
2716

28-
<div className="flex justify-center gap-6 pt-8">
29-
<Stat label="Version" value="0.1.0" />
30-
<div className="w-px h-12 bg-white/10" />
31-
<Stat label="License" value="Apache 2.0" />
32-
<div className="w-px h-12 bg-white/10" />
33-
<Stat label="Status" value="Research Demo" />
17+
<div className="flex flex-col items-center gap-4">
18+
<p className="text-lg text-slate-400 font-medium max-w-2xl mx-auto leading-relaxed">
19+
A brain inspired secure memory architecture for LLMs.
20+
</p>
21+
<a href="https://github.com/sasus-dev/synapse-context-engine/blob/main/LICENSE" target="_blank" rel="noopener noreferrer" className="inline-flex items-center px-4 py-1.5 rounded-full border border-slate-700 bg-slate-800/50 hover:bg-slate-700 hover:border-slate-500 transition-all cursor-pointer text-[10px] font-bold uppercase tracking-widest text-slate-300 hover:text-white shadow-lg">
22+
Apache 2.0 License
23+
</a>
3424
</div>
3525
</div>
3626

@@ -43,15 +33,10 @@ const About = () => {
4333
</h3>
4434
<p className="text-sm text-slate-400 leading-7">
4535
Built by <strong className="text-white">Lasse "Sasu" Sainia</strong> as an experiment in cognitive modeling.
46-
The goal is to move beyond vector similarity search and create systems that can "think" and "remember" associatively,
47-
mimicking the way human neurons reinforce pathways based on context.
36+
The goal is to move beyond vector similarity search and create systems that can "think" and "remember" associatively.
4837
</p>
49-
<div className="p-6 bg-white/5 border border-white/5 rounded-3xl">
50-
<p className="text-xl font-medium text-slate-300 italic leading-relaxed">
51-
"I don't use <span className="text-white font-bold">SOCIAL</span> media much..."
52-
</p>
53-
</div>
54-
<div className="flex gap-4">
38+
39+
<div className="flex gap-4 pt-2">
5540
<SocialLink icon={Twitter} label="X (Twitter)" href="https://x.com/sasus_dev" />
5641
<SocialLink icon={Linkedin} label="LinkedIn" href="https://www.linkedin.com/in/sasus-dev/" />
5742
</div>
@@ -65,35 +50,29 @@ const About = () => {
6550
<Cpu className="w-6 h-6 text-purple-400" />
6651
</div>
6752
<div>
68-
<h4 className="text-white font-bold text-lg">Project Goals</h4>
53+
<h4 className="text-white font-bold text-lg">Project Goal</h4>
6954
<p className="text-xs text-slate-500 uppercase tracking-widest">Roadmap 2025</p>
7055
</div>
7156
</div>
72-
<ul className="space-y-4">
73-
<GoalItem text="Recursive memory consolidation" touched />
74-
<GoalItem text="Multi-modal graph nodes (Image/Audio)" />
75-
<GoalItem text="Self-healing knowledge structures" />
76-
</ul>
57+
<p className="text-sm text-slate-300 font-medium">
58+
Create a human brain inspired memory architecture that is secure.
59+
</p>
7760
</div>
7861
</div>
7962
</div>
8063

8164
{/* Footer */}
82-
<div className="border-t border-white/5 pt-12 flex flex-col items-center space-y-6">
65+
<div className="border-t border-white/5 pt-12 flex flex-col items-center space-y-8">
8366
<a
8467
href="https://github.com/sasus-dev/synapse-context-engine"
8568
target="_blank"
8669
rel="noopener noreferrer"
87-
className="group flex items-center gap-3 px-8 py-4 bg-white text-black hover:bg-slate-200 rounded-full font-black uppercase tracking-widest transition-all shadow-[0_0_30px_rgba(255,255,255,0.1)]"
70+
className="group flex items-center gap-3 px-10 py-5 bg-gradient-to-r from-white to-slate-200 hover:from-slate-200 hover:to-white text-black rounded-full font-black uppercase tracking-widest transition-all shadow-[0_0_20px_rgba(255,255,255,0.15)] hover:shadow-[0_0_40px_rgba(255,255,255,0.3)] hover:scale-105 active:scale-95"
8871
>
89-
<Github className="w-5 h-5" />
90-
<span>Star / Support on GitHub</span>
72+
<Github className="w-6 h-6" />
73+
<span className="text-sm">Star on GitHub</span>
9174
</a>
92-
<p className="text-xs text-slate-600 font-medium">
93-
Designed & Engineered with <Heart className="w-3 h-3 text-red-500 inline mx-1 fill-red-500/20" /> by Lasse "Sasu" Sainia
94-
</p>
9575
</div>
96-
9776
</div>
9877
</div>
9978
);

components/AlgorithmicRulesView.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -154,7 +154,7 @@ const AlgorithmicRulesView: React.FC<AlgorithmicRulesViewProps> = ({ rules, setR
154154
const activeCount = rules.filter(r => r.isActive).length;
155155

156156
return (
157-
<div className="flex flex-col h-full bg-[#02040a] text-slate-200 overflow-hidden relative">
157+
<div className="flex flex-col h-full bg-transparent text-slate-200 overflow-hidden relative">
158158
<div className="absolute top-0 inset-x-0 h-64 bg-gradient-to-b from-purple-900/10 to-transparent pointer-events-none" />
159159

160160
{/* FLOATING HEADER */}
@@ -243,7 +243,7 @@ const AlgorithmicRulesView: React.FC<AlgorithmicRulesViewProps> = ({ rules, setR
243243
className={`
244244
group relative overflow-hidden rounded-2xl border transition-all duration-300 cursor-pointer
245245
${isExpanded
246-
? 'bg-[#0a0c10] border-purple-500/30 shadow-[0_4px_20px_rgba(0,0,0,0.3)] ring-1 ring-white/5'
246+
? 'bg-black/20 backdrop-blur-md border-purple-500/30 shadow-[0_4px_20px_rgba(0,0,0,0.3)] ring-1 ring-white/5'
247247
: 'bg-white/[0.02] border-white/5 hover:bg-white/[0.04] hover:border-white/10'
248248
}
249249
`}
@@ -293,7 +293,7 @@ const AlgorithmicRulesView: React.FC<AlgorithmicRulesViewProps> = ({ rules, setR
293293
{isExpanded && (
294294
<div className="px-5 pb-5 pl-14 animate-in slide-in-from-top-2 duration-200 cursor-default" onClick={e => e.stopPropagation()}>
295295
{isEditing ? (
296-
<div className="space-y-4 bg-black/30 p-4 rounded-xl border border-white/5">
296+
<div className="space-y-4 bg-black/20 backdrop-blur-md p-4 rounded-xl border border-white/5">
297297
<div className="flex justify-between items-center bg-blue-500/5 p-2 rounded-lg border border-blue-500/10">
298298
<div className="flex items-center gap-2">
299299
<Sparkles className="w-4 h-4 text-blue-400" />

components/ApiCallsView.tsx

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
import React, { useMemo, useState, useEffect } from 'react';
2+
import { History, Code } from 'lucide-react';
3+
4+
const ApiCallsView = ({ debugLogs }: any) => {
5+
// Deduplicate logs based on ID
6+
const uniqueLogs = useMemo(() => {
7+
const seen = new Set();
8+
return debugLogs.filter((log: any) => {
9+
if (seen.has(log.id)) return false;
10+
seen.add(log.id);
11+
return true;
12+
});
13+
}, [debugLogs]);
14+
15+
const [selectedLogId, setSelectedLogId] = useState<string | null>(uniqueLogs[0]?.id || null);
16+
const selectedLog = uniqueLogs.find((l: any) => l.id === selectedLogId) || uniqueLogs[0];
17+
const [activeCallIdx, setActiveCallIdx] = useState(0);
18+
const currentCall = selectedLog?.calls[activeCallIdx];
19+
20+
// Auto-select new logs
21+
useEffect(() => {
22+
if (uniqueLogs.length > 0 && !selectedLogId) setSelectedLogId(uniqueLogs[0].id);
23+
}, [uniqueLogs.length]);
24+
25+
return (
26+
<div className="grid grid-cols-1 lg:grid-cols-12 gap-6 h-full overflow-hidden">
27+
<div className="lg:col-span-4 flex flex-col bg-black/20 backdrop-blur-md border border-white/[0.04] rounded-3xl overflow-hidden shadow-inner h-full">
28+
<div className="p-4 border-b border-white/5 bg-black/40">
29+
<h3 className="text-[13px] font-black uppercase tracking-widest text-white">Event Log</h3>
30+
</div>
31+
<div className="flex-1 overflow-y-auto custom-scrollbar">
32+
{uniqueLogs.length === 0 ? (
33+
<div className="h-full flex flex-col items-center justify-center opacity-10 gap-4">
34+
<History className="w-12 h-12" />
35+
<p className="text-[12px] font-black uppercase tracking-widest">No Events</p>
36+
</div>
37+
) : uniqueLogs.map((log: any, i: number) => (
38+
<button
39+
key={log.id}
40+
onClick={() => { setSelectedLogId(log.id); setActiveCallIdx(0); }}
41+
className={`w-full text-left p-4 border-b border-white/[0.02] transition-all flex flex-col gap-1 ${selectedLogId === log.id ? 'bg-purple-600/10 border-l-4 border-l-purple-600' : 'hover:bg-white/[0.03]'}`}
42+
>
43+
<div className="flex justify-between items-center mb-1">
44+
<span className="text-[10px] font-mono text-slate-500">{log.timestamp}</span>
45+
<span className="text-[9px] font-black uppercase bg-white/5 px-1.5 py-0.5 rounded text-slate-400">TRACE_{uniqueLogs.length - i}</span>
46+
</div>
47+
<p className="text-[12px] text-white font-bold truncate">"{log.query}"</p>
48+
</button>
49+
))}
50+
</div>
51+
</div>
52+
53+
<div className="lg:col-span-8 bg-black/20 backdrop-blur-md border border-white/[0.04] rounded-3xl overflow-hidden flex flex-col h-full shadow-inner">
54+
{selectedLog && selectedLog.calls && selectedLog.calls.length > 0 ? (
55+
<>
56+
<div className="p-4 border-b border-white/5 flex flex-wrap items-center justify-between gap-3 bg-black/40">
57+
<div className="flex gap-2 overflow-x-auto pb-1 no-scrollbar">
58+
{selectedLog.calls.map((call: any, idx: number) => (
59+
<button
60+
key={idx}
61+
onClick={() => setActiveCallIdx(idx)}
62+
className={`px-3 py-1.5 rounded-lg text-[10px] font-black uppercase tracking-widest border transition-all whitespace-nowrap ${activeCallIdx === idx ? 'bg-emerald-600 border-emerald-400 text-white' : 'bg-white/5 border-white/10 text-slate-500'}`}
63+
>
64+
{call.type}
65+
</button>
66+
))}
67+
</div>
68+
<div className="flex items-center gap-2 shrink-0">
69+
{currentCall?.model && (
70+
<span className="px-2 py-1 bg-white/5 border border-white/10 rounded text-[10px] font-mono text-slate-400 uppercase">
71+
{currentCall.model}
72+
</span>
73+
)}
74+
<div className="px-3 py-1 bg-emerald-500/10 border border-emerald-500/20 rounded-lg text-[11px] font-mono text-emerald-500">{currentCall?.latency}MS</div>
75+
<div className="px-3 py-1 bg-purple-500/10 border border-purple-500/20 rounded-lg text-[11px] font-mono text-purple-400">
76+
{Math.round(currentCall?.tokens || 0)} TOKENS
77+
</div>
78+
</div>
79+
</div>
80+
81+
<div className="flex-1 overflow-hidden grid grid-cols-1 md:grid-cols-2 p-4 gap-4">
82+
<div className="flex flex-col gap-2 overflow-hidden h-full">
83+
<p className="text-[11px] font-black uppercase text-purple-400 px-2 tracking-widest">Input Payload</p>
84+
<div className="flex-1 bg-black/60 border border-white/5 rounded-2xl p-4 font-mono text-[11px] text-slate-400 overflow-auto custom-scrollbar leading-relaxed whitespace-pre-wrap">
85+
{currentCall?.input}
86+
</div>
87+
</div>
88+
<div className="flex flex-col gap-2 overflow-hidden h-full">
89+
<p className="text-[11px] font-black uppercase text-emerald-400 px-2 tracking-widest">Model Output</p>
90+
<div className="flex-1 bg-black/60 border border-white/5 rounded-2xl p-4 font-mono text-[11px] text-emerald-500/80 overflow-auto custom-scrollbar leading-relaxed whitespace-pre-wrap">
91+
{currentCall?.output}
92+
</div>
93+
</div>
94+
</div>
95+
</>
96+
) : (
97+
<div className="h-full flex flex-col items-center justify-center opacity-10 gap-4">
98+
<Code className="w-12 h-12" />
99+
<p className="text-[12px] font-black uppercase tracking-widest">Select a trace event</p>
100+
</div>
101+
)}
102+
</div>
103+
</div>
104+
);
105+
};
106+
107+
export default ApiCallsView;

components/AppHeader.tsx

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ const AppHeader: React.FC<TopBar1Props> = ({
1818
sessions, activeSessionId, setActiveSessionId
1919
}) => {
2020
return (
21-
<header className="shrink-0 border-b border-white/[0.06] bg-[#05070a] z-[110] relative">
22-
<div className="h-[56px] flex items-center justify-between px-6">
21+
<header className="h-[72px] border-b border-white/5 bg-black/20 backdrop-blur-md flex items-center justify-between px-6 shrink-0 z-[50] transition-all duration-300 pr-6">
22+
<div className="h-[56px] w-full flex items-center justify-between px-6">
2323
<div className="flex items-center gap-4">
2424
<button
2525
onClick={onMenuToggle}
@@ -28,8 +28,8 @@ const AppHeader: React.FC<TopBar1Props> = ({
2828
<Menu className="w-4 h-4" />
2929
</button>
3030
<div className="flex items-center gap-3">
31-
<div className="p-2 bg-purple-600/10 rounded-xl border border-purple-500/20 hidden md:flex">
32-
<Command className="w-4 h-4 text-purple-400" />
31+
<div className="p-2 bg-indigo-600/10 rounded-xl border border-indigo-500/20 hidden md:flex">
32+
<Command className="w-4 h-4 text-indigo-400" />
3333
</div>
3434
<h2 className="text-[12px] font-black uppercase tracking-[0.2em] text-white flex items-center">
3535
<span className="opacity-30">{view.toUpperCase()}</span>
@@ -51,18 +51,16 @@ const AppHeader: React.FC<TopBar1Props> = ({
5151
href="https://github.com/sasus-dev/synapse-context-engine/tree/main"
5252
target="_blank"
5353
rel="noopener noreferrer"
54-
className="hidden md:flex items-center gap-2 px-3 py-1.5 bg-white/5 hover:bg-white/10 border border-white/5 hover:border-white/10 rounded-lg transition-all group"
54+
className="hidden md:flex items-center gap-2 px-3 py-1.5 bg-white hover:bg-slate-200 text-black border border-white/20 rounded-full transition-all group shadow-[0_0_15px_rgba(255,255,255,0.3)] hover:shadow-[0_0_20px_rgba(255,255,255,0.5)]"
5555
>
56-
<Github className="w-4 h-4 text-slate-400 group-hover:text-white" />
57-
<span className="text-[11px] font-black uppercase text-slate-500 group-hover:text-slate-300 tracking-wider">GitHub</span>
56+
<Github className="w-4 h-4 text-black group-hover:scale-110 transition-transform" />
57+
<span className="text-[11px] font-black uppercase text-black tracking-wider">GitHub</span>
5858
</a>
5959

6060
{/* System Status - Mobile/Desktop */}
6161
{/* System Status - Mobile/Desktop */}
62-
<div className="hidden md:flex items-center gap-2.5 px-4 py-2 bg-emerald-500/5 border border-emerald-500/10 rounded-full">
63-
{/* Badge Removed */}
64-
<span className="text-[10px] font-black text-slate-500 uppercase tracking-widest leading-none">DEMO MODE</span>
65-
</div>
62+
{/* System Status - Mobile/Desktop */}
63+
{/* Badge Removed */}
6664

6765
{/* Right Panel Toggle */}
6866
{setIsRightCollapsed && (

0 commit comments

Comments
 (0)