feat(breadcrumb): replace title editing with jump to top

This commit is contained in:
Elian Doran
2025-12-13 01:45:02 +02:00
parent 447e09fec1
commit 98a3c8150c
4 changed files with 15 additions and 27 deletions

View File

@@ -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;

View File

@@ -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);
} }
} }

View File

@@ -53,7 +53,6 @@
.breadcrumb-last-item { .breadcrumb-last-item {
text-decoration: none; text-decoration: none;
color: unset; color: unset;
cursor: text;
} }
input { input {

View File

@@ -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>
); );
} }