fixed memmory
This commit is contained in:
@@ -0,0 +1,160 @@
|
||||
.memory-page {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 1.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.memory-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.memory-header h2 {
|
||||
margin: 0 0 0.25rem;
|
||||
}
|
||||
|
||||
.memory-header p {
|
||||
margin: 0;
|
||||
color: #8b95a8;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.memory-header-actions {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.memory-session-input {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.memory-message {
|
||||
padding: 0.6rem 0.9rem;
|
||||
background: #1a2a1f;
|
||||
border: 1px solid #2d5a3d;
|
||||
border-radius: 8px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.memory-section {
|
||||
background: #151922;
|
||||
border: 1px solid #2a2f3a;
|
||||
border-radius: 10px;
|
||||
padding: 1rem 1.25rem;
|
||||
}
|
||||
|
||||
.memory-section h3 {
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.memory-profile-form {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.memory-profile-form label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
font-size: 0.85rem;
|
||||
color: #8b95a8;
|
||||
}
|
||||
|
||||
.memory-profile-form input {
|
||||
padding: 0.45rem 0.6rem;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #2a2f3a;
|
||||
background: #0f1218;
|
||||
color: #e8ecf1;
|
||||
}
|
||||
|
||||
.memory-profile-form button {
|
||||
grid-column: 1 / -1;
|
||||
justify-self: start;
|
||||
}
|
||||
|
||||
.memory-summary {
|
||||
margin: 0;
|
||||
white-space: pre-wrap;
|
||||
color: #c5cdd8;
|
||||
}
|
||||
|
||||
.memory-add-fact {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.memory-add-fact input {
|
||||
flex: 1;
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
.memory-facts-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
}
|
||||
|
||||
.memory-facts-list li {
|
||||
padding: 0.75rem;
|
||||
background: #0f1218;
|
||||
border: 1px solid #2a2f3a;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.memory-fact-meta {
|
||||
display: flex;
|
||||
gap: 0.6rem;
|
||||
font-size: 0.78rem;
|
||||
color: #8b95a8;
|
||||
margin-bottom: 0.35rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.memory-source-auto {
|
||||
color: #7eb8da;
|
||||
}
|
||||
|
||||
.memory-source-user,
|
||||
.memory-source-tool {
|
||||
color: #9ed49e;
|
||||
}
|
||||
|
||||
.memory-source-api {
|
||||
color: #d4b87a;
|
||||
}
|
||||
|
||||
.memory-fact-content {
|
||||
margin-bottom: 0.5rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.memory-empty {
|
||||
color: #8b95a8;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.memory-raw {
|
||||
background: #0f1218;
|
||||
border: 1px solid #2a2f3a;
|
||||
border-radius: 10px;
|
||||
padding: 1rem;
|
||||
overflow: auto;
|
||||
font-size: 0.82rem;
|
||||
max-height: 70vh;
|
||||
}
|
||||
@@ -0,0 +1,183 @@
|
||||
import { FormEvent, useCallback, useEffect, useState } from "react";
|
||||
import { api, MemoryFact, MemorySnapshot, UserProfile } from "../api/client";
|
||||
import "./Memory.css";
|
||||
|
||||
const PROFILE_FIELDS: (keyof UserProfile)[] = [
|
||||
"name",
|
||||
"age",
|
||||
"timezone",
|
||||
"language",
|
||||
"notes",
|
||||
];
|
||||
|
||||
export default function Memory() {
|
||||
const [snapshot, setSnapshot] = useState<MemorySnapshot | null>(null);
|
||||
const [profile, setProfile] = useState<UserProfile>({});
|
||||
const [facts, setFacts] = useState<MemoryFact[]>([]);
|
||||
const [sessionId, setSessionId] = useState("");
|
||||
const [newFact, setNewFact] = useState("");
|
||||
const [newCategory, setNewCategory] = useState("fact");
|
||||
const [message, setMessage] = useState("");
|
||||
const [showRaw, setShowRaw] = useState(false);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const load = useCallback(async () => {
|
||||
setLoading(true);
|
||||
setMessage("");
|
||||
try {
|
||||
const sid = sessionId.trim() ? Number(sessionId) : undefined;
|
||||
const data = await api.getMemorySnapshot(sid);
|
||||
setSnapshot(data);
|
||||
setProfile(data.profile || {});
|
||||
setFacts(data.facts || []);
|
||||
} catch (err) {
|
||||
setMessage(err instanceof Error ? err.message : "Ошибка загрузки");
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [sessionId]);
|
||||
|
||||
useEffect(() => {
|
||||
load().catch(console.error);
|
||||
}, [load]);
|
||||
|
||||
const handleProfileSave = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
try {
|
||||
await api.updateProfile(profile);
|
||||
setMessage("Профиль сохранён");
|
||||
await load();
|
||||
} catch (err) {
|
||||
setMessage(err instanceof Error ? err.message : "Ошибка");
|
||||
}
|
||||
};
|
||||
|
||||
const handleAddFact = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
if (!newFact.trim()) return;
|
||||
try {
|
||||
await api.createMemoryFact({
|
||||
content: newFact.trim(),
|
||||
category: newCategory,
|
||||
session_id: sessionId.trim() ? Number(sessionId) : undefined,
|
||||
});
|
||||
setNewFact("");
|
||||
setMessage("Факт добавлен");
|
||||
await load();
|
||||
} catch (err) {
|
||||
setMessage(err instanceof Error ? err.message : "Ошибка");
|
||||
}
|
||||
};
|
||||
|
||||
const handleForget = async (id: number) => {
|
||||
try {
|
||||
await api.forgetMemoryFact(id);
|
||||
setMessage(`Факт #${id} удалён`);
|
||||
await load();
|
||||
} catch (err) {
|
||||
setMessage(err instanceof Error ? err.message : "Ошибка");
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="memory-page">
|
||||
<header className="memory-header">
|
||||
<div>
|
||||
<h2>Память</h2>
|
||||
<p>Отладка профиля, фактов и автоизвлечения</p>
|
||||
</div>
|
||||
<div className="memory-header-actions">
|
||||
<input
|
||||
type="number"
|
||||
placeholder="session_id (опц.)"
|
||||
value={sessionId}
|
||||
onChange={(e) => setSessionId(e.target.value)}
|
||||
className="memory-session-input"
|
||||
/>
|
||||
<button type="button" onClick={() => load()} disabled={loading}>
|
||||
{loading ? "…" : "Обновить"}
|
||||
</button>
|
||||
<button type="button" onClick={() => setShowRaw((v) => !v)}>
|
||||
{showRaw ? "UI" : "JSON"}
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{message && <div className="memory-message">{message}</div>}
|
||||
|
||||
{showRaw ? (
|
||||
<pre className="memory-raw">{JSON.stringify(snapshot, null, 2)}</pre>
|
||||
) : (
|
||||
<>
|
||||
<section className="memory-section">
|
||||
<h3>Профиль</h3>
|
||||
<form className="memory-profile-form" onSubmit={handleProfileSave}>
|
||||
{PROFILE_FIELDS.map((key) => (
|
||||
<label key={key}>
|
||||
<span>{key}</span>
|
||||
<input
|
||||
value={profile[key] ?? ""}
|
||||
onChange={(e) =>
|
||||
setProfile((prev) => ({ ...prev, [key]: e.target.value }))
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
))}
|
||||
<button type="submit">Сохранить профиль</button>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
{snapshot?.session_summary && (
|
||||
<section className="memory-section">
|
||||
<h3>Сводка сессии</h3>
|
||||
<p className="memory-summary">{snapshot.session_summary}</p>
|
||||
</section>
|
||||
)}
|
||||
|
||||
<section className="memory-section">
|
||||
<h3>Факты ({facts.length})</h3>
|
||||
<form className="memory-add-fact" onSubmit={handleAddFact}>
|
||||
<input
|
||||
value={newFact}
|
||||
onChange={(e) => setNewFact(e.target.value)}
|
||||
placeholder="Новый факт вручную"
|
||||
/>
|
||||
<select
|
||||
value={newCategory}
|
||||
onChange={(e) => setNewCategory(e.target.value)}
|
||||
>
|
||||
<option value="fact">fact</option>
|
||||
<option value="preference">preference</option>
|
||||
<option value="person">person</option>
|
||||
<option value="habit">habit</option>
|
||||
<option value="project">project</option>
|
||||
</select>
|
||||
<button type="submit">Добавить</button>
|
||||
</form>
|
||||
<ul className="memory-facts-list">
|
||||
{facts.map((fact) => (
|
||||
<li key={fact.id}>
|
||||
<div className="memory-fact-meta">
|
||||
<span>#{fact.id}</span>
|
||||
<span className={`memory-source memory-source-${fact.source}`}>
|
||||
{fact.source}
|
||||
</span>
|
||||
<span>[{fact.category}]</span>
|
||||
<span>imp {fact.importance}</span>
|
||||
</div>
|
||||
<div className="memory-fact-content">{fact.content}</div>
|
||||
<button type="button" onClick={() => handleForget(fact.id)}>
|
||||
Забыть
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
{facts.length === 0 && (
|
||||
<li className="memory-empty">Фактов пока нет</li>
|
||||
)}
|
||||
</ul>
|
||||
</section>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user