mirror of
https://github.com/zadam/trilium.git
synced 2025-10-19 14:49:01 +02:00
refactor(collection/presentation): use React way
This commit is contained in:
parent
79a31421a4
commit
81b2b18eb7
@ -1,16 +1,25 @@
|
||||
import { useEffect, useRef, useState } from "preact/hooks";
|
||||
import { ViewModeProps } from "../interface";
|
||||
import { buildPresentation } from "./slide_builder";
|
||||
import FNote from "../../../entities/fnote";
|
||||
import { useLayoutEffect, useState } from "preact/hooks";
|
||||
|
||||
export default function PresentationView({ note }: ViewModeProps<{}>) {
|
||||
return note && (
|
||||
<Presentation note={note} />
|
||||
)
|
||||
}
|
||||
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
function Presentation({ note }: { note: FNote }) {
|
||||
const [ slides, setSlides ] = useState<FNote[]>();
|
||||
|
||||
useEffect(() => {
|
||||
buildPresentation(note).then(presentationEl => {
|
||||
containerRef.current?.replaceChildren(presentationEl);
|
||||
});
|
||||
useLayoutEffect(() => {
|
||||
note.getChildNotes().then(setSlides);
|
||||
}, [ note ]);
|
||||
|
||||
return <div ref={containerRef} className="presentation" />;
|
||||
return (slides && slides?.map(slide => (
|
||||
<Slide note={slide} />
|
||||
)));
|
||||
}
|
||||
|
||||
function Slide({ note }: { note: FNote }) {
|
||||
return <p>{note.title}</p>
|
||||
}
|
||||
|
@ -1,13 +0,0 @@
|
||||
import FNote from "../../../entities/fnote";
|
||||
|
||||
export async function buildPresentation(parentNote: FNote) {
|
||||
const slides = await parentNote.getChildNotes();
|
||||
const rootElement = new DocumentFragment();
|
||||
|
||||
for (const slide of slides) {
|
||||
const slideEl = document.createElement("div");
|
||||
|
||||
}
|
||||
|
||||
return rootElement;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user