mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-08-28 05:25:33 +00:00
Merge pull request #475 from Mikethebot44/feature/add-memory-dialog-ux
improve Add Memory dialog UX and dark/light mode consistency
This commit is contained in:
commit
177b5e3419
4 changed files with 16 additions and 17 deletions
|
|
@ -634,12 +634,9 @@ export function AddMemoryView({
|
|||
>
|
||||
{({ state, handleChange, handleBlur }) => (
|
||||
<>
|
||||
<div
|
||||
className={`bg-black/5 border border-black/10 rounded-md ${
|
||||
addContentMutation.isPending ? "opacity-50" : ""
|
||||
}`}
|
||||
>
|
||||
<TextEditor
|
||||
<div className={addContentMutation.isPending ? "opacity-50" : ""}>
|
||||
<TextEditor
|
||||
containerClassName="bg-white/5 border-white/10 rounded-md"
|
||||
disabled={addContentMutation.isPending}
|
||||
onBlur={handleBlur}
|
||||
onChange={handleChange}
|
||||
|
|
@ -842,13 +839,14 @@ export function AddMemoryView({
|
|||
</TabsContent>
|
||||
|
||||
<TabsContent value="file" className="space-y-4">
|
||||
<form
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
fileUploadForm.handleSubmit()
|
||||
}}
|
||||
>
|
||||
className="h-full flex flex-col"
|
||||
>
|
||||
<div className="grid gap-4">
|
||||
<motion.div
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
|
|
@ -936,7 +934,7 @@ export function AddMemoryView({
|
|||
</fileUploadForm.Field>
|
||||
</motion.div>
|
||||
</div>
|
||||
<div className="mt-6 flex flex-col sm:flex-row sm:justify-between sm:items-end w-full gap-4">
|
||||
<div className="mt-6 flex flex-col sm:flex-row sm:justify-between sm:items-end w-full gap-4 mt-auto">
|
||||
<div className="flex items-end gap-4">
|
||||
{/* Left side - Project Selection */}
|
||||
<motion.div
|
||||
|
|
|
|||
|
|
@ -55,11 +55,7 @@ export function ProjectSelection({
|
|||
>
|
||||
<SelectValue placeholder="Select a project" />
|
||||
</SelectTrigger>
|
||||
<SelectContent
|
||||
className="bg-black/90 backdrop-blur-xl border-foreground/10 z-[90]"
|
||||
position="popper"
|
||||
sideOffset={5}
|
||||
>
|
||||
<SelectContent position="popper" sideOffset={5} className="z-[90]">
|
||||
<SelectItem
|
||||
className="hover:bg-foreground/10"
|
||||
key="default"
|
||||
|
|
|
|||
|
|
@ -91,6 +91,7 @@ interface TextEditorProps {
|
|||
placeholder?: string;
|
||||
disabled?: boolean;
|
||||
className?: string;
|
||||
containerClassName?: string;
|
||||
}
|
||||
|
||||
const initialValue: Descendant[] = [
|
||||
|
|
@ -243,6 +244,7 @@ export function TextEditor({
|
|||
placeholder = "Start writing...",
|
||||
disabled = false,
|
||||
className,
|
||||
containerClassName,
|
||||
}: TextEditorProps) {
|
||||
const editor = useMemo(() => withReact(createEditor()) as CustomEditor, []);
|
||||
const [editorValue, setEditorValue] = useState<Descendant[]>(() =>
|
||||
|
|
@ -421,7 +423,8 @@ export function TextEditor({
|
|||
);
|
||||
|
||||
return (
|
||||
<div className={cn("flex flex-col", className)}>
|
||||
<div className={cn("bg-foreground/5 border border-foreground/10 rounded-md", containerClassName)}>
|
||||
<div className={cn("flex flex-col", className)}>
|
||||
<div className="flex-1 min-h-48 max-h-64 overflow-y-auto">
|
||||
<Slate
|
||||
editor={editor}
|
||||
|
|
@ -451,6 +454,7 @@ export function TextEditor({
|
|||
minHeight: "11rem",
|
||||
maxHeight: "15rem",
|
||||
padding: "12px",
|
||||
overflowX: "hidden",
|
||||
}}
|
||||
/>
|
||||
</Slate>
|
||||
|
|
@ -540,6 +544,7 @@ export function TextEditor({
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -205,7 +205,7 @@ export function ConnectionsTabContent() {
|
|||
className="p-4 bg-yellow-500/10 border border-yellow-500/20 rounded-lg"
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
>
|
||||
<p className="text-sm text-yellow-400 mb-2">
|
||||
<p className="text-sm text-black-400 dark:text-yellow-400 mb-2">
|
||||
🔌 Connections are a Pro feature
|
||||
</p>
|
||||
<p className="text-xs text-foreground/60 mb-3">
|
||||
|
|
@ -213,7 +213,7 @@ export function ConnectionsTabContent() {
|
|||
sync your documents.
|
||||
</p>
|
||||
<Button
|
||||
className="bg-yellow-500/20 hover:bg-yellow-500/30 text-yellow-400 border-yellow-500/30"
|
||||
className="bg-yellow-500/20 text-black-400 hover:bg-yellow-500/30 dark:text-yellow-400 border-yellow-500/30"
|
||||
onClick={handleUpgrade}
|
||||
size="sm"
|
||||
variant="secondary"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue