import withCurrentUserContext from '../../../app/components/current-user/withCurrentUserContext';
import HelpTooltip from '../../../components/controls/HelpTooltip';
import RadioToggle from '../../../components/controls/RadioToggle';
-import SelectLegacy from '../../../components/controls/SelectLegacy';
+import Select from '../../../components/controls/Select';
import Measure from '../../../components/measure/Measure';
import CoverageRating from '../../../components/ui/CoverageRating';
import DeferredSpinner from '../../../components/ui/DeferredSpinner';
onShowAllHotspots: () => void;
}
-const statusOptions: Array<{ label: string; value: string }> = [
+const statusOptions: Array<{ label: string; value: HotspotStatusFilter }> = [
{ value: HotspotStatusFilter.TO_REVIEW, label: translate('hotspot.filters.status.to_review') },
{
value: HotspotStatusFilter.ACKNOWLEDGED,
/>
)}
- <span className="spacer-right">{translate('status')}</span>
- <SelectLegacy
+ <span className="spacer-right"> {translate('status')} </span>
+ <Select
className="input-medium big-spacer-right"
- clearable={false}
+ aria-label={translate('hotspot.filters.status')}
onChange={(option: { value: HotspotStatusFilter }) =>
props.onChangeFilters({ status: option.value })
}
options={statusOptions}
- searchable={false}
- value={filters.status}
+ isSearchable={false}
+ value={statusOptions.find(status => status.value === filters.status)}
/>
{onBranch && (
- <SelectLegacy
+ <Select
className="input-medium big-spacer-right"
- clearable={false}
+ aria-label={translate('hotspot.filters.period')}
onChange={(option: { value: boolean }) =>
props.onChangeFilters({ sinceLeakPeriod: option.value })
}
options={periodOptions}
- searchable={false}
- value={filters.sinceLeakPeriod}
+ isSearchable={false}
+ value={periodOptions.find(period => period.value === filters.sinceLeakPeriod)}
/>
)}
</div>
import { shallow } from 'enzyme';
import * as React from 'react';
import RadioToggle from '../../../../components/controls/RadioToggle';
-import SelectLegacy from '../../../../components/controls/SelectLegacy';
+import Select from '../../../../components/controls/Select';
import { mockComponent } from '../../../../helpers/mocks/component';
import { mockCurrentUser, mockLoggedInUser } from '../../../../helpers/testMocks';
import { ComponentQualifier } from '../../../../types/component';
const wrapper = shallowRender({ onChangeFilters });
const { onChange } = wrapper
- .find(SelectLegacy)
+ .find(Select)
.at(0)
.props();
- onChange!({ value: HotspotStatusFilter.SAFE });
+ onChange({ value: HotspotStatusFilter.SAFE });
expect(onChangeFilters).toBeCalledWith({ status: HotspotStatusFilter.SAFE });
});
const { onCheck } = wrapper.find(RadioToggle).props();
- onCheck!(AssigneeFilterOption.ALL);
+ onCheck(AssigneeFilterOption.ALL);
expect(onChangeFilters).toBeCalledWith({ assignedToMe: false });
});
const wrapper = shallowRender({ onChangeFilters });
const { onChange } = wrapper
- .find(SelectLegacy)
+ .find(Select)
.at(1)
.props();
- onChange!({ value: true });
+ onChange({ value: true });
expect(onChangeFilters).toBeCalledWith({ sinceLeakPeriod: true });
});
<span
className="spacer-right"
>
+
status
+
</span>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.status"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value="TO_REVIEW"
+ value={
+ Object {
+ "label": "hotspot.filters.status.to_review",
+ "value": "TO_REVIEW",
+ }
+ }
/>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.period"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value={false}
+ value={
+ Object {
+ "label": "hotspot.filters.period.overall",
+ "value": false,
+ }
+ }
/>
</div>
<div
<span
className="spacer-right"
>
+
status
+
</span>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.status"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value="TO_REVIEW"
+ value={
+ Object {
+ "label": "hotspot.filters.status.to_review",
+ "value": "TO_REVIEW",
+ }
+ }
/>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.period"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value={false}
+ value={
+ Object {
+ "label": "hotspot.filters.period.overall",
+ "value": false,
+ }
+ }
/>
</div>
<div
<span
className="spacer-right"
>
+
status
+
</span>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.status"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value="TO_REVIEW"
+ value={
+ Object {
+ "label": "hotspot.filters.status.to_review",
+ "value": "TO_REVIEW",
+ }
+ }
/>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.period"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value={false}
+ value={
+ Object {
+ "label": "hotspot.filters.period.overall",
+ "value": false,
+ }
+ }
/>
</div>
</div>
<span
className="spacer-right"
>
+
status
+
</span>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.status"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value="TO_REVIEW"
+ value={
+ Object {
+ "label": "hotspot.filters.status.to_review",
+ "value": "TO_REVIEW",
+ }
+ }
/>
</div>
<div
<span
className="spacer-right"
>
+
status
+
</span>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.status"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value="TO_REVIEW"
+ value={
+ Object {
+ "label": "hotspot.filters.status.to_review",
+ "value": "TO_REVIEW",
+ }
+ }
/>
- <SelectLegacy
+ <Select
+ aria-label="hotspot.filters.period"
className="input-medium big-spacer-right"
- clearable={false}
+ isSearchable={false}
onChange={[Function]}
options={
Array [
},
]
}
- searchable={false}
- value={false}
+ value={
+ Object {
+ "label": "hotspot.filters.period.overall",
+ "value": false,
+ }
+ }
/>
</div>
<div
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
-import SelectLegacy from '../../../components/controls/SelectLegacy';
+import Select from '../../../components/controls/Select';
import { Location, Router, withRouter } from '../../../components/hoc/withRouter';
import { translate } from '../../../helpers/l10n';
import { getCategoryName } from '../utils';
return (
<>
- <h2 className="settings-sub-category-name">{translate('property.category.languages')}</h2>
+ <h2 id="languages-category-title" className="settings-sub-category-name">
+ {translate('property.category.languages')}
+ </h2>
<div data-test="language-select">
- <SelectLegacy
- className="input-large"
+ <Select
+ aria-labelledby="languages-category-title"
+ className="input-large select-settings-language"
onChange={handleOnChange}
options={availableLanguages}
placeholder={translate('settings.languages.select_a_language_placeholder')}
- value={selectedLanguage}
+ value={availableLanguages.find(language => language.value === selectedLanguage)}
/>
</div>
{selectedLanguage && (
*/
import { shallow } from 'enzyme';
import * as React from 'react';
-import SelectLegacy from '../../../../components/controls/SelectLegacy';
+import Select from '../../../../components/controls/Select';
import { mockComponent } from '../../../../helpers/mocks/component';
import { mockLocation, mockRouter } from '../../../../helpers/testMocks';
import CategoryDefinitionsList from '../CategoryDefinitionsList';
const wrapper = shallowRender({ router });
expect(wrapper.find(CategoryDefinitionsList).props().category).toBe('java');
- const { onChange } = wrapper.find(SelectLegacy).props();
+ const { onChange } = wrapper.find(Select).props();
- onChange!({ label: '', originalValue: 'CoBoL', value: 'cobol' });
+ onChange({ label: '', originalValue: 'CoBoL', value: 'cobol' });
expect(push).toHaveBeenCalledWith(expect.objectContaining({ query: { category: 'CoBoL' } }));
});
<Fragment>
<h2
className="settings-sub-category-name"
+ id="languages-category-title"
>
property.category.languages
</h2>
<div
data-test="language-select"
>
- <SelectLegacy
- className="input-large"
+ <Select
+ aria-labelledby="languages-category-title"
+ className="input-large select-settings-language"
onChange={[Function]}
options={
Array [
]
}
placeholder="settings.languages.select_a_language_placeholder"
- value="java"
+ value={
+ Object {
+ "label": "property.category.Java",
+ "originalValue": "Java",
+ "value": "java",
+ }
+ }
/>
</div>
<div
<Fragment>
<h2
className="settings-sub-category-name"
+ id="languages-category-title"
>
property.category.languages
</h2>
<div
data-test="language-select"
>
- <SelectLegacy
- className="input-large"
+ <Select
+ aria-labelledby="languages-category-title"
+ className="input-large select-settings-language"
onChange={[Function]}
options={
Array [
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
-import SelectLegacy from '../../../../components/controls/SelectLegacy';
+import Select from '../../../../components/controls/Select';
import { ExtendedSettingDefinition } from '../../../../types/settings';
import { DefaultSpecializedInputProps } from '../../utils';
};
render() {
- const options = this.props.options.map(option => ({
+ const { options: opts, name, value } = this.props;
+
+ const options = opts.map(option => ({
label: option,
value: option
}));
return (
- <SelectLegacy
+ <Select
className="settings-large-input"
- clearable={false}
- name={this.props.name}
+ name={name}
onChange={this.handleInputChange}
options={options}
- value={this.props.value}
+ value={options.find(option => option.value === value)}
/>
);
}
*/
import { shallow } from 'enzyme';
import * as React from 'react';
-import SelectLegacy from '../../../../../components/controls/SelectLegacy';
+import Select from '../../../../../components/controls/Select';
import { mockSetting } from '../../../../../helpers/mocks/settings';
import { DefaultSpecializedInputProps } from '../../../utils';
import InputForSingleSelectList from '../InputForSingleSelectList';
it('should render Select', () => {
const onChange = jest.fn();
- const select = shallowRender({ onChange }).find(SelectLegacy);
+ const select = shallowRender({ onChange }).find(Select);
expect(select.length).toBe(1);
expect(select.prop('name')).toBe('foo');
- expect(select.prop('value')).toBe('bar');
+ expect(select.prop('value')).toEqual({ label: 'bar', value: 'bar' });
expect(select.prop('options')).toEqual([
{ value: 'foo', label: 'foo' },
{ value: 'bar', label: 'bar' },
it('should call onChange', () => {
const onChange = jest.fn();
- const select = shallowRender({ onChange }).find(SelectLegacy);
+ const select = shallowRender({ onChange }).find(Select);
expect(select.length).toBe(1);
expect(select.prop('onChange')).toBeDefined();
import * as React from 'react';
import { FormattedMessage } from 'react-intl';
import { Link } from 'react-router';
+import { components, OptionProps, SingleValueProps } from 'react-select';
import { Button, SubmitButton } from '../../../../components/controls/buttons';
-import SelectLegacy from '../../../../components/controls/SelectLegacy';
+import Select from '../../../../components/controls/Select';
import AlertSuccessIcon from '../../../../components/icons/AlertSuccessIcon';
import { Alert } from '../../../../components/ui/Alert';
import DeferredSpinner from '../../../../components/ui/DeferredSpinner';
isSysAdmin: boolean;
}
-function optionRenderer(instance: AlmSettingsInstance) {
+function optionRenderer(props: OptionProps<AlmSettingsInstance, false>) {
+ return <components.Option {...props}>{customOptions(props.data)}</components.Option>;
+}
+
+function singleValueRenderer(props: SingleValueProps<AlmSettingsInstance>) {
+ return <components.SingleValue {...props}>{customOptions(props.data)}</components.SingleValue>;
+}
+
+function customOptions(instance: AlmSettingsInstance) {
return instance.url ? (
<>
<span>{instance.key} — </span>
</div>
</div>
<div className="settings-definition-right">
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={{
- maxWidth: '210%' /* Allow double the width of the select */,
- width: 'auto'
- }}
- onChange={(instance: AlmSettingsInstance) => props.onFieldChange('key', instance.key)}
- optionRenderer={optionRenderer}
+ <Select
+ inputId="name"
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ isClearable={false}
+ isSearchable={false}
options={instances}
- searchable={false}
- value={formData.key}
- valueKey="key"
- valueRenderer={optionRenderer}
+ onChange={(instance: AlmSettingsInstance) => props.onFieldChange('key', instance.key)}
+ components={{
+ Option: optionRenderer,
+ SingleValue: singleValueRenderer
+ }}
+ value={instances.filter(instance => instance.key === formData.key)}
/>
</div>
</div>
*/
import { shallow } from 'enzyme';
import * as React from 'react';
-import SelectLegacy from '../../../../../components/controls/SelectLegacy';
-import { waitAndUpdate } from '../../../../../helpers/testUtils';
import {
AlmKeys,
AlmSettingsInstance,
}
);
-it('should render select options correctly', async () => {
- const wrapper = shallowRender({ instances });
-
- await waitAndUpdate(wrapper);
-
- const { optionRenderer } = wrapper.find(SelectLegacy).props();
-
- expect(optionRenderer!(instances[0])).toMatchSnapshot();
-
- expect(optionRenderer!(instances[1])).toMatchSnapshot();
-});
-
function shallowRender(props: Partial<PRDecorationBindingRendererProps> = {}) {
return shallow(
<PRDecorationBindingRenderer
<div
className="settings-definition-right"
>
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={
+ <Select
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ components={
Object {
- "maxWidth": "210%",
- "width": "auto",
+ "Option": [Function],
+ "SingleValue": [Function],
}
}
+ inputId="name"
+ isClearable={false}
+ isSearchable={false}
onChange={[Function]}
- optionRenderer={[Function]}
options={
Array [
Object {
},
]
}
- searchable={false}
- value="i1"
- valueKey="key"
- valueRenderer={[Function]}
+ value={
+ Array [
+ Object {
+ "alm": "github",
+ "key": "i1",
+ "url": "http://github.enterprise.com",
+ },
+ ]
+ }
/>
</div>
</div>
<div
className="settings-definition-right"
>
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={
+ <Select
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ components={
Object {
- "maxWidth": "210%",
- "width": "auto",
+ "Option": [Function],
+ "SingleValue": [Function],
}
}
+ inputId="name"
+ isClearable={false}
+ isSearchable={false}
onChange={[Function]}
- optionRenderer={[Function]}
options={
Array [
Object {
},
]
}
- searchable={false}
- value=""
- valueKey="key"
- valueRenderer={[Function]}
+ value={Array []}
/>
</div>
</div>
<div
className="settings-definition-right"
>
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={
+ <Select
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ components={
Object {
- "maxWidth": "210%",
- "width": "auto",
+ "Option": [Function],
+ "SingleValue": [Function],
}
}
+ inputId="name"
+ isClearable={false}
+ isSearchable={false}
onChange={[Function]}
- optionRenderer={[Function]}
options={
Array [
Object {
},
]
}
- searchable={false}
- value=""
- valueKey="key"
- valueRenderer={[Function]}
+ value={Array []}
/>
</div>
</div>
<div
className="settings-definition-right"
>
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={
+ <Select
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ components={
Object {
- "maxWidth": "210%",
- "width": "auto",
+ "Option": [Function],
+ "SingleValue": [Function],
}
}
+ inputId="name"
+ isClearable={false}
+ isSearchable={false}
onChange={[Function]}
- optionRenderer={[Function]}
options={
Array [
Object {
},
]
}
- searchable={false}
- value=""
- valueKey="key"
- valueRenderer={[Function]}
+ value={Array []}
/>
</div>
</div>
<div
className="settings-definition-right"
>
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={
+ <Select
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ components={
Object {
- "maxWidth": "210%",
- "width": "auto",
+ "Option": [Function],
+ "SingleValue": [Function],
}
}
+ inputId="name"
+ isClearable={false}
+ isSearchable={false}
onChange={[Function]}
- optionRenderer={[Function]}
options={
Array [
Object {
},
]
}
- searchable={false}
- value="i1"
- valueKey="key"
- valueRenderer={[Function]}
+ value={
+ Array [
+ Object {
+ "alm": "github",
+ "key": "i1",
+ "url": "http://github.enterprise.com",
+ },
+ ]
+ }
/>
</div>
</div>
<div
className="settings-definition-right"
>
- <SelectLegacy
- autosize={true}
- className="abs-width-400 big-spacer-top"
- clearable={false}
- id="name"
- menuContainerStyle={
+ <Select
+ className="abs-width-400 big-spacer-top it__configuration-name-select"
+ components={
Object {
- "maxWidth": "210%",
- "width": "auto",
+ "Option": [Function],
+ "SingleValue": [Function],
}
}
+ inputId="name"
+ isClearable={false}
+ isSearchable={false}
onChange={[Function]}
- optionRenderer={[Function]}
options={
Array [
Object {
},
]
}
- searchable={false}
- value=""
- valueKey="key"
- valueRenderer={[Function]}
+ value={Array []}
/>
</div>
</div>
</Alert>
</div>
`;
-
-exports[`should render select options correctly 1`] = `
-<React.Fragment>
- <span>
- i1
- —
- </span>
- <span
- className="text-muted"
- >
- http://github.enterprise.com
- </span>
-</React.Fragment>
-`;
-
-exports[`should render select options correctly 2`] = `
-<React.Fragment>
- <span>
- i2
- —
- </span>
- <span
- className="text-muted"
- >
- http://github.enterprise.com
- </span>
-</React.Fragment>
-`;
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2022 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
- */
-import { debounce } from 'lodash';
-import * as React from 'react';
-import SelectLegacy from '../../../components/controls/SelectLegacy';
-import Avatar from '../../../components/ui/Avatar';
-import { translate, translateWithParameters } from '../../../helpers/l10n';
-
-interface Option {
- login: string;
- name: string;
- avatar?: string;
-}
-
-interface Props {
- autoFocus?: boolean;
- excludedUsers: string[];
- handleValueChange: (option: Option) => void;
- searchUsers: (query: string, ps: number) => Promise<{ users: Option[] }>;
- selectedUser?: Option;
-}
-
-interface State {
- isLoading: boolean;
- search: string;
- searchResult: Option[];
-}
-
-const LIST_SIZE = 10;
-const AVATAR_SIZE = 16;
-
-export default class UsersSelectSearch extends React.PureComponent<Props, State> {
- mounted = false;
-
- constructor(props: Props) {
- super(props);
- this.handleSearch = debounce(this.handleSearch, 250);
- this.state = { searchResult: [], isLoading: false, search: '' };
- }
-
- componentDidMount() {
- this.mounted = true;
- this.handleSearch(this.state.search);
- }
-
- componentDidUpdate(prevProps: Props) {
- if (this.props.excludedUsers !== prevProps.excludedUsers) {
- this.handleSearch(this.state.search);
- }
- }
-
- componentWillUnmount() {
- this.mounted = false;
- }
-
- filterSearchResult = ({ users }: { users: Option[] }) =>
- users.filter(user => !this.props.excludedUsers.includes(user.login)).slice(0, LIST_SIZE);
-
- filterOptions = (options: Option[]) => {
- return options; // We don't filter anything, this is done by the WS
- };
-
- handleSearch = (search: string) => {
- this.props
- .searchUsers(search, Math.min(this.props.excludedUsers.length + LIST_SIZE, 500))
- .then(this.filterSearchResult)
- .then(
- searchResult => {
- if (this.mounted) {
- this.setState({ isLoading: false, searchResult });
- }
- },
- () => {
- if (this.mounted) {
- this.setState({ isLoading: false, searchResult: [] });
- }
- }
- );
- };
-
- handleInputChange = (search: string) => {
- if (search == null || search.length === 1) {
- this.setState({ search });
- } else {
- this.setState({ isLoading: true, search });
- this.handleSearch(search);
- }
- };
-
- render() {
- const noResult =
- this.state.search.length === 1
- ? translateWithParameters('select2.tooShort', 2)
- : translate('no_results');
- return (
- <SelectLegacy
- autoFocus={this.props.autoFocus}
- className="Select-big"
- clearable={false}
- filterOptions={this.filterOptions}
- isLoading={this.state.isLoading}
- labelKey="name"
- noResultsText={noResult}
- onChange={this.props.handleValueChange}
- onInputChange={this.handleInputChange}
- optionComponent={UsersSelectSearchOption}
- options={this.state.searchResult}
- placeholder=""
- searchable={true}
- value={this.props.selectedUser}
- valueComponent={UsersSelectSearchValue}
- valueKey="login"
- />
- );
- }
-}
-
-interface OptionProps {
- children?: React.ReactNode;
- className?: string;
- isFocused?: boolean;
- onFocus: (option: Option, evt: React.MouseEvent<HTMLDivElement>) => void;
- onSelect: (option: Option, evt: React.MouseEvent<HTMLDivElement>) => void;
- option: Option;
-}
-
-export class UsersSelectSearchOption extends React.PureComponent<OptionProps> {
- handleMouseDown = (evt: React.MouseEvent<HTMLDivElement>) => {
- evt.preventDefault();
- evt.stopPropagation();
- this.props.onSelect(this.props.option, evt);
- };
-
- handleMouseEnter = (evt: React.MouseEvent<HTMLDivElement>) => {
- this.props.onFocus(this.props.option, evt);
- };
-
- handleMouseMove = (evt: React.MouseEvent<HTMLDivElement>) => {
- if (this.props.isFocused) {
- return;
- }
- this.props.onFocus(this.props.option, evt);
- };
-
- render() {
- const { option } = this.props;
- return (
- <div
- className={this.props.className}
- onMouseDown={this.handleMouseDown}
- onMouseEnter={this.handleMouseEnter}
- onMouseMove={this.handleMouseMove}
- role="listitem"
- title={option.name}>
- <Avatar hash={option.avatar} name={option.name} size={AVATAR_SIZE} />
- <strong className="spacer-left">{this.props.children}</strong>
- <span className="note little-spacer-left">{option.login}</span>
- </div>
- );
- }
-}
-
-interface ValueProps {
- value?: Option;
- children?: React.ReactNode;
-}
-
-export function UsersSelectSearchValue({ children, value }: ValueProps) {
- return (
- <div className="Select-value" title={value ? value.name : ''}>
- {value && value.login && (
- <div className="Select-value-label">
- <Avatar hash={value.avatar} name={value.name} size={AVATAR_SIZE} />
- <strong className="spacer-left">{children}</strong>
- <span className="note little-spacer-left">{value.login}</span>
- </div>
- )}
- </div>
- );
-}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2022 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
- */
-import { shallow } from 'enzyme';
-import * as React from 'react';
-import UsersSelectSearch, {
- UsersSelectSearchOption,
- UsersSelectSearchValue
-} from '../UsersSelectSearch';
-
-const selectedUser = {
- login: 'admin',
- name: 'Administrator',
- avatar: '7daf6c79d4802916d83f6266e24850af'
-};
-const users = [
- { login: 'admin', name: 'Administrator', email: 'admin@admin.ch' },
- { login: 'test', name: 'Tester', email: 'tester@testing.ch' },
- { login: 'foo', name: 'Foo Bar', email: 'foo@bar.ch' }
-];
-const excludedUsers = ['admin'];
-
-describe('UsersSelectSearch', () => {
- it('should render correctly', () => {
- const onSearch = jest.fn().mockResolvedValue({ users });
- const wrapper = shallow(
- <UsersSelectSearch
- excludedUsers={excludedUsers}
- handleValueChange={jest.fn()}
- searchUsers={onSearch}
- selectedUser={selectedUser}
- />
- );
- expect(wrapper).toMatchSnapshot();
- const searchResult = (wrapper.instance() as UsersSelectSearch).filterSearchResult({ users });
- expect(searchResult).toMatchSnapshot();
- expect(wrapper.setState({ searchResult })).toMatchSnapshot();
- });
-});
-
-describe('UsersSelectSearchOption', () => {
- it('should render correctly without all parameters', () => {
- const wrapper = shallow(
- <UsersSelectSearchOption onFocus={jest.fn()} onSelect={jest.fn()} option={selectedUser}>
- {selectedUser.name}
- </UsersSelectSearchOption>
- );
- expect(wrapper).toMatchSnapshot();
- });
-
- it('should render correctly with email instead of hash', () => {
- const wrapper = shallow(
- <UsersSelectSearchOption onFocus={jest.fn()} onSelect={jest.fn()} option={users[0]}>
- {users[0].name}
- </UsersSelectSearchOption>
- );
- expect(wrapper).toMatchSnapshot();
- });
-});
-
-describe('UsersSelectSearchValue', () => {
- it('should render correctly with a user', () => {
- const wrapper = shallow(
- <UsersSelectSearchValue value={selectedUser}>{selectedUser.name}</UsersSelectSearchValue>
- );
- expect(wrapper).toMatchSnapshot();
- });
-
- it('should render correctly with email instead of hash', () => {
- const wrapper = shallow(
- <UsersSelectSearchValue value={users[0]}>{users[0].name}</UsersSelectSearchValue>
- );
- expect(wrapper).toMatchSnapshot();
- });
-
- it('should render correctly without value', () => {
- const wrapper = shallow(<UsersSelectSearchValue />);
- expect(wrapper).toMatchSnapshot();
- });
-});
+++ /dev/null
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`UsersSelectSearch should render correctly 1`] = `
-<SelectLegacy
- className="Select-big"
- clearable={false}
- filterOptions={[Function]}
- isLoading={false}
- labelKey="name"
- noResultsText="no_results"
- onChange={[MockFunction]}
- onInputChange={[Function]}
- optionComponent={[Function]}
- options={Array []}
- placeholder=""
- searchable={true}
- value={
- Object {
- "avatar": "7daf6c79d4802916d83f6266e24850af",
- "login": "admin",
- "name": "Administrator",
- }
- }
- valueComponent={[Function]}
- valueKey="login"
-/>
-`;
-
-exports[`UsersSelectSearch should render correctly 2`] = `
-Array [
- Object {
- "email": "tester@testing.ch",
- "login": "test",
- "name": "Tester",
- },
- Object {
- "email": "foo@bar.ch",
- "login": "foo",
- "name": "Foo Bar",
- },
-]
-`;
-
-exports[`UsersSelectSearch should render correctly 3`] = `
-<SelectLegacy
- className="Select-big"
- clearable={false}
- filterOptions={[Function]}
- isLoading={false}
- labelKey="name"
- noResultsText="no_results"
- onChange={[MockFunction]}
- onInputChange={[Function]}
- optionComponent={[Function]}
- options={
- Array [
- Object {
- "email": "tester@testing.ch",
- "login": "test",
- "name": "Tester",
- },
- Object {
- "email": "foo@bar.ch",
- "login": "foo",
- "name": "Foo Bar",
- },
- ]
- }
- placeholder=""
- searchable={true}
- value={
- Object {
- "avatar": "7daf6c79d4802916d83f6266e24850af",
- "login": "admin",
- "name": "Administrator",
- }
- }
- valueComponent={[Function]}
- valueKey="login"
-/>
-`;
-
-exports[`UsersSelectSearchOption should render correctly with email instead of hash 1`] = `
-<div
- onMouseDown={[Function]}
- onMouseEnter={[Function]}
- onMouseMove={[Function]}
- role="listitem"
- title="Administrator"
->
- <withAppStateContext(Avatar)
- name="Administrator"
- size={16}
- />
- <strong
- className="spacer-left"
- >
- Administrator
- </strong>
- <span
- className="note little-spacer-left"
- >
- admin
- </span>
-</div>
-`;
-
-exports[`UsersSelectSearchOption should render correctly without all parameters 1`] = `
-<div
- onMouseDown={[Function]}
- onMouseEnter={[Function]}
- onMouseMove={[Function]}
- role="listitem"
- title="Administrator"
->
- <withAppStateContext(Avatar)
- hash="7daf6c79d4802916d83f6266e24850af"
- name="Administrator"
- size={16}
- />
- <strong
- className="spacer-left"
- >
- Administrator
- </strong>
- <span
- className="note little-spacer-left"
- >
- admin
- </span>
-</div>
-`;
-
-exports[`UsersSelectSearchValue should render correctly with a user 1`] = `
-<div
- className="Select-value"
- title="Administrator"
->
- <div
- className="Select-value-label"
- >
- <withAppStateContext(Avatar)
- hash="7daf6c79d4802916d83f6266e24850af"
- name="Administrator"
- size={16}
- />
- <strong
- className="spacer-left"
- >
- Administrator
- </strong>
- <span
- className="note little-spacer-left"
- >
- admin
- </span>
- </div>
-</div>
-`;
-
-exports[`UsersSelectSearchValue should render correctly with email instead of hash 1`] = `
-<div
- className="Select-value"
- title="Administrator"
->
- <div
- className="Select-value-label"
- >
- <withAppStateContext(Avatar)
- name="Administrator"
- size={16}
- />
- <strong
- className="spacer-left"
- >
- Administrator
- </strong>
- <span
- className="note little-spacer-left"
- >
- admin
- </span>
- </div>
-</div>
-`;
-
-exports[`UsersSelectSearchValue should render correctly without value 1`] = `
-<div
- className="Select-value"
- title=""
-/>
-`;
hotspot.filters.title=Filters
hotspot.filters.assignee.assigned_to_me=Assigned to me
hotspot.filters.assignee.all=All
+hotspot.filters.status=Status filter
hotspot.filters.status.to_review=To review
hotspot.filters.status.acknowledged=Acknowledged
hotspot.filters.status.fixed=Fixed
+hotspot.filters.period=Period filter
hotspot.filters.period.since_leak_period=New code
hotspot.filters.period.overall=Overall code
hotspot.filters.status.safe=Safe