fix(ui): revert resize panel + auto-hide meta sidebar when AI opens
This commit is contained in:
@@ -641,6 +641,16 @@ export function NotesTabsView({
|
|||||||
const [sortOrder, setSortOrder] = useState<SortOrder>('date-desc')
|
const [sortOrder, setSortOrder] = useState<SortOrder>('date-desc')
|
||||||
const [sidebarOpen, setSidebarOpen] = useState(true)
|
const [sidebarOpen, setSidebarOpen] = useState(true)
|
||||||
|
|
||||||
|
// Auto-hide the meta sidebar when the AI panel opens (to gain space)
|
||||||
|
useEffect(() => {
|
||||||
|
const handler = (e: Event) => {
|
||||||
|
const visible = (e as CustomEvent<boolean>).detail
|
||||||
|
if (visible) setSidebarOpen(false)
|
||||||
|
}
|
||||||
|
window.addEventListener('contextual-ai-visibility', handler)
|
||||||
|
return () => window.removeEventListener('contextual-ai-visibility', handler)
|
||||||
|
}, [])
|
||||||
|
|
||||||
const prevNotesRef = useRef<Note[]>(notes)
|
const prevNotesRef = useRef<Note[]>(notes)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -756,26 +766,6 @@ export function NotesTabsView({
|
|||||||
const selected = items.find((n) => n.id === selectedId) ?? null
|
const selected = items.find((n) => n.id === selectedId) ?? null
|
||||||
const colorKey = selected ? getColorKey(selected) : 'default'
|
const colorKey = selected ? getColorKey(selected) : 'default'
|
||||||
|
|
||||||
// Resizable left panel (180px min, 420px max, default 256px)
|
|
||||||
const [listPanelWidth, setListPanelWidth] = useState(256)
|
|
||||||
const isDraggingRef = useRef(false)
|
|
||||||
const handleResizeStart = (e: React.MouseEvent) => {
|
|
||||||
e.preventDefault()
|
|
||||||
isDraggingRef.current = true
|
|
||||||
const startX = e.clientX
|
|
||||||
const startW = listPanelWidth
|
|
||||||
const onMove = (ev: MouseEvent) => {
|
|
||||||
if (!isDraggingRef.current) return
|
|
||||||
setListPanelWidth(Math.min(420, Math.max(180, startW + (ev.clientX - startX))))
|
|
||||||
}
|
|
||||||
const onUp = () => {
|
|
||||||
isDraggingRef.current = false
|
|
||||||
window.removeEventListener('mousemove', onMove)
|
|
||||||
window.removeEventListener('mouseup', onUp)
|
|
||||||
}
|
|
||||||
window.addEventListener('mousemove', onMove)
|
|
||||||
window.addEventListener('mouseup', onUp)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleCreateNote = (noteType: NoteType = 'richtext') => {
|
const handleCreateNote = (noteType: NoteType = 'richtext') => {
|
||||||
startCreating(async () => {
|
startCreating(async () => {
|
||||||
@@ -836,8 +826,8 @@ export function NotesTabsView({
|
|||||||
style={{ height: 'max(360px, min(85vh, calc(100vh - 9rem)))' }}
|
style={{ height: 'max(360px, min(85vh, calc(100vh - 9rem)))' }}
|
||||||
data-testid="notes-grid-tabs"
|
data-testid="notes-grid-tabs"
|
||||||
>
|
>
|
||||||
{/* ── Left panel: note list — resizable ── */}
|
{/* ── Left panel: note list ── */}
|
||||||
<div className="flex shrink-0 flex-col border-r border-border/60 bg-background" style={{ width: listPanelWidth }}>
|
<div className="flex w-64 shrink-0 flex-col border-r border-border/60 bg-background">
|
||||||
|
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="flex items-center justify-between border-b border-border/60 bg-background/95 px-4 py-3.5">
|
<div className="flex items-center justify-between border-b border-border/60 bg-background/95 px-4 py-3.5">
|
||||||
@@ -962,15 +952,6 @@ export function NotesTabsView({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Resize handle */}
|
|
||||||
<div
|
|
||||||
onMouseDown={handleResizeStart}
|
|
||||||
className="w-1 shrink-0 cursor-col-resize bg-border/40 hover:bg-primary/40 transition-colors active:bg-primary/60 relative group"
|
|
||||||
title="Redimensionner"
|
|
||||||
>
|
|
||||||
<div className="absolute inset-y-0 -left-1 -right-1 group-hover:bg-primary/10 transition-colors" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* ── Right content panel ── */}
|
{/* ── Right content panel ── */}
|
||||||
{selected ? (
|
{selected ? (
|
||||||
<div className="flex min-w-0 flex-1 overflow-hidden">
|
<div className="flex min-w-0 flex-1 overflow-hidden">
|
||||||
|
|||||||
Reference in New Issue
Block a user