feat(ui): react upon enter key to create role
parent
368ed615f5
commit
60cdebff5b
|
@ -25,6 +25,15 @@ const CreateRoleDialog = ({visible, setVisible, create}: Props) => {
|
||||||
setName('')
|
setName('')
|
||||||
setVisible(false)
|
setVisible(false)
|
||||||
}, [])
|
}, [])
|
||||||
|
const onEnterPressed = useCallback(
|
||||||
|
(e: React.KeyboardEvent<HTMLInputElement>) => {
|
||||||
|
if (e.key === 'Enter' && name) {
|
||||||
|
e.stopPropagation()
|
||||||
|
create({name})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[name, create]
|
||||||
|
)
|
||||||
return (
|
return (
|
||||||
<OverlayTechnology visible={visible}>
|
<OverlayTechnology visible={visible}>
|
||||||
<OverlayContainer maxWidth={650}>
|
<OverlayContainer maxWidth={650}>
|
||||||
|
@ -38,6 +47,7 @@ const CreateRoleDialog = ({visible, setVisible, create}: Props) => {
|
||||||
autoFocus={true}
|
autoFocus={true}
|
||||||
autoComplete="off"
|
autoComplete="off"
|
||||||
onChange={e => setName(e.target.value)}
|
onChange={e => setName(e.target.value)}
|
||||||
|
onKeyPress={onEnterPressed}
|
||||||
status={
|
status={
|
||||||
validateRoleName(name)
|
validateRoleName(name)
|
||||||
? ComponentStatus.Valid
|
? ComponentStatus.Valid
|
||||||
|
|
Loading…
Reference in New Issue