fix(ribbon): formatting toolbar disappearing after viewing attachments

This commit is contained in:
Elian Doran 2025-11-29 10:31:56 +02:00
parent a6ed4d92c9
commit 12abdcaf6c
No known key found for this signature in database
2 changed files with 55 additions and 56 deletions

View File

@ -8,6 +8,7 @@ import NoteActions from "./NoteActions";
import { KeyboardActionNames } from "@triliumnext/commons"; import { KeyboardActionNames } from "@triliumnext/commons";
import { RIBBON_TAB_DEFINITIONS } from "./RibbonDefinition"; import { RIBBON_TAB_DEFINITIONS } from "./RibbonDefinition";
import { TabConfiguration, TitleContext } from "./ribbon-interface"; import { TabConfiguration, TitleContext } from "./ribbon-interface";
import clsx from "clsx";
const TAB_CONFIGURATION = numberObjectsInPlace<TabConfiguration>(RIBBON_TAB_DEFINITIONS); const TAB_CONFIGURATION = numberObjectsInPlace<TabConfiguration>(RIBBON_TAB_DEFINITIONS);
@ -63,62 +64,61 @@ export default function Ribbon() {
}, [ computedTabs, activeTabIndex ])); }, [ computedTabs, activeTabIndex ]));
return ( return (
<div className="ribbon-container" style={{ contain: "none" }}> <div
{noteContext?.viewScope?.viewMode === "default" && ( className={clsx("ribbon-container", noteContext?.viewScope?.viewMode !== "default" && "hidden-ext")}
<> style={{ contain: "none" }}
<div className="ribbon-top-row"> >
<div className="ribbon-tab-container"> <div className="ribbon-top-row">
{computedTabs && computedTabs.map(({ title, icon, index, toggleCommand, shouldShow }) => ( <div className="ribbon-tab-container">
shouldShow && <RibbonTab {computedTabs && computedTabs.map(({ title, icon, index, toggleCommand, shouldShow }) => (
icon={icon} shouldShow && <RibbonTab
title={typeof title === "string" ? title : title(titleContext)} icon={icon}
active={index === activeTabIndex} title={typeof title === "string" ? title : title(titleContext)}
toggleCommand={toggleCommand} active={index === activeTabIndex}
onClick={() => { toggleCommand={toggleCommand}
if (activeTabIndex !== index) { onClick={() => {
setActiveTabIndex(index); if (activeTabIndex !== index) {
} else { setActiveTabIndex(index);
// Collapse } else {
setActiveTabIndex(undefined); // Collapse
} setActiveTabIndex(undefined);
}} }
/> }}
))} />
))}
</div>
<div className="ribbon-button-container">
{ note && <NoteActions note={note} noteContext={noteContext} /> }
</div>
</div>
<div className="ribbon-body-container">
{computedTabs && computedTabs.map(tab => {
const isActive = tab.index === activeTabIndex;
if (!isActive && !tab.stayInDom) {
return;
}
const TabContent = tab.content;
return (
<div className={`ribbon-body ${!isActive ? "hidden-ext" : ""}`}>
<TabContent
note={note}
hidden={!isActive}
ntxId={ntxId}
hoistedNoteId={hoistedNoteId}
notePath={notePath}
noteContext={noteContext}
componentId={componentId}
activate={useCallback(() => {
setActiveTabIndex(tab.index)
}, [setActiveTabIndex])}
/>
</div> </div>
<div className="ribbon-button-container"> );
{ note && <NoteActions note={note} noteContext={noteContext} /> } })}
</div> </div>
</div>
<div className="ribbon-body-container">
{computedTabs && computedTabs.map(tab => {
const isActive = tab.index === activeTabIndex;
if (!isActive && !tab.stayInDom) {
return;
}
const TabContent = tab.content;
return (
<div className={`ribbon-body ${!isActive ? "hidden-ext" : ""}`}>
<TabContent
note={note}
hidden={!isActive}
ntxId={ntxId}
hoistedNoteId={hoistedNoteId}
notePath={notePath}
noteContext={noteContext}
componentId={componentId}
activate={useCallback(() => {
setActiveTabIndex(tab.index)
}, [setActiveTabIndex])}
/>
</div>
);
})}
</div>
</>
)}
</div> </div>
) )
} }

View File

@ -41,7 +41,6 @@ export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetPro
// React to included note changes. // React to included note changes.
useTriliumEvent("refreshIncludedNote", ({ noteId }) => { useTriliumEvent("refreshIncludedNote", ({ noteId }) => {
console.log("Refresh ", noteId);
if (!contentRef.current) return; if (!contentRef.current) return;
refreshIncludedNote(contentRef.current, noteId); refreshIncludedNote(contentRef.current, noteId);
}); });