gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-20 23:29:02 +02:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

fix(react/dialogs): revision list not full height

Browse Source
This commit is contained in:
Elian Doran 2025-08-10 20:24:20 +03:00
parent 2d3b99c959
commit abf1f6c041
No known key found for this signature in database
2 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/src/widgets/dialogs/revisions.tsx
View File

@ -107,7 +107,7 @@ function RevisionsDialogComponent() {
function RevisionsList({ revisions, onSelect, currentRevision }: { revisions: RevisionItem[], onSelect: (val: string) => void, currentRevision?: RevisionItem }) {
return (
<FormList style={{ height: "100%", flexShrink: 0 }} onSelect={onSelect}>
<FormList onSelect={onSelect} fullHeight>
{revisions.map((item) =>
<FormListItem
title={t("revisions.revision_last_edited", { date: item.dateLastEdited })}

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

@ -1,15 +1,16 @@
import { Dropdown as BootstrapDropdown } from "bootstrap";
import { ComponentChildren } from "preact";
import Icon from "./Icon";
import { useEffect, useRef, type CSSProperties } from "preact/compat";
import { useEffect, useMemo, useRef, type CSSProperties } from "preact/compat";
interface FormListOpts {
children: ComponentChildren;
onSelect?: (value: string) => void;
style?: CSSProperties;
fullHeight?: boolean;
}
export default function FormList({ children, onSelect, style }: FormListOpts) {
export default function FormList({ children, onSelect, style, fullHeight }: FormListOpts) {
const wrapperRef = useRef<HTMLDivElement | null>(null);
const triggerRef = useRef<HTMLButtonElement | null>(null);
@ -28,9 +29,17 @@ export default function FormList({ children, onSelect, style }: FormListOpts) {
}
}, [ triggerRef, wrapperRef ]);
const builtinStyles = useMemo(() => {
const style: CSSProperties = {};
if (fullHeight) {
style.height = "100%";
}
return style;
}, [ fullHeight ]);
return (
<div className="dropdownWrapper" ref={wrapperRef}>
<div className="dropdown">
<div className="dropdownWrapper" ref={wrapperRef} style={builtinStyles}>
<div className="dropdown" style={builtinStyles}>
<button
ref={triggerRef}
type="button" style="display: none;"
@ -39,6 +48,7 @@ export default function FormList({ children, onSelect, style }: FormListOpts) {
<div class="dropdown-menu static show" style={{
...style ?? {},
...builtinStyles,
position: "relative",
}} onClick={(e) => {
const value = (e.target as HTMLElement)?.dataset?.value;