1
0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00

Desktop: Focus notebook title when opening Notebook dialog

This commit is contained in:
Laurent Cozic 2022-01-09 15:30:21 +00:00
parent b92c650f5d
commit 3117133be2

View File

@ -1,5 +1,5 @@
import * as React from 'react';
import { useCallback, useState } from 'react';
import { useCallback, useState, useRef, useEffect } from 'react';
import { _ } from '@joplin/lib/locale';
import DialogButtonRow, { ClickEvent } from '../DialogButtonRow';
import Dialog from '../Dialog';
@ -22,6 +22,7 @@ interface Props {
export default function(props: Props) {
const [folderTitle, setFolderTitle] = useState('');
const [folderIcon, setFolderIcon] = useState<FolderIcon>();
const titleInputRef = useRef(null);
const isNew = !props.folderId;
@ -41,6 +42,14 @@ export default function(props: Props) {
});
}, [props.dispatch]);
useEffect(() => {
titleInputRef.current.focus();
setTimeout(() => {
titleInputRef.current.select();
}, 100);
}, []);
const onButtonRowClick = useCallback(async (event: ClickEvent) => {
if (event.buttonName === 'cancel') {
onClose();
@ -90,7 +99,7 @@ export default function(props: Props) {
<div className="form">
<div className="form-input-group">
<label>{_('Title')}</label>
<StyledInput type="text" value={folderTitle} onChange={onFolderTitleChange}/>
<StyledInput type="text" ref={titleInputRef} value={folderTitle} onChange={onFolderTitleChange}/>
</div>
<div className="form-input-group">