(null)
+ const [peekLoading, setPeekLoading] = useState(false)
const prefersReducedMotion = useReducedMotion()
useEffect(() => {
@@ -257,10 +262,28 @@ export default function InsightsPage() {
}
}
- const handleNoteClick = (noteId: string) => {
- router.push(`/home?openNote=${noteId}`)
+ const handleNoteClick = async (noteId: string) => {
+ setPeekLoading(true)
+ try {
+ const note = await getNoteById(noteId)
+ if (note) setPeekNote(note)
+ } catch {
+ toast.error(t('general.error'))
+ } finally {
+ setPeekLoading(false)
+ }
}
+ const closePeek = () => setPeekNote(null)
+
+ const openPeekFully = () => {
+ if (!peekNote) return
+ router.push(`/home?openNote=${peekNote.id}`)
+ setPeekNote(null)
+ }
+
+ const isRtl = locale === 'fa' || locale === 'ar'
+
const motionConfig = prefersReducedMotion
? { initial: false as const, animate: { opacity: 1, y: 0 }, transition: { duration: 0 } }
: {}
@@ -868,6 +891,60 @@ export default function InsightsPage() {
)}
+ {/* ── Peek panel (slide from right) ── */}
+
+ {peekNote && (
+
+ {/* Peek header */}
+
+
+ {peekLoading ? t('insightsView.loading') : (peekNote.title || t('insightsView.unknownNote'))}
+
+
+
+
+
+
+
+
+ {peekNote.title || t('insightsView.unknownNote')}
+
+ {peekNote.content ? (
+
+ ) : (
+
—
+ )}
+
+
- }>
+ }>
diff --git a/memento-note/components/sidebar.tsx b/memento-note/components/sidebar.tsx
index bc64455..373d96a 100644
--- a/memento-note/components/sidebar.tsx
+++ b/memento-note/components/sidebar.tsx
@@ -1159,7 +1159,7 @@ export function Sidebar({ className, user }: { className?: string; user?: any })
className={cn(
// Mobile: fixed overlay, slide in/out
'fixed inset-y-0 start-0 z-[70] md:relative md:z-auto',
- 'h-full min-h-0 w-80 shrink-0 flex flex-row overflow-hidden',
+ 'h-full min-h-0 w-80 xl:w-[22rem] 2xl:w-[26rem] shrink-0 flex flex-row overflow-hidden',
'transition-transform duration-300 ease-in-out',
isMobileOpen ? 'translate-x-0 shadow-2xl' : '-translate-x-full md:translate-x-0',
'border-e border-border/40 bg-white/95 md:bg-white/30 backdrop-blur-md sidebar-shadow dark:border-white/6 dark:bg-[#151515] dark:backdrop-blur-none',