mirror of
https://github.com/zadam/trilium.git
synced 2025-10-28 01:59:04 +01:00
refactor(react/collections/table): deduplicate editing
This commit is contained in:
parent
cb84e4c7b6
commit
62452b61b1
@ -2,10 +2,9 @@ import { useCallback, useContext, useEffect, useRef } from "preact/hooks";
|
||||
import FBranch from "../../../entities/fbranch";
|
||||
import FNote from "../../../entities/fnote";
|
||||
import BoardApi from "./api";
|
||||
import { BoardViewContext } from ".";
|
||||
import { BoardViewContext, TitleEditor } from ".";
|
||||
import { ContextMenuEvent } from "../../../menus/context_menu";
|
||||
import { openNoteContextMenu } from "./context_menu";
|
||||
import FormTextBox from "../../react/FormTextBox";
|
||||
|
||||
export default function Card({
|
||||
api,
|
||||
@ -59,28 +58,10 @@ export default function Card({
|
||||
{!isEditing ? (
|
||||
<>{note.title}</>
|
||||
) : (
|
||||
<FormTextBox
|
||||
inputRef={editorRef}
|
||||
<TitleEditor
|
||||
currentValue={note.title}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") {
|
||||
const newTitle = e.currentTarget.value;
|
||||
if (newTitle !== note.title) {
|
||||
api.renameCard(note.noteId, newTitle);
|
||||
}
|
||||
api.dismissEditingTitle();
|
||||
}
|
||||
|
||||
if (e.key === "Escape") {
|
||||
api.dismissEditingTitle();
|
||||
}
|
||||
}}
|
||||
onBlur={(newTitle) => {
|
||||
if (newTitle !== note.title) {
|
||||
api.renameCard(note.noteId, newTitle);
|
||||
}
|
||||
api.dismissEditingTitle();
|
||||
}}
|
||||
save={newTitle => api.renameCard(note.noteId, newTitle)}
|
||||
dismiss={() => api.dismissEditingTitle()}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@ -1,11 +1,10 @@
|
||||
import { useCallback, useContext, useEffect, useRef } from "preact/hooks";
|
||||
import FBranch from "../../../entities/fbranch";
|
||||
import FNote from "../../../entities/fnote";
|
||||
import { BoardViewContext } from ".";
|
||||
import { BoardViewContext, TitleEditor } from ".";
|
||||
import branches from "../../../services/branches";
|
||||
import { openColumnContextMenu } from "./context_menu";
|
||||
import { ContextMenuEvent } from "../../../menus/context_menu";
|
||||
import FormTextBox from "../../react/FormTextBox";
|
||||
import Icon from "../../react/Icon";
|
||||
import { t } from "../../../services/i18n";
|
||||
import BoardApi from "./api";
|
||||
@ -171,31 +170,11 @@ export default function Column({
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<FormTextBox
|
||||
inputRef={editorRef}
|
||||
currentValue={column}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") {
|
||||
const newTitle = e.currentTarget.value;
|
||||
if (newTitle !== column) {
|
||||
api.renameColumn(column, newTitle);
|
||||
}
|
||||
context.setColumnNameToEdit?.(undefined);
|
||||
}
|
||||
|
||||
if (e.key === "Escape") {
|
||||
context.setColumnNameToEdit?.(undefined);
|
||||
}
|
||||
}}
|
||||
onBlur={(newTitle) => {
|
||||
if (newTitle !== column) {
|
||||
api.renameColumn(column, newTitle);
|
||||
}
|
||||
context.setColumnNameToEdit?.(undefined);
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
<TitleEditor
|
||||
currentValue={column}
|
||||
save={newTitle => api.renameColumn(column, newTitle)}
|
||||
dismiss={() => context.setColumnNameToEdit?.(undefined)}
|
||||
/>
|
||||
)}
|
||||
</h3>
|
||||
|
||||
|
||||
@ -242,3 +242,42 @@ function AddNewColumn({ viewConfig, saveConfig }: { viewConfig?: BoardViewData,
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function TitleEditor({ currentValue, save, dismiss }: {
|
||||
currentValue: string,
|
||||
save: (newValue: string) => void,
|
||||
dismiss: () => void
|
||||
}) {
|
||||
const inputRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
inputRef.current?.focus();
|
||||
inputRef.current?.select();
|
||||
}, [ inputRef ]);
|
||||
|
||||
return (
|
||||
<FormTextBox
|
||||
inputRef={inputRef}
|
||||
currentValue={currentValue}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") {
|
||||
const newValue = e.currentTarget.value;
|
||||
if (newValue !== currentValue) {
|
||||
save(newValue);
|
||||
}
|
||||
dismiss();
|
||||
}
|
||||
|
||||
if (e.key === "Escape") {
|
||||
dismiss();
|
||||
}
|
||||
}}
|
||||
onBlur={(newValue) => {
|
||||
if (newValue !== currentValue) {
|
||||
save(newValue);
|
||||
}
|
||||
dismiss();
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user