[BREAK] Hide system messages (#16243)
parent
060bf9fb3e
commit
abccdb09f1
@ -0,0 +1,58 @@ |
||||
import { Field, Flex, Box, MultiSelectFiltered, MultiSelect } from '@rocket.chat/fuselage'; |
||||
import React from 'react'; |
||||
|
||||
import { useTranslation } from '../../../../contexts/TranslationContext'; |
||||
import { ResetSettingButton } from '../ResetSettingButton'; |
||||
|
||||
export function MultiSelectSettingInput({ |
||||
_id, |
||||
label, |
||||
value = [], |
||||
placeholder, |
||||
readonly, |
||||
disabled, |
||||
values = [], |
||||
hasResetButton, |
||||
onChangeValue, |
||||
onResetButtonClick, |
||||
autocomplete, |
||||
}) { |
||||
const t = useTranslation(); |
||||
|
||||
const handleChange = (value) => { |
||||
onChangeValue && onChangeValue(value); |
||||
// onChangeValue && onChangeValue([...event.currentTarget.querySelectorAll('option')].filter((e) => e.selected).map((el) => el.value));
|
||||
}; |
||||
const Component = autocomplete ? MultiSelectFiltered : MultiSelect; |
||||
return ( |
||||
<> |
||||
<Flex.Container> |
||||
<Box> |
||||
<Field.Label htmlFor={_id} title={_id}> |
||||
{label} |
||||
</Field.Label> |
||||
{hasResetButton && ( |
||||
<ResetSettingButton |
||||
data-qa-reset-setting-id={_id} |
||||
onClick={onResetButtonClick} |
||||
/> |
||||
)} |
||||
</Box> |
||||
</Flex.Container> |
||||
<Component |
||||
data-qa-setting-id={_id} |
||||
id={_id} |
||||
value={value} |
||||
placeholder={placeholder} |
||||
disabled={disabled} |
||||
readOnly={readonly} |
||||
// autoComplete={autocomplete === false ? 'off' : undefined}
|
||||
onChange={handleChange} |
||||
options={values.map(({ key, i18nLabel }) => [ |
||||
key, |
||||
t(i18nLabel), |
||||
])} |
||||
/> |
||||
</> |
||||
); |
||||
} |
||||
@ -0,0 +1,57 @@ |
||||
import { Field } from '@rocket.chat/fuselage'; |
||||
import { action } from '@storybook/addon-actions'; |
||||
import React from 'react'; |
||||
|
||||
import { MultiSelectSettingInput } from './MultiSelectSettingInput'; |
||||
|
||||
export default { |
||||
title: 'admin/settings/inputs/MultiSelectSettingInput', |
||||
component: MultiSelectSettingInput, |
||||
decorators: [ |
||||
(storyFn) => <Field>{storyFn()}</Field>, |
||||
], |
||||
}; |
||||
const options = [ |
||||
{ key: '1', i18nLabel: '1' }, |
||||
{ key: '2', i18nLabel: '2' }, |
||||
{ key: '3', i18nLabel: '3' }, |
||||
]; |
||||
|
||||
export const _default = () => |
||||
<MultiSelectSettingInput |
||||
_id='setting_id' |
||||
label='Label' |
||||
placeholder='Placeholder' |
||||
values={options} |
||||
onChangeValue={action('changeValue')} |
||||
onChangeEditor={action('changeEditor')} |
||||
/>; |
||||
|
||||
export const disabled = () => |
||||
<MultiSelectSettingInput |
||||
_id='setting_id' |
||||
label='Label' |
||||
placeholder='Placeholder' |
||||
values={options} |
||||
disabled |
||||
/>; |
||||
|
||||
export const withValue = () => |
||||
<MultiSelectSettingInput |
||||
_id='setting_id' |
||||
label='Label' |
||||
placeholder='Placeholder' |
||||
value='1' |
||||
values={options} |
||||
/>; |
||||
|
||||
export const withResetButton = () => |
||||
<MultiSelectSettingInput |
||||
_id='setting_id' |
||||
label='Label' |
||||
placeholder='Placeholder' |
||||
values={options} |
||||
hasResetButton |
||||
onChangeValue={action('changeValue')} |
||||
onResetButtonClick={action('resetButtonClick')} |
||||
/>; |
||||
@ -0,0 +1,17 @@ |
||||
import { |
||||
Migrations, |
||||
} from '../../../app/migrations'; |
||||
import { |
||||
Settings, |
||||
} from '../../../app/models'; |
||||
|
||||
|
||||
Migrations.add({ |
||||
version: 172, |
||||
up() { |
||||
const settings = Settings.find({ _id: /Message_HideType_.*/i }).fetch(); |
||||
|
||||
Settings.update({ _id: 'Hide_System_Messages' }, { $set: { value: settings.filter((setting) => setting.value).map((setting) => setting._id.replace('Message_HideType_')) } }); |
||||
Settings.remove({ _id: /Message_HideType_.*/i }, { multi: true }); |
||||
}, |
||||
}); |
||||
Loading…
Reference in new issue