Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00
Code Issues Projects Releases Wiki Activity

fix: integration multiselector (#4683)

Browse Source 
Input should use state set outside and derive "all selected" from it.
This was not the case causing issues when loading a form with "wildcard"
pre-selected.
This commit is contained in:
Tymoteusz Czech 2023-09-14 14:01:40 +02:00 committed by GitHub
parent e8d5f0cf56
commit 257013c56a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
frontend/src/component/integrations/IntegrationForm/IntegrationMultiSelector/IntegrationMultiSelector.test.tsx
View File

@ -51,25 +51,21 @@ describe('AddonMultiSelector', () => {
it('can toggle "ALL" checkbox', async () => {
const user = userEvent.setup();
render(
const { rerender } = render(
<IntegrationMultiSelector {...mockProps} selectedItems={['*']} />
);
await user.click(screen.getByTestId('select-all-projects'));
expect(
screen.getByLabelText(/all current and future projects/i)
).not.toBeChecked();
expect(onChange).toHaveBeenCalledWith([]);
expect(screen.getByLabelText('Projects')).toBeEnabled();
rerender(
<IntegrationMultiSelector {...mockProps} selectedItems={[]} />
);
await user.click(screen.getByTestId('select-all-projects'));
expect(
screen.getByLabelText(/all current and future projects/i)
).toBeChecked();
expect(screen.getByLabelText('Projects')).toBeDisabled();
expect(onChange).toHaveBeenCalledWith(['*']);
});
it('renders with autocomplete enabled if default value is not a wildcard', () => {
@ -151,4 +147,22 @@ describe('AddonMultiSelector', () => {
expect(screen.queryByText('Alpha')).not.toBeInTheDocument();
});
});
it('will load wildcard status from props', async () => {
const { rerender } = render(
<IntegrationMultiSelector {...mockProps} selectedItems={[]} />
);
expect(
screen.getByLabelText(/all current and future projects/i)
).not.toBeChecked();
rerender(
<IntegrationMultiSelector {...mockProps} selectedItems={['*']} />
);
expect(
screen.getByLabelText(/all current and future projects/i)
).toBeChecked();
});
});

9
frontend/src/component/integrations/IntegrationForm/IntegrationMultiSelector/IntegrationMultiSelector.tsx
View File

@ -1,4 +1,4 @@
import React, { ChangeEvent, Fragment, useState, VFC } from 'react';
import React, { ChangeEvent, Fragment, VFC } from 'react';
import { IAutocompleteBoxOption } from '../../../common/AutocompleteBox/AutocompleteBox';
import {
AutocompleteRenderGroupParams,
@ -55,9 +55,6 @@ export const IntegrationMultiSelector: VFC<IIntegrationMultiSelectorProps> = ({
description,
required,
}) => {
const [isWildcardSelected, selectWildcard] = useState(
selectedItems.includes(ALL_OPTIONS)
);
const renderInput = (params: AutocompleteRenderInputParams) => (
<TextField
{...params}
@ -76,15 +73,15 @@ export const IntegrationMultiSelector: VFC<IIntegrationMultiSelectorProps> = ({
selectedItems.length === options.length &&
selectedItems[0] !== ALL_OPTIONS;
const isWildcardSelected = selectedItems.includes(ALL_OPTIONS);
const onAllItemsChange = (
e: ChangeEvent<HTMLInputElement>,
checked: boolean
) => {
if (checked) {
selectWildcard(true);
onChange([ALL_OPTIONS]);
} else {
selectWildcard(false);
onChange(selectedItems.includes(ALL_OPTIONS) ? [] : selectedItems);
}
};