1
0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-21 14:50:08 +03:00

F #5998: Bigger label filter on FSunstone (#2441)

(cherry picked from commit 39f6d2765c3ce2975cec0660e8acad6bc6874733)
This commit is contained in:
Frederick Borges 2023-01-10 13:05:16 +01:00 committed by Tino Vázquez
parent 6e294b3fa8
commit 6b28ac79d6
No known key found for this signature in database
GPG Key ID: 14201E424D02047E
2 changed files with 41 additions and 30 deletions

View File

@ -13,24 +13,24 @@
* See the License for the specific language governing permissions and *
* limitations under the License. *
* ------------------------------------------------------------------------- */
import { memo, ReactElement, MouseEvent } from 'react'
import PropTypes from 'prop-types'
import { MouseEvent, ReactElement, memo } from 'react'
import { Autocomplete, Box, Tooltip, Typography } from '@mui/material'
import CheckIcon from 'iconoir-react/dist/Check'
import LockIcon from 'iconoir-react/dist/Lock'
import { Box, Typography, Autocomplete } from '@mui/material'
import { useAddLabelMutation } from 'client/features/OneApi/auth'
import { SubmitButton } from 'client/components/FormControl'
import { Tr, Translate } from 'client/components/HOC'
import { StatusCircle } from 'client/components/Status'
import {
PopperComponent,
StyledInput,
} from 'client/components/Tables/Enhanced/Utils/GlobalLabel/styles'
import { SubmitButton } from 'client/components/FormControl'
import { StatusCircle } from 'client/components/Status'
import { getColorFromString } from 'client/models/Helper'
import { Translate, Tr } from 'client/components/HOC'
import { T } from 'client/constants'
import { getColorFromString } from 'client/models/Helper'
const Label = memo(({ label, selected, unknown, ...props }) => {
const [addLabel, { isLoading }] = useAddLabelMutation()
@ -46,24 +46,32 @@ const Label = memo(({ label, selected, unknown, ...props }) => {
}
return (
<Box component="li" gap="0.5em" {...props}>
<CheckIcon
style={{
minWidth: 'fit-content',
visibility: selected ? 'visible' : 'hidden',
}}
/>
<StatusCircle color={getColorFromString(label)} size={18} />
<Typography noWrap variant="body2" sx={{ flexGrow: 1 }}>
{label}
</Typography>
<SubmitButton
onClick={unknown ? handleLockLabel : undefined}
isSubmitting={isLoading}
title={Tr(T.SavesInTheUserTemplate)}
icon={<LockIcon />}
sx={{ p: 0, visibility: unknown ? 'visible' : 'hidden' }}
/>
<Box component="li">
<Tooltip
arrow
placement="right"
title={<Typography variant="subtitle2">{label}</Typography>}
>
<Box gap="0.5em" {...props}>
<CheckIcon
style={{
minWidth: 'fit-content',
visibility: selected ? 'visible' : 'hidden',
}}
/>
<StatusCircle color={getColorFromString(label)} size={18} />
<Typography noWrap variant="body2" sx={{ flexGrow: 1 }}>
{label}
</Typography>
<SubmitButton
onClick={unknown ? handleLockLabel : undefined}
isSubmitting={isLoading}
title={Tr(T.SavesInTheUserTemplate)}
icon={<LockIcon />}
sx={{ p: 0, visibility: unknown ? 'visible' : 'hidden' }}
/>
</Box>
</Tooltip>
</Box>
)
})

View File

@ -13,21 +13,21 @@
* See the License for the specific language governing permissions and *
* limitations under the License. *
* ------------------------------------------------------------------------- */
import { ReactElement, useState, useMemo, useCallback } from 'react'
import PropTypes from 'prop-types'
import { ReactElement, useCallback, useMemo, useState } from 'react'
import SettingsIcon from 'iconoir-react/dist/LabelOutline'
import { Stack } from '@mui/material'
import SettingsIcon from 'iconoir-react/dist/LabelOutline'
import { UseFiltersInstanceProps } from 'react-table'
import { useAuth } from 'client/features/Auth'
import { Translate } from 'client/components/HOC'
import HeaderPopover from 'client/components/Header/Popover'
import Allocator from 'client/components/Tables/Enhanced/Utils/GlobalLabel/Allocator'
import FilterByLabel from 'client/components/Tables/Enhanced/Utils/GlobalLabel/Filter'
import HeaderPopover from 'client/components/Header/Popover'
import { areStringEqual, jsonToXml } from 'client/models/Helper'
import { Translate } from 'client/components/HOC'
import { T } from 'client/constants'
import { areStringEqual, jsonToXml } from 'client/models/Helper'
export const LABEL_COLUMN_ID = 'label'
@ -169,7 +169,10 @@ const GlobalLabel = ({
disabled: isLoading,
onClick: handleOpenPopover,
}}
popperProps={{ placement: 'bottom-end' }}
popperProps={{
placement: 'bottom-end',
sx: { width: { xs: '100%', md: 500 } },
}}
onClickAway={handleClickAwayPopover}
>
{({ handleClose }) =>