Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-17 05:39:55 +01:00
Code Issues Packages Projects Releases Activity

feat(note_actions): reintroduce help pages

Browse Source
This commit is contained in:
Elian Doran
2025-12-10 22:18:53 +02:00
parent 6f85b7cc09
commit 8d8ff25bae
9 changed files with 49 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
apps/client/src/widgets/react/FormList.tsx
View File

@@ -5,7 +5,7 @@ import { useEffect, useMemo, useRef, useState, type CSSProperties } from "preact
import "./FormList.css";
import { CommandNames } from "../../components/app_context";
import { useStaticTooltip } from "./hooks";
import { handleRightToLeftPlacement, isMobile } from "../../services/utils";
import { handleRightToLeftPlacement, isMobile, openInAppHelpFromUrl } from "../../services/utils";
import clsx from "clsx";
import FormToggle from "./FormToggle";
@@ -95,12 +95,13 @@ interface FormListItemOpts {
description?: string;
className?: string;
rtl?: boolean;
postContent?: ComponentChildren;
}
const TOOLTIP_CONFIG: Partial<Tooltip.Options> = {
placement: handleRightToLeftPlacement("right"),
fallbackPlacements: [ handleRightToLeftPlacement("right") ]
}
};
export function FormListItem({ className, icon, value, title, active, disabled, checked, container, onClick, selected, rtl, triggerCommand, description, ...contentProps }: FormListItemOpts) {
const itemRef = useRef<HTMLLIElement>(null);
@@ -133,9 +134,10 @@ export function FormListItem({ className, icon, value, title, active, disabled,
);
}
export function FormListToggleableItem({ title, currentValue, onChange, disabled, ...props }: Omit<FormListItemOpts, "onClick" | "children"> & {
export function FormListToggleableItem({ title, currentValue, onChange, disabled, helpPage, ...props }: Omit<FormListItemOpts, "onClick" | "children"> & {
title: string;
currentValue: boolean;
helpPage?: string;
onChange(newValue: boolean): void | Promise<void>;
}) {
const isWaiting = useRef(false);
@@ -145,6 +147,10 @@ export function FormListToggleableItem({ title, currentValue, onChange, disabled
{...props}
disabled={disabled}
onClick={async (e) => {
if ((e.target as HTMLElement | null)?.classList.contains("contextual-help")) {
return;
}
e.stopPropagation();
if (!disabled && !isWaiting.current) {
isWaiting.current = true;
@@ -157,6 +163,15 @@ export function FormListToggleableItem({ title, currentValue, onChange, disabled
switchOffName={title}
currentValue={currentValue}
onChange={() => {}}
afterName={<>
{helpPage && (
<span
class="bx bx-help-circle contextual-help"
onClick={() => openInAppHelpFromUrl(helpPage)}
/>
)}
<span class="switch-spacer" />
</>}
/>
</FormListItem>
);
@@ -169,7 +184,7 @@ function FormListContent({ children, badges, description, disabled, disabledTool
<span className={`badge ${className ?? ""}`}>{text}</span>
))}
{disabled && disabledTooltip && (
<span class="bx bx-info-circle disabled-tooltip" title={disabledTooltip} />
<span class="bx bx-info-circle contextual-help" title={disabledTooltip} />
)}
{description && <div className="description">{description}</div>}
</>;