Fix syntax error and finalize robust note resizing
This commit is contained in:
@@ -26,18 +26,23 @@ interface MasonryItemProps {
|
||||
isDragging?: boolean;
|
||||
}
|
||||
|
||||
const MasonryItem = memo(function MasonryItem({ note, onEdit, onResize, onNoteSizeChange, onDragStart, onDragEnd, isDragging }: MasonryItemProps) {
|
||||
const MasonryItem = function MasonryItem({ note, onEdit, onResize, onNoteSizeChange, onDragStart, onDragEnd, isDragging }: MasonryItemProps) {
|
||||
const resizeRef = useResizeObserver(onResize);
|
||||
|
||||
useEffect(() => {
|
||||
onResize();
|
||||
const timer = setTimeout(onResize, 300);
|
||||
return () => clearTimeout(timer);
|
||||
}, [note.size, onResize]);
|
||||
|
||||
return (
|
||||
<div
|
||||
className="masonry-item absolute py-1"
|
||||
data-id={note.id}
|
||||
data-size={note.size}
|
||||
data-draggable="true"
|
||||
ref={resizeRef as any}
|
||||
>
|
||||
<div className="masonry-item-content relative">
|
||||
<div className="masonry-item-content relative" ref={resizeRef as any}>
|
||||
<NoteCard
|
||||
note={note}
|
||||
onEdit={onEdit}
|
||||
@@ -50,7 +55,7 @@ const MasonryItem = memo(function MasonryItem({ note, onEdit, onResize, onNoteSi
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
export function MasonryGrid({ notes, onEdit }: MasonryGridProps) {
|
||||
const { t } = useLanguage();
|
||||
@@ -354,7 +359,7 @@ export function MasonryGrid({ notes, onEdit }: MasonryGridProps) {
|
||||
<div ref={pinnedGridRef} className="relative min-h-[100px]">
|
||||
{pinnedNotes.map(note => (
|
||||
<MasonryItem
|
||||
key={`${note.id}-${note.size}`}
|
||||
key={note.id}
|
||||
note={note}
|
||||
onEdit={handleEdit}
|
||||
onResize={refreshLayout}
|
||||
@@ -376,7 +381,7 @@ export function MasonryGrid({ notes, onEdit }: MasonryGridProps) {
|
||||
<div ref={othersGridRef} className="relative min-h-[100px]">
|
||||
{othersNotes.map(note => (
|
||||
<MasonryItem
|
||||
key={`${note.id}-${note.size}`}
|
||||
key={note.id}
|
||||
note={note}
|
||||
onEdit={handleEdit}
|
||||
onResize={refreshLayout}
|
||||
|
||||
Reference in New Issue
Block a user