Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
2.4 kB · 74 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475"use client";
import { useEffect, useState } from "react";import { useBlocks, useCanvasBlocksWithType,} from "src/hooks/queries/useBlocks";import { useEntity, useReplicache } from "src/replicache";import * as Y from "yjs";import * as base64 from "base64-js";import { YJSFragmentToString } from "components/Blocks/TextBlock/RenderYJSFragment";import { useParams, useRouter, useSearchParams } from "next/navigation";import { focusBlock } from "src/utils/focusBlock";import { useIsMobile } from "src/hooks/isMobile";import { useLeafletPublicationData } from "components/PageSWRDataProvider";
export function UpdateLeafletTitle(props: { entityID: string }) { let { data: pub } = useLeafletPublicationData(); let firstPage = useEntity(props.entityID, "root/page")[0]; let entityID = firstPage?.data.value || props.entityID;
let blocks = useBlocks(entityID).filter( (b) => b.type === "text" || b.type === "heading", ); let firstBlock = blocks[0]; let title = usePageTitle(entityID); useEffect(() => { if (pub?.title) { document.title = pub.title; return; } if (title) { document.title = title; } }, [title, pub]); let params = useSearchParams(); let focusFirstBlock = params.get("focusFirstBlock"); let router = useRouter(); let isMobile = useIsMobile(); useEffect(() => { if (isMobile) return; if (!firstBlock || focusFirstBlock === null) return;
router.replace(location.pathname); setTimeout(() => { focusBlock(firstBlock, { type: "start" }); //remove url param }, 100); }, [focusFirstBlock, firstBlock, router, isMobile]);
return null;}
export const usePageTitle = (entityID: string) => { let [title, setTitle] = useState(""); let canvasBlocks = useCanvasBlocksWithType(entityID).filter( (b) => b.type === "text" || b.type === "heading", ); let blocks = useBlocks(entityID).filter( (b) => b.type === "text" || b.type === "heading", ); let firstBlock = canvasBlocks[0] || blocks[0]; let content = useEntity(firstBlock?.value, "block/text"); useEffect(() => { if (content) { let doc = new Y.Doc(); const update = base64.toByteArray(content.data.value); Y.applyUpdate(doc, update); let nodes = doc.getXmlElement("prosemirror").toArray(); setTitle(YJSFragmentToString(nodes[0]) || "Untitled Leaflet"); } }, [content]); return title;};