diff --git a/packages/app-desktop/gui/EditFolderDialog/Dialog.tsx b/packages/app-desktop/gui/EditFolderDialog/Dialog.tsx index e9711be695..cb73c19217 100644 --- a/packages/app-desktop/gui/EditFolderDialog/Dialog.tsx +++ b/packages/app-desktop/gui/EditFolderDialog/Dialog.tsx @@ -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(); + 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) {
- +