feat: enhance MemoryContent and TeamMemoryManager components with improved memory display and user prompts for empty memory states

This commit is contained in:
Anish Sarkar 2026-04-10 00:29:53 +05:30
parent 84fc72e596
commit b44c1ee034
3 changed files with 52 additions and 6 deletions

View file

@ -85,6 +85,7 @@ export function MemoryContent() {
}
};
const displayMemory = memory.replace(/\(\d{4}-\d{2}-\d{2}\)\s*/g, "");
const charCount = memory.length;
const getCounterColor = () => {
@ -102,6 +103,19 @@ export function MemoryContent() {
);
}
if (!memory) {
return (
<div className="flex flex-col items-center justify-center py-16 text-center">
<h3 className="text-base font-medium text-foreground">
What does SurfSense remember?
</h3>
<p className="mt-2 max-w-sm text-sm text-muted-foreground">
Nothing yet. SurfSense picks up on your preferences and context as you chat.
</p>
</div>
);
}
return (
<div className="space-y-4">
<Alert className="bg-muted/50 py-3 md:py-4">
@ -116,7 +130,7 @@ export function MemoryContent() {
<div className="h-[340px] overflow-y-auto rounded-md border">
<PlateEditor
markdown={memory}
markdown={displayMemory}
readOnly
preset="readonly"
variant="default"
@ -139,7 +153,7 @@ export function MemoryContent() {
value={editQuery}
onChange={(e) => setEditQuery(e.target.value)}
onKeyDown={handleKeyDown}
placeholder="e.g. &quot;I prefer TypeScript over JavaScript&quot; or &quot;Remove the entry about Tokyo&quot;"
placeholder="Tell SurfSense what to remember or forget"
disabled={editing}
rows={2}
className="pr-12 resize-none text-sm"

View file

@ -3,7 +3,7 @@
import { MarkdownPlugin, remarkMdx } from "@platejs/markdown";
import { slateToHtml } from "@slate-serializers/html";
import type { AnyPluginConfig, Descendant, Value } from "platejs";
import { createPlatePlugin, Key, Plate, usePlateEditor } from "platejs/react";
import { createPlatePlugin, Key, Plate, useEditorReadOnly, usePlateEditor } from "platejs/react";
import { useEffect, useMemo, useRef } from "react";
import remarkGfm from "remark-gfm";
import remarkMath from "remark-math";
@ -60,6 +60,24 @@ export interface PlateEditorProps {
extraPlugins?: AnyPluginConfig[];
}
function PlateEditorContent({
editorVariant,
placeholder,
}: {
editorVariant: PlateEditorProps["editorVariant"];
placeholder?: string;
}) {
const isReadOnly = useEditorReadOnly();
return (
<Editor
variant={editorVariant}
placeholder={isReadOnly ? undefined : placeholder}
className="min-h-full"
/>
);
}
export function PlateEditor({
markdown,
html,
@ -188,7 +206,7 @@ export function PlateEditor({
}}
>
<EditorContainer variant={variant} className={className}>
<Editor variant={editorVariant} placeholder={placeholder} className="min-h-full" />
<PlateEditorContent editorVariant={editorVariant} placeholder={placeholder} />
</EditorContainer>
</Plate>
</EditorSaveContext.Provider>

View file

@ -88,6 +88,7 @@ export function TeamMemoryManager({ searchSpaceId }: TeamMemoryManagerProps) {
}
};
const displayMemory = memory.replace(/\(\d{4}-\d{2}-\d{2}\)\s*/g, "");
const charCount = memory.length;
const getCounterColor = () => {
@ -105,6 +106,19 @@ export function TeamMemoryManager({ searchSpaceId }: TeamMemoryManagerProps) {
);
}
if (!memory) {
return (
<div className="flex flex-col items-center justify-center py-16 text-center">
<h3 className="text-base font-medium text-foreground">
What does SurfSense remember about your team?
</h3>
<p className="mt-2 max-w-sm text-sm text-muted-foreground">
Nothing yet. SurfSense picks up on team decisions and conventions as your team chats.
</p>
</div>
);
}
return (
<div className="space-y-4">
<Alert className="bg-muted/50 py-3 md:py-4">
@ -119,7 +133,7 @@ export function TeamMemoryManager({ searchSpaceId }: TeamMemoryManagerProps) {
<div className="h-[340px] overflow-y-auto rounded-md border">
<PlateEditor
markdown={memory}
markdown={displayMemory}
readOnly
preset="readonly"
variant="default"
@ -142,7 +156,7 @@ export function TeamMemoryManager({ searchSpaceId }: TeamMemoryManagerProps) {
value={editQuery}
onChange={(e) => setEditQuery(e.target.value)}
onKeyDown={handleKeyDown}
placeholder="e.g. &quot;We decided to use PostgreSQL&quot; or &quot;Remove the standup entry&quot;"
placeholder="Tell SurfSense what to remember or forget about your team"
disabled={editing}
rows={2}
className="pr-12 resize-none text-sm"