feat(note_actions): integrate shared switch into new layout

This commit is contained in:
Elian Doran 2025-12-10 18:40:56 +02:00
parent 2dc8948f33
commit b36a0bd10b
No known key found for this signature in database
2 changed files with 23 additions and 15 deletions

View File

@ -32,7 +32,7 @@ export default function BasicPropertiesTab({ note }: TabContext) {
<ProtectedNoteSwitch note={note} /> <ProtectedNoteSwitch note={note} />
<EditabilitySelect note={note} /> <EditabilitySelect note={note} />
{!isNewLayout && <BookmarkSwitch note={note} />} {!isNewLayout && <BookmarkSwitch note={note} />}
<SharedSwitch note={note} /> {!isNewLayout && <SharedSwitch note={note} />}
<TemplateSwitch note={note} /> <TemplateSwitch note={note} />
<NoteLanguageSwitch note={note} /> <NoteLanguageSwitch note={note} />
</div> </div>
@ -251,12 +251,29 @@ function TemplateSwitch({ note }: { note?: FNote | null }) {
} }
function SharedSwitch({ note }: { note?: FNote | null }) { function SharedSwitch({ note }: { note?: FNote | null }) {
const [ isShared, switchShareState ] = useShareState(note);
return (
<div className="shared-switch-container">
<FormToggle
currentValue={isShared}
onChange={switchShareState}
switchOnName={t("shared_switch.shared")} switchOnTooltip={t("shared_switch.toggle-on-title")}
switchOffName={t("shared_switch.shared")} switchOffTooltip={t("shared_switch.toggle-off-title")}
helpPage="R9pX4DGra2Vt"
disabled={["root", "_share", "_hidden"].includes(note?.noteId ?? "") || note?.noteId.startsWith("_options")}
/>
</div>
);
}
export function useShareState(note: FNote | null | undefined) {
const [ isShared, setIsShared ] = useState(false); const [ isShared, setIsShared ] = useState(false);
const refreshState = useCallback(() => { const refreshState = useCallback(() => {
setIsShared(!!note?.hasAncestor("_share")); setIsShared(!!note?.hasAncestor("_share"));
}, [ note ]); }, [ note ]);
useEffect(() => refreshState(), [ note ]); useEffect(() => refreshState(), [ refreshState ]);
useTriliumEvent("entitiesReloaded", ({ loadResults }) => { useTriliumEvent("entitiesReloaded", ({ loadResults }) => {
if (note && loadResults.getBranchRows().find((b) => b.noteId === note.noteId)) { if (note && loadResults.getBranchRows().find((b) => b.noteId === note.noteId)) {
refreshState(); refreshState();
@ -281,18 +298,7 @@ function SharedSwitch({ note }: { note?: FNote | null }) {
sync.syncNow(true); sync.syncNow(true);
}, [ note ]); }, [ note ]);
return ( return [ isShared, switchShareState ] as const;
<div className="shared-switch-container">
<FormToggle
currentValue={isShared}
onChange={switchShareState}
switchOnName={t("shared_switch.shared")} switchOnTooltip={t("shared_switch.toggle-on-title")}
switchOffName={t("shared_switch.shared")} switchOffTooltip={t("shared_switch.toggle-off-title")}
helpPage="R9pX4DGra2Vt"
disabled={["root", "_share", "_hidden"].includes(note?.noteId ?? "") || note?.noteId.startsWith("_options")}
/>
</div>
)
} }
function NoteLanguageSwitch({ note }: { note?: FNote | null }) { function NoteLanguageSwitch({ note }: { note?: FNote | null }) {

View File

@ -17,7 +17,7 @@ import { FormDropdownDivider, FormDropdownSubmenu, FormListItem, FormListTogglea
import { useIsNoteReadOnly, useNoteContext, useNoteLabel, useNoteProperty, useTriliumOption } from "../react/hooks"; import { useIsNoteReadOnly, useNoteContext, useNoteLabel, useNoteProperty, useTriliumOption } from "../react/hooks";
import { ParentComponent } from "../react/react_utils"; import { ParentComponent } from "../react/react_utils";
import { isExperimentalFeatureEnabled } from "../../services/experimental_features"; import { isExperimentalFeatureEnabled } from "../../services/experimental_features";
import { useNoteBookmarkState } from "./BasicPropertiesTab"; import { useNoteBookmarkState, useShareState } from "./BasicPropertiesTab";
const isNewLayout = isExperimentalFeatureEnabled("new-layout"); const isNewLayout = isExperimentalFeatureEnabled("new-layout");
@ -118,9 +118,11 @@ function NoteContextMenu({ note, noteContext }: { note: FNote, noteContext?: Not
function NoteBasicProperties({ note }: { note: FNote }) { function NoteBasicProperties({ note }: { note: FNote }) {
const [ isBookmarked, setIsBookmarked ] = useNoteBookmarkState(note); const [ isBookmarked, setIsBookmarked ] = useNoteBookmarkState(note);
const [ isShared, switchShareState ] = useShareState(note);
return <> return <>
<FormListToggleableItem icon="bx bx-bookmark" title={t("bookmark_switch.bookmark")} currentValue={isBookmarked} onChange={setIsBookmarked} /> <FormListToggleableItem icon="bx bx-bookmark" title={t("bookmark_switch.bookmark")} currentValue={isBookmarked} onChange={setIsBookmarked} />
<FormListToggleableItem icon="bx bx-share-alt" title={t("shared_switch.shared")} currentValue={isShared} onChange={switchShareState} />
</>; </>;
} }