Docker/planka
Docker/planka
1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-18 12:49:43 +02:00
Code Issues Releases Activity

fix: Focus end of field when editing (#779)

Browse source
This commit is contained in:
HannesOberreiter 2024-06-06 20:06:16 +02:00 • committed by GitHub
parent fde3bfade4
commit c0b694039e
5 changed files with 13 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

3
client/src/components/Card/NameEdit.jsx
View file

@ -5,6 +5,7 @@ import TextareaAutosize from 'react-textarea-autosize';
import { Button, Form, TextArea } from 'semantic-ui-react'; import { Button, Form, TextArea } from 'semantic-ui-react';
import { useClosableForm, useField } from '../../hooks'; import { useClosableForm, useField } from '../../hooks';
import { focusEnd } from '../../utils/element-helpers';
import styles from './NameEdit.module.scss'; import styles from './NameEdit.module.scss';
@ -79,7 +80,7 @@ const NameEdit = React.forwardRef(({ children, defaultValue, onUpdate }, ref) =>
useEffect(() => { useEffect(() => {
if (isOpened) { if (isOpened) {
field.current.ref.current.focus(); focusEnd(field.current.ref.current);
} }
}, [isOpened]); }, [isOpened]);

3
client/src/components/CardModal/Activities/CommentEdit.jsx
View file

@ -6,6 +6,7 @@ import TextareaAutosize from 'react-textarea-autosize';
import { Button, Form, TextArea } from 'semantic-ui-react'; import { Button, Form, TextArea } from 'semantic-ui-react';
import { useForm } from '../../../hooks'; import { useForm } from '../../../hooks';
import { focusEnd } from '../../../utils/element-helpers';
import styles from './CommentEdit.module.scss'; import styles from './CommentEdit.module.scss';
@ -70,7 +71,7 @@ const CommentEdit = React.forwardRef(({ children, defaultData, onUpdate }, ref)
useEffect(() => { useEffect(() => {
if (isOpened) { if (isOpened) {
textField.current.ref.current.focus(); focusEnd(textField.current.ref.current);
} }
}, [isOpened]); }, [isOpened]);

3
client/src/components/CardModal/Tasks/NameEdit.jsx
View file

@ -5,6 +5,7 @@ import TextareaAutosize from 'react-textarea-autosize';
import { Button, Form, TextArea } from 'semantic-ui-react'; import { Button, Form, TextArea } from 'semantic-ui-react';
import { useField } from '../../../hooks'; import { useField } from '../../../hooks';
import { focusEnd } from '../../../utils/element-helpers';
import styles from './NameEdit.module.scss'; import styles from './NameEdit.module.scss';
@ -65,7 +66,7 @@ const NameEdit = React.forwardRef(({ children, defaultValue, onUpdate }, ref) =>
useEffect(() => { useEffect(() => {
if (isOpened) { if (isOpened) {
field.current.ref.current.focus(); focusEnd(field.current.ref.current);
} }
}, [isOpened]); }, [isOpened]);

3
client/src/components/List/NameEdit.jsx
View file

@ -4,6 +4,7 @@ import TextareaAutosize from 'react-textarea-autosize';
import { TextArea } from 'semantic-ui-react'; import { TextArea } from 'semantic-ui-react';
import { useField } from '../../hooks'; import { useField } from '../../hooks';
import { focusEnd } from '../../utils/element-helpers';
import styles from './NameEdit.module.scss'; import styles from './NameEdit.module.scss';
@ -71,7 +72,7 @@ const NameEdit = React.forwardRef(({ children, defaultValue, onUpdate }, ref) =>
useEffect(() => { useEffect(() => {
if (isOpened) { if (isOpened) {
field.current.ref.current.select(); focusEnd(field.current.ref.current);
} }
}, [isOpened]); }, [isOpened]);

5
client/src/utils/element-helpers.js Normal file
View file

@ -0,0 +1,5 @@
// eslint-disable-next-line import/prefer-default-export
export const focusEnd = (element) => {
element.focus();
element.setSelectionRange(element.value.length + 1, element.value.length + 1);
};