mirror of
https://github.com/zadam/trilium.git
synced 2025-12-15 12:49:53 +01:00
feat(breadcrumb): replace title editing with jump to top
This commit is contained in:
@@ -265,7 +265,7 @@ export type CommandMappings = {
|
|||||||
|
|
||||||
reEvaluateRightPaneVisibility: CommandData;
|
reEvaluateRightPaneVisibility: CommandData;
|
||||||
runActiveNote: CommandData;
|
runActiveNote: CommandData;
|
||||||
scrollContainerToCommand: CommandData & {
|
scrollContainerTo: CommandData & {
|
||||||
position: number;
|
position: number;
|
||||||
};
|
};
|
||||||
scrollToEnd: CommandData;
|
scrollToEnd: CommandData;
|
||||||
|
|||||||
@@ -49,7 +49,7 @@ export default class ScrollingContainer extends Container<BasicWidget> {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
scrollContainerToCommand({ position }: CommandListenerData<"scrollContainerToCommand">) {
|
scrollContainerToCommand({ position }: CommandListenerData<"scrollContainerTo">) {
|
||||||
this.$widget.scrollTop(position);
|
this.$widget.scrollTop(position);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -53,7 +53,6 @@
|
|||||||
.breadcrumb-last-item {
|
.breadcrumb-last-item {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: unset;
|
color: unset;
|
||||||
cursor: text;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
input {
|
input {
|
||||||
|
|||||||
@@ -3,18 +3,17 @@ import "./Breadcrumb.css";
|
|||||||
import { useMemo, useState } from "preact/hooks";
|
import { useMemo, useState } from "preact/hooks";
|
||||||
import { Fragment } from "preact/jsx-runtime";
|
import { Fragment } from "preact/jsx-runtime";
|
||||||
|
|
||||||
|
import appContext from "../../components/app_context";
|
||||||
import NoteContext from "../../components/note_context";
|
import NoteContext from "../../components/note_context";
|
||||||
|
import FNote from "../../entities/fnote";
|
||||||
|
import link_context_menu from "../../menus/link_context_menu";
|
||||||
import froca from "../../services/froca";
|
import froca from "../../services/froca";
|
||||||
import ActionButton from "../react/ActionButton";
|
import ActionButton from "../react/ActionButton";
|
||||||
import Dropdown from "../react/Dropdown";
|
import Dropdown from "../react/Dropdown";
|
||||||
import { FormListItem } from "../react/FormList";
|
import { FormListItem } from "../react/FormList";
|
||||||
import { useChildNotes, useNoteContext, useNoteLabel, useNoteProperty } from "../react/hooks";
|
import { useChildNotes, useNoteLabel, useNoteProperty } from "../react/hooks";
|
||||||
import Icon from "../react/Icon";
|
import Icon from "../react/Icon";
|
||||||
import NoteLink from "../react/NoteLink";
|
import NoteLink from "../react/NoteLink";
|
||||||
import link_context_menu from "../../menus/link_context_menu";
|
|
||||||
import { TitleEditor } from "../collections/board";
|
|
||||||
import server from "../../services/server";
|
|
||||||
import FNote from "../../entities/fnote";
|
|
||||||
|
|
||||||
const COLLAPSE_THRESHOLD = 5;
|
const COLLAPSE_THRESHOLD = 5;
|
||||||
const INITIAL_ITEMS = 2;
|
const INITIAL_ITEMS = 2;
|
||||||
@@ -87,30 +86,20 @@ function BreadcrumbLink({ notePath }: { notePath: string }) {
|
|||||||
function BreadcrumbLastItem({ notePath }: { notePath: string }) {
|
function BreadcrumbLastItem({ notePath }: { notePath: string }) {
|
||||||
const noteId = notePath.split("/").at(-1);
|
const noteId = notePath.split("/").at(-1);
|
||||||
const [ note ] = useState(() => froca.getNoteFromCache(noteId!));
|
const [ note ] = useState(() => froca.getNoteFromCache(noteId!));
|
||||||
const [ isEditing, setIsEditing ] = useState(false);
|
|
||||||
const title = useNoteProperty(note, "title");
|
const title = useNoteProperty(note, "title");
|
||||||
|
|
||||||
if (!note) return null;
|
if (!note) return null;
|
||||||
|
|
||||||
if (!isEditing) {
|
|
||||||
return (
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
className="breadcrumb-last-item tn-link"
|
|
||||||
onClick={(e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
setIsEditing(true);
|
|
||||||
}}
|
|
||||||
>{title}</a>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TitleEditor
|
<a
|
||||||
currentValue={title}
|
href="#"
|
||||||
save={(newTitle) => { return server.put(`notes/${noteId}/title`, { title: newTitle.trim() }); }}
|
className="breadcrumb-last-item tn-link"
|
||||||
dismiss={() => setIsEditing(false)}
|
onClick={() => {
|
||||||
/>
|
const activeNtxId = appContext.tabManager.activeNtxId;
|
||||||
|
const scrollingContainer = document.querySelector(`[data-ntx-id="${activeNtxId}"] .scrolling-container`);
|
||||||
|
scrollingContainer?.scrollTo({ top: 0, behavior: "smooth" });
|
||||||
|
}}
|
||||||
|
>{title}</a>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user