diff --git a/apps/client/src/widgets/layout/InlineTitle.tsx b/apps/client/src/widgets/layout/InlineTitle.tsx index e2db39e9f..f92c0611a 100644 --- a/apps/client/src/widgets/layout/InlineTitle.tsx +++ b/apps/client/src/widgets/layout/InlineTitle.tsx @@ -1,9 +1,39 @@ import "./InlineTitle.css"; +import { useEffect, useState } from "preact/hooks"; + +import FNote from "../../entities/fnote"; +import { useNoteContext } from "../react/hooks"; + export default function InlineTitle() { + const { note, parentComponent } = useNoteContext(); + const [ shown, setShown ] = useState(shouldShow(note)); + + useEffect(() => { + setShown(shouldShow(note)); + }, [ note ]); + + useEffect(() => { + if (!shown) return; + + const titleRow = parentComponent.$widget[0] + .closest(".note-split") + ?.querySelector("&> .title-row"); + if (!titleRow) return; + + titleRow.classList.add("collapse"); + + return () => titleRow.classList.remove("collapse"); + }, [ shown, parentComponent ]); + return (
Title goes here.
); } + +function shouldShow(note: FNote | null | undefined) { + if (!note) return false; + return note.type === "text"; +} diff --git a/apps/client/src/widgets/note_title.css b/apps/client/src/widgets/note_title.css index 1ece021e4..138b5040e 100644 --- a/apps/client/src/widgets/note_title.css +++ b/apps/client/src/widgets/note_title.css @@ -51,6 +51,10 @@ body.experimental-feature-new-layout { display: none; } } + + &.collapse { + display: none !important; + } } .title-details {