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

chore(react): bring back focus to add_link

Browse Source
This commit is contained in:
Elian Doran 2025-08-04 16:05:04 +03:00
parent c89737ae7b
commit a9c25b4edd
No known key found for this signature in database
2 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
apps/client/src/widgets/dialogs/add_link.tsx
View File

@ -6,10 +6,10 @@ import ReactBasicWidget from "../react/ReactBasicWidget";
import Button from "../react/Button"; import Button from "../react/Button";
import FormRadioGroup from "../react/FormRadioGroup"; import FormRadioGroup from "../react/FormRadioGroup";
import NoteAutocomplete from "../react/NoteAutocomplete"; import NoteAutocomplete from "../react/NoteAutocomplete";
import { useState } from "preact/hooks"; import { useRef, useState } from "preact/hooks";
import tree from "../../services/tree"; import tree from "../../services/tree";
import { useEffect } from "react"; import { useEffect } from "react";
import { Suggestion } from "../../services/note_autocomplete"; import note_autocomplete, { Suggestion } from "../../services/note_autocomplete";
import type { default as TextTypeWidget } from "../type_widgets/editable_text.js"; import type { default as TextTypeWidget } from "../type_widgets/editable_text.js";
import { logError } from "../../services/ws"; import { logError } from "../../services/ws";
@ -58,6 +58,20 @@ function AddLinkDialogComponent({ text: _text, textTypeWidget }: AddLinkDialogPr
} }
}, [suggestion]); }, [suggestion]);
function onShown() {
const $autocompleteEl = $(autocompleteRef.current);
if (!text) {
note_autocomplete.showRecentNotes($autocompleteEl);
} else {
note_autocomplete.setText($autocompleteEl, text);
}
// to be able to quickly remove entered text
$autocompleteEl
.trigger("focus")
.trigger("select");
}
function onSubmit() { function onSubmit() {
if (suggestion.notePath) { if (suggestion.notePath) {
// Handle note link // Handle note link
@ -72,6 +86,8 @@ function AddLinkDialogComponent({ text: _text, textTypeWidget }: AddLinkDialogPr
} }
} }
const autocompleteRef = useRef<HTMLInputElement>(null);
return ( return (
<Modal <Modal
className="add-link-dialog" className="add-link-dialog"
@ -81,12 +97,14 @@ function AddLinkDialogComponent({ text: _text, textTypeWidget }: AddLinkDialogPr
helpPageId="QEAPj01N5f7w" helpPageId="QEAPj01N5f7w"
footer={<Button text={t("add_link.button_add_link")} keyboardShortcut="Enter" />} footer={<Button text={t("add_link.button_add_link")} keyboardShortcut="Enter" />}
onSubmit={onSubmit} onSubmit={onSubmit}
onHidden={() => setSuggestion(null)} onShown={onShown}
onHidden={() => setSuggestion(null)}
> >
<div className="form-group"> <div className="form-group">
<label htmlFor="add-link-note-autocomplete">{t("add_link.note")}</label> <label htmlFor="add-link-note-autocomplete">{t("add_link.note")}</label>
<NoteAutocomplete <NoteAutocomplete
inputRef={autocompleteRef}
text={text} text={text}
allowExternalLinks allowExternalLinks
allowCreatingNotes allowCreatingNotes

8
apps/client/src/widgets/react/NoteAutocomplete.tsx
View File

@ -1,17 +1,19 @@
import { useRef } from "preact/hooks"; import { useRef } from "preact/hooks";
import { t } from "../../services/i18n"; import { t } from "../../services/i18n";
import { use, useEffect } from "react"; import { useEffect } from "react";
import note_autocomplete, { type Suggestion } from "../../services/note_autocomplete"; import note_autocomplete, { type Suggestion } from "../../services/note_autocomplete";
import type { RefObject } from "preact";
interface NoteAutocompleteProps { interface NoteAutocompleteProps {
inputRef?: RefObject<HTMLInputElement>;
text?: string; text?: string;
allowExternalLinks?: boolean; allowExternalLinks?: boolean;
allowCreatingNotes?: boolean; allowCreatingNotes?: boolean;
onChange?: (suggestion: Suggestion) => void; onChange?: (suggestion: Suggestion) => void;
} }
export default function NoteAutocomplete({ text, allowCreatingNotes, allowExternalLinks, onChange }: NoteAutocompleteProps) { export default function NoteAutocomplete({ inputRef: _ref, text, allowCreatingNotes, allowExternalLinks, onChange }: NoteAutocompleteProps) {
const ref = useRef<HTMLInputElement>(null); const ref = _ref ?? useRef<HTMLInputElement>(null);
useEffect(() => { useEffect(() => {
if (!ref.current) return; if (!ref.current) return;