diff --git a/apps/client/src/widgets/BreadcrumbBadges.tsx b/apps/client/src/widgets/BreadcrumbBadges.tsx index 9c066f04e..ec9dc2927 100644 --- a/apps/client/src/widgets/BreadcrumbBadges.tsx +++ b/apps/client/src/widgets/BreadcrumbBadges.tsx @@ -5,7 +5,7 @@ import { ComponentChildren, MouseEventHandler } from "preact"; import { useRef } from "preact/hooks"; import { t } from "../services/i18n"; -import { BacklinksList } from "./FloatingButtonsDefinitions"; +import { BacklinksList, useBacklinkCount } from "./FloatingButtonsDefinitions"; import Dropdown, { DropdownProps } from "./react/Dropdown"; import { useIsNoteReadOnly, useNoteContext, useStaticTooltip } from "./react/hooks"; import Icon from "./react/Icon"; @@ -65,8 +65,8 @@ function ShareBadge() { } function BacklinksBadge() { - const { note } = useNoteContext(); - const count = 1; + const { note, viewScope } = useNoteContext(); + const count = useBacklinkCount(note, viewScope?.viewMode === "default"); return (note && count > 0 && (null); - - function refresh() { - if (!isDefaultViewMode) return; - - server.get(`note-map/${note.noteId}/backlink-count`).then(resp => { - setBacklinkCount(resp.count); - }); - } - - useEffect(() => refresh(), [ note ]); - useTriliumEvent("entitiesReloaded", ({ loadResults }) => { - if (needsRefresh(note, loadResults)) refresh(); - }); + const backlinkCount = useBacklinkCount(note, isDefaultViewMode); // Determine the max height of the container. const { windowHeight } = useWindowSize(); @@ -336,7 +326,7 @@ function Backlinks({ note, isDefaultViewMode }: FloatingButtonContext) { } }, [ popupOpen, windowHeight ]); - const isEnabled = isDefaultViewMode && backlinkCount > 0; + const isEnabled = !isNewLayout && isDefaultViewMode && backlinkCount > 0; return (isEnabled &&
{ + if (!note || !isDefaultViewMode) return; + + server.get(`note-map/${note.noteId}/backlink-count`).then(resp => { + setBacklinkCount(resp.count); + }); + }, [ isDefaultViewMode, note ]); + + useEffect(() => refresh(), [ note, isDefaultViewMode, refresh ]); + useTriliumEvent("entitiesReloaded", ({ loadResults }) => { + if (note && needsRefresh(note, loadResults)) refresh(); + }); + + return backlinkCount; +} + export function BacklinksList({ note }: { note: FNote }) { const [ backlinks, setBacklinks ] = useState([]); @@ -362,8 +371,8 @@ export function BacklinksList({ note }: { note: FNote }) { server.get(`note-map/${note.noteId}/backlinks`).then(async (backlinks) => { // prefetch all const noteIds = backlinks - .filter(bl => "noteId" in bl) - .map((bl) => bl.noteId); + .filter(bl => "noteId" in bl) + .map((bl) => bl.noteId); await froca.getNotes(noteIds); setBacklinks(backlinks); });