shaba/one
1
0
Fork 0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-23 22:50:09 +03:00
Code Releases Wiki Activity

F #5422: Add tooltip on autocomplete when error (#2031)

Browse Source
This commit is contained in:
Sergio Betanzos 2022-05-11 13:53:52 +02:00 committed by GitHub
parent aa4785d4b9
commit 97f81707a8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/fireedge/src/client/components/FormControl/AutocompleteController.js
View File

@ -20,7 +20,7 @@ import { TextField, Chip, Autocomplete } from '@mui/material'
import { useController } from 'react-hook-form'
import { ErrorHelper } from 'client/components/FormControl'
import { Tr, labelCanBeTranslated } from 'client/components/HOC'
import { Tr, Translate } from 'client/components/HOC'
import { generateKey } from 'client/utils'
const AutocompleteController = memo(
@ -77,17 +77,17 @@ const AutocompleteController = memo(
isOptionEqualToValue={(option) => option.value === renderValue}
renderInput={({ inputProps, ...inputParams }) => (
<TextField
label={labelCanBeTranslated(label) ? Tr(label) : label}
label={<Translate word={label} />}
inputProps={{ ...inputProps, 'data-cy': cy }}
InputProps={{ readOnly }}
error={Boolean(error)}
helperText={
Boolean(error) && (
<ErrorHelper
label={
Array.isArray(error) ? error[0]?.message : error?.message
}
/>
<ErrorHelper label={error?.message ?? error[0]?.message}>
{tooltip &&
inputProps?.value?.length > 0 &&
`. ${Tr(tooltip)}`}
</ErrorHelper>
)
}
FormHelperTextProps={{ 'data-cy': `${cy}-error` }}
@ -96,7 +96,7 @@ const AutocompleteController = memo(
)}
{...(tooltip && {
loading: true,
loadingText: labelCanBeTranslated(tooltip) ? Tr(tooltip) : tooltip,
loadingText: <Translate word={tooltip} />,
})}
{...(Array.isArray(separators) && {
autoSelect: true,

4
src/fireedge/src/client/components/FormControl/ErrorHelper.js
View File

@ -27,7 +27,7 @@ const ErrorTypo = styled(Typography)(({ theme }) => ({
overflowWrap: 'anywhere',
}))
const ErrorHelper = memo(({ label, ...rest }) => {
const ErrorHelper = memo(({ label, children, ...rest }) => {
const ensuredLabel = Array.isArray(label) ? label[0] : label
const translateProps = ensuredLabel?.word
@ -45,12 +45,14 @@ const ErrorHelper = memo(({ label, ...rest }) => {
<WarningIcon />
<ErrorTypo component="span" data-cy="error-text">
<Translate {...translateProps} />
{children}
</ErrorTypo>
</Stack>
)
})
ErrorHelper.propTypes = {
children: PropTypes.any,
label: PropTypes.oneOfType([
PropTypes.string,
PropTypes.node,

6
src/fireedge/src/client/constants/translates.js
View File

@ -971,7 +971,7 @@ module.exports = {
/* Validation - object */
'validation.object.noUnknown': 'Has unspecified keys: %s',
/* Validation - array */
'validation.array.min': 'Must have at least %s items',
'validation.array.max': 'Must have less than or equal to %s items',
'validation.array.length': 'Must have %s items',
'validation.array.min': 'Must have at least %s item(s) to act as a default',
'validation.array.max': 'Must have less than or equal to %s item(s)',
'validation.array.length': 'Must have %s item(s)',
}