if (!this.context.branchesEnabled) {
return (
<div className="navbar-context-branches">
- <BranchIcon branch={currentBranch} className="little-spacer-right" color={theme.gray80} />
+ <BranchIcon branch={currentBranch} className="little-spacer-right" fill={theme.gray80} />
<span className="note">{currentBranch.name}</span>
{this.renderNoBranchSupportPopup()}
</div>
}
}
className="little-spacer-right"
- color="#cdcdcd"
+ fill="#cdcdcd"
/>
<span
className="note"
setEditionStatus={setEditionStatus}
/>
);
- click(wrapper.find('a'));
+ click(wrapper.find('button'));
expect(dismissMsg).toHaveBeenCalled();
await new Promise(setImmediate);
expect(setEditionStatus).toHaveBeenCalledWith({
cursor: default;
}
-.button-icon {
- border: none;
- color: var(--secondFontColor);
-}
-
.button-small {
- height: 20px;
+ height: var(--smallControlHeight);
line-height: 18px;
+ padding: 0 6px;
+ font-size: 11px;
}
.button-small > svg {
margin-top: 2px;
}
-.button-compact {
- padding: 0 6px;
-}
-
.button-group {
display: inline-block;
vertical-align: middle;
min-width: 300px;
}
-.input-clear {
+.input-ghost {
padding: 0 !important;
border: none !important;
background-color: transparent !important;
background-repeat: no-repeat;
}
-.icon-pending {
- position: relative;
- top: -1px;
-}
-
-.icon-pending path {
- fill: var(--secondFontColor);
- animation: animation-pending 2s linear infinite;
-}
-
-@keyframes animation-pending {
- 0% {
- fill: var(--secondFontColor);
- }
-
- 50% {
- fill: #aaa;
- }
-
- 100% {
- fill: var(--secondFontColor);
- }
-}
-
/*
* Spinner
*/
gray94: '#efefef',
gray80: '#cdcdcd',
gray71: '#b4b4b4',
+ gray67: '#aaa',
+ gray60: '#999',
barBackgroundColor: '#f3f3f3',
barBorderColor: '#e6e6e6',
bigFontSize: '16px',
controlHeight: '24px',
+ smallControlHeight: '20px',
+ tinyControlHeight: '16px',
// different
defaultShadow: '0 6px 12px rgba(0, 0, 0, 0.175)',
import { connect } from 'react-redux';
import { differenceBy } from 'lodash';
import ProjectNotifications from './ProjectNotifications';
-import Select, { AsyncSelect } from '../../../components/controls/Select';
+import { AsyncSelect } from '../../../components/controls/Select';
import Organization from '../../../components/shared/Organization';
import { translate } from '../../../helpers/l10n';
import { getSuggestions } from '../../../api/components';
/* @flow */
import React from 'react';
import Tooltip from '../../../components/controls/Tooltip';
-import DeleteIcon from '../../../components/icons-components/DeleteIcon';
+import { DeleteButton } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
/*::
/*:: props: Props; */
/*:: state: State; */
- handleCancelAllPending = (event /*: Object */) => {
- event.preventDefault();
- event.currentTarget.blur();
- this.props.onCancelAllPending();
- };
-
handleShowFailing = (event /*: Object */) => {
event.preventDefault();
event.currentTarget.blur();
{translate('background_tasks.pending')}
{this.props.isSystemAdmin && (
<Tooltip overlay={translate('background_tasks.cancel_all_tasks')}>
- <a
- className="js-cancel-pending spacer-left link-no-underline"
- href="#"
- onClick={this.handleCancelAllPending}>
- <DeleteIcon className="text-text-top" />
- </a>
+ <DeleteButton
+ className="js-cancel-pending spacer-left"
+ onClick={this.props.onCancelAllPending}
+ />
</Tooltip>
)}
</span>
import { translate } from '../../../helpers/l10n';
import HelpIcon from '../../../components/icons-components/HelpIcon';
import BubblePopupHelper from '../../../components/common/BubblePopupHelper';
-import EditIcon from '../../../components/icons-components/EditIcon';
+import { EditButton } from '../../../components/ui/buttons';
interface State {
canSetWorkerCount: boolean;
? this.setState({ formOpen: false, workerCount: newWorkerCount })
: this.setState({ formOpen: false });
- handleChangeClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
+ handleChangeClick = () => {
this.setState({ formOpen: true });
};
</Tooltip>
)}
- {translate('background_tasks.number_of_workers')}
+ <span className="text-middle">
+ {translate('background_tasks.number_of_workers')}
- {loading ? (
- <i className="spinner little-spacer-left" />
- ) : (
- <strong className="little-spacer-left">{workerCount}</strong>
- )}
+ {loading ? (
+ <i className="spinner little-spacer-left" />
+ ) : (
+ <strong className="little-spacer-left">{workerCount}</strong>
+ )}
+ </span>
{!loading &&
canSetWorkerCount && (
<Tooltip overlay={translate('background_tasks.change_number_of_workers')}>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
- onClick={this.handleChangeClick}>
- <EditIcon className="text-text-top" />
- </a>
+ <EditButton
+ className="js-edit button-small spacer-left"
+ onClick={this.handleChangeClick}
+ />
</Tooltip>
)}
exports[`opens form 1`] = `
<div>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 1
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 1
+ </strong>
+ </span>
<Tooltip
overlay="background_tasks.change_number_of_workers"
placement="bottom"
>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
+ <EditButton
+ className="js-edit button-small spacer-left"
onClick={[Function]}
- >
- <EditIcon
- className="text-text-top"
- />
- </a>
+ />
</Tooltip>
</div>
`;
exports[`opens form 2`] = `
<div>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 1
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 1
+ </strong>
+ </span>
<Tooltip
overlay="background_tasks.change_number_of_workers"
placement="bottom"
>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
+ <EditButton
+ className="js-edit button-small spacer-left"
onClick={[Function]}
- >
- <EditIcon
- className="text-text-top"
- />
- </a>
+ />
</Tooltip>
<WorkersForm
onClose={[Function]}
exports[`renders 1`] = `
<div>
- background_tasks.number_of_workers
- <i
- className="spinner little-spacer-left"
- />
+ <span
+ className="text-middle"
+ >
+ background_tasks.number_of_workers
+ <i
+ className="spinner little-spacer-left"
+ />
+ </span>
</div>
`;
exports[`renders 2`] = `
<div>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 1
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 1
+ </strong>
+ </span>
<Tooltip
overlay="background_tasks.change_number_of_workers"
placement="bottom"
>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
+ <EditButton
+ className="js-edit button-small spacer-left"
onClick={[Function]}
- >
- <EditIcon
- className="text-text-top"
- />
- </a>
+ />
</Tooltip>
</div>
`;
className="icon-alert-warn little-spacer-right bt-workers-warning-icon"
/>
</Tooltip>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 2
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 2
+ </strong>
+ </span>
<Tooltip
overlay="background_tasks.change_number_of_workers"
placement="bottom"
>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
+ <EditButton
+ className="js-edit button-small spacer-left"
onClick={[Function]}
- >
- <EditIcon
- className="text-text-top"
- />
- </a>
+ />
</Tooltip>
</div>
`;
className="icon-alert-warn little-spacer-right bt-workers-warning-icon"
/>
</Tooltip>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 2
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 2
+ </strong>
+ </span>
<span
className="spacer-left"
>
exports[`updates worker count 1`] = `
<div>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 1
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 1
+ </strong>
+ </span>
<Tooltip
overlay="background_tasks.change_number_of_workers"
placement="bottom"
>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
+ <EditButton
+ className="js-edit button-small spacer-left"
onClick={[Function]}
- >
- <EditIcon
- className="text-text-top"
- />
- </a>
+ />
</Tooltip>
<WorkersForm
onClose={[Function]}
className="icon-alert-warn little-spacer-right bt-workers-warning-icon"
/>
</Tooltip>
- background_tasks.number_of_workers
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- 7
- </strong>
+ background_tasks.number_of_workers
+ <strong
+ className="little-spacer-left"
+ >
+ 7
+ </strong>
+ </span>
<Tooltip
overlay="background_tasks.change_number_of_workers"
placement="bottom"
>
- <a
- className="js-edit link-no-underline spacer-left"
- href="#"
+ <EditButton
+ className="js-edit button-small spacer-left"
onClick={[Function]}
- >
- <EditIcon
- className="text-text-top"
- />
- </a>
+ />
</Tooltip>
</div>
`;
placement="right"
overlay={translate('component_measures.show_metric_history')}>
<Link
- className="js-show-history spacer-left button button-small button-compact"
+ className="js-show-history spacer-left button button-small"
to={getMeasureHistoryUrl(component.key, metric.key, branch)}>
<HistoryIcon />
</Link>
placement="right"
>
<Link
- className="js-show-history spacer-left button button-small button-compact"
+ className="js-show-history spacer-left button button-small"
onlyActiveOnIndex={false}
style={Object {}}
to={
exports[`should render with branch 1`] = `
<Link
- className="js-show-history spacer-left button button-small button-compact"
+ className="js-show-history spacer-left button button-small"
onlyActiveOnIndex={false}
style={Object {}}
to={
<div className="overview-title">
<span>{translate('metric.bugs.name')}</span>
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
to={getComponentDrilldownUrl(component.key, 'Reliability', branch)}>
<BubblesIcon size={14} />
</Link>
<span className="big-spacer-left">{translate('metric.vulnerabilities.name')}</span>
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
to={getComponentDrilldownUrl(component.key, 'Security', branch)}>
<BubblesIcon size={14} />
</Link>
<div className="overview-title">
<span>{label}</span>
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
to={getComponentDrilldownUrl(component.key, domain, branch)}>
<BubblesIcon size={14} />
</Link>
};
renderHistoryLink = metricKey => {
- const linkClass =
- 'button button-small button-compact spacer-left overview-domain-measure-history-link';
+ const linkClass = 'button button-small spacer-left overview-domain-measure-history-link';
return (
<Link
className={linkClass}
export default function HistoryButtonLink({ component, metric }: Props) {
return (
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
to={getMeasureHistoryUrl(component, metric)}>
<HistoryIcon size={14} />
</Link>
export default function MeasuresButtonLink({ component, metric }: Props) {
return (
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
to={getComponentDrilldownUrl(component, metric)}>
<BubblesIcon size={14} />
</Link>
exports[`renders 1`] = `
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
onlyActiveOnIndex={false}
style={Object {}}
to={
exports[`renders 1`] = `
<Link
- className="button button-small button-compact spacer-left text-text-bottom"
+ className="button button-small spacer-left text-text-bottom"
onlyActiveOnIndex={false}
style={Object {}}
to={
import EventInner from './EventInner';
import ChangeEventForm from './forms/ChangeEventForm';
import RemoveEventForm from './forms/RemoveEventForm';
-import DeleteIcon from '../../../components/icons-components/DeleteIcon';
-import ChangeIcon from '../../../components/icons-components/ChangeIcon';
+import { DeleteButton, EditButton } from '../../../components/ui/buttons';
/*:: import type { Event as EventType } from '../types'; */
/*::
this.mounted = false;
}
- startChanging = (e /*: MouseEvent */) => {
- e.stopPropagation();
+ startChanging = () => {
this.setState({ changing: true });
};
}
};
- startDeleting = (e /*: MouseEvent */) => {
- e.stopPropagation();
+ startDeleting = () => {
this.setState({ deleting: true });
};
{showActions && (
<div className="project-activity-event-actions spacer-left">
{canChange && (
- <button className="js-change-event button-clean" onClick={this.startChanging}>
- <ChangeIcon />
- </button>
+ <EditButton className="js-change-event button-small" onClick={this.startChanging} />
)}
{canDelete && (
- <button className="js-delete-event button-clean" onClick={this.startDeleting}>
- <DeleteIcon />
- </button>
+ <DeleteButton className="js-delete-event button-small" onClick={this.startDeleting} />
)}
</div>
)}
*/
import * as React from 'react';
import * as classNames from 'classnames';
+import * as theme from '../../../app/theme';
import AlertWarnIcon from '../../../components/icons-components/AlertWarnIcon';
import ChartLegendIcon from '../../../components/icons-components/ChartLegendIcon';
-import CloseIcon from '../../../components/icons-components/CloseIcon';
+import { ButtonIcon } from '../../../components/ui/buttons';
+import ClearIcon from '../../../components/icons-components/ClearIcon';
interface Props {
className?: string;
}
export default class GraphsLegendItem extends React.PureComponent<Props> {
- handleClick = (e: React.MouseEvent<HTMLElement>) => {
- e.preventDefault();
+ handleClick = () => {
if (this.props.removeMetric) {
this.props.removeMetric(this.props.metric);
}
) : (
<ChartLegendIcon
className={classNames(
- 'spacer-right line-chart-legend',
+ 'text-middle spacer-right line-chart-legend',
'line-chart-legend-' + this.props.style
)}
/>
)}
- {this.props.name}
+ <span className="text-middle">{this.props.name}</span>
{isActionable && (
- <a className="spacer-left button-clean text-text-top" href="#" onClick={this.handleClick}>
- <CloseIcon className="text-danger" />
- </a>
+ <ButtonIcon
+ className="button-tiny spacer-left text-middle"
+ color={theme.gray60}
+ onClick={this.handleClick}>
+ <ClearIcon size={12} />
+ </ButtonIcon>
)}
</span>
);
<div className="project-activity-time spacer-right">
<TimeTooltipFormatter className="text-middle" date={date} placement="right" />
</div>
- <div className="project-activity-analysis-icon big-spacer-right" title={analysisTitle} />
+ <div className="project-activity-analysis-icon spacer-right" title={analysisTitle} />
{(canAddVersion || canAddEvent || canDeleteAnalyses) && (
- <div className="project-activity-analysis-actions spacer-left">
+ <div className="project-activity-analysis-actions big-spacer-right">
<ActionsDropdown small={true} toggleClassName="js-analysis-actions">
{canAddVersion && (
<AddEventForm
className=""
>
<ChartLegendIcon
- className="spacer-right line-chart-legend line-chart-legend-2"
+ className="text-middle spacer-right line-chart-legend line-chart-legend-2"
/>
- Bugs
+ <span
+ className="text-middle"
+ >
+ Bugs
+ </span>
</span>
`;
className="project-activity-graph-legend-actionable myclass"
>
<ChartLegendIcon
- className="spacer-right line-chart-legend line-chart-legend-1"
+ className="text-middle spacer-right line-chart-legend line-chart-legend-1"
/>
- Foo
- <a
- className="spacer-left button-clean text-text-top"
- href="#"
+ <span
+ className="text-middle"
+ >
+ Foo
+ </span>
+ <ButtonIcon
+ className="button-tiny spacer-left text-middle"
+ color="#999"
onClick={[Function]}
>
- <CloseIcon
- className="text-danger"
+ <ClearIcon
+ size={12}
/>
- </a>
+ </ButtonIcon>
</span>
`;
<AlertWarnIcon
className="spacer-right"
/>
- Foo
+ <span
+ className="text-middle"
+ >
+ Foo
+ </span>
</span>
`;
}
.project-activity-graph-legend-actionable {
- padding: 4px 12px;
+ display: inline-block;
+ padding: 4px 8px 4px 12px;
border-width: 1px;
border-style: solid;
border-radius: 12px;
}
.project-activity-analysis-actions {
- float: right;
+ float: left;
}
.project-activity-time {
}
.project-activity-event {
- line-height: 20px;
+ line-height: 18px;
display: flex;
}
display: inline-block;
}
-.project-activity-event-actions button {
- height: 20px;
-}
-
-.project-activity-event-actions button + button {
- margin-left: 4px;
-}
-
.project-activity-event-inner-icon .project-activity-event-icon {
margin-top: 3px;
}
import * as React from 'react';
import LongBranchesPatternForm from './LongBranchesPatternForm';
import { getValues, SettingValue } from '../../../api/settings';
-import ChangeIcon from '../../../components/icons-components/ChangeIcon';
+import { EditButton } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
interface Props {
}
};
- handleChangeClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- event.currentTarget.blur();
+ handleChangeClick = () => {
this.setState({ formOpen: true });
};
{translate('branches.long_living_branches_pattern')}
{': '}
<strong>{setting.value}</strong>
- <a
- className="display-inline-block spacer-left link-no-underline"
- href="#"
- onClick={this.handleChangeClick}>
- <ChangeIcon />
- </a>
+ <EditButton className="button-small spacer-left" onClick={this.handleChangeClick} />
{this.state.formOpen && (
<LongBranchesPatternForm
onClose={this.closeForm}
import * as React from 'react';
import { shallow } from 'enzyme';
import LongBranchesPattern from '../LongBranchesPattern';
-import { click } from '../../../../helpers/testUtils';
jest.mock('../../../../api/settings', () => ({
getValues: jest.fn(() => Promise.resolve([]))
const wrapper = shallow(<LongBranchesPattern project="project" />);
wrapper.setState({ loading: false, setting: { value: 'release-.*' } });
- click(wrapper.find('a'));
+ wrapper.find('EditButton').prop<Function>('onClick')();
+ wrapper.update();
expect(wrapper.find('LongBranchesPatternForm').exists()).toBeTruthy();
wrapper.find('LongBranchesPatternForm').prop<Function>('onClose')();
<strong>
release-.*
</strong>
- <a
- className="display-inline-block spacer-left link-no-underline"
- href="#"
+ <EditButton
+ className="button-small spacer-left"
onClick={[Function]}
- >
- <ChangeIcon />
- </a>
+ />
</div>
`;
import * as React from 'react';
import { sortBy } from 'lodash';
import ProjectsSortingSelectOption, { Option } from './ProjectsSortingSelectOption';
+import * as theme from '../../../app/theme';
import SortAscIcon from '../../../components/icons-components/SortAscIcon';
import SortDescIcon from '../../../components/icons-components/SortDescIcon';
import Select from '../../../components/controls/Select';
import Tooltip from '../../../components/controls/Tooltip';
+import { ButtonIcon } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
import { SORTING_METRICS, SORTING_LEAK_METRICS, parseSorting } from '../utils';
}));
};
- handleDescToggle = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- event.currentTarget.blur();
+ handleDescToggle = () => {
const sorting = this.getSorting();
this.props.onChange(sorting.sortValue, !sorting.sortDesc);
};
overlay={
sortDesc ? translate('projects.sort_descending') : translate('projects.sort_ascending')
}>
- <a className="spacer-left button-icon" href="#" onClick={this.handleDescToggle}>
- {sortDesc ? (
- <SortDescIcon className="little-spacer-top" />
- ) : (
- <SortAscIcon className="little-spacer-top" />
- )}
- </a>
+ <ButtonIcon
+ className="js-projects-sorting-invert spacer-left"
+ color={theme.gray60}
+ onClick={this.handleDescToggle}>
+ {sortDesc ? <SortDescIcon className="" /> : <SortAscIcon className="" />}
+ </ButtonIcon>
</Tooltip>
</div>
);
import * as React from 'react';
import { shallow } from 'enzyme';
import ProjectsSortingSelect from '../ProjectsSortingSelect';
-import { click } from '../../../../helpers/testUtils';
it('should render correctly for overall view', () => {
expect(
view="overall"
/>
);
- click(wrapper.find('a'));
+ wrapper.find('ButtonIcon').prop<Function>('onClick')();
expect(onChange).toBeCalledWith('size', false);
});
overlay="projects.sort_descending"
placement="bottom"
>
- <a
- className="spacer-left button-icon"
- href="#"
+ <ButtonIcon
+ className="js-projects-sorting-invert spacer-left"
+ color="#999"
onClick={[Function]}
>
<SortDescIcon
- className="little-spacer-top"
+ className=""
/>
- </a>
+ </ButtonIcon>
</Tooltip>
</div>
`;
overlay="projects.sort_ascending"
placement="bottom"
>
- <a
- className="spacer-left button-icon"
- href="#"
+ <ButtonIcon
+ className="js-projects-sorting-invert spacer-left"
+ color="#999"
onClick={[Function]}
>
<SortAscIcon
- className="little-spacer-top"
+ className=""
/>
- </a>
+ </ButtonIcon>
</Tooltip>
</div>
`;
overlay="projects.sort_ascending"
placement="bottom"
>
- <a
- className="spacer-left button-icon"
- href="#"
+ <ButtonIcon
+ className="js-projects-sorting-invert spacer-left"
+ color="#999"
onClick={[Function]}
>
<SortAscIcon
- className="little-spacer-top"
+ className=""
/>
- </a>
+ </ButtonIcon>
</Tooltip>
</div>
`;
import ChangeVisibilityForm from './ChangeVisibilityForm';
import { Organization, Visibility } from '../../app/types';
import { translate } from '../../helpers/l10n';
-import EditIcon from '../../components/icons-components/EditIcon';
+import { EditButton } from '../../components/ui/buttons';
export interface Props {
hasProvisionPermission?: boolean;
this.props.onProjectCreate();
};
- handleChangeVisibilityClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
+ handleChangeVisibilityClick = () => {
this.setState({ visibilityForm: true });
};
<div className="page-actions">
<span className="big-spacer-right">
- {translate('organization.default_visibility_of_new_projects')}{' '}
- <strong>{translate('visibility', organization.projectVisibility)}</strong>
- <a
- className="js-change-visibility spacer-left link-no-underline"
- href="#"
- onClick={this.handleChangeVisibilityClick}>
- <EditIcon className="text-text-top" />
- </a>
+ <span className="text-middle">
+ {translate('organization.default_visibility_of_new_projects')}{' '}
+ <strong>{translate('visibility', organization.projectVisibility)}</strong>
+ </span>
+ <EditButton
+ className="js-change-visibility spacer-left button-small"
+ onClick={this.handleChangeVisibilityClick}
+ />
</span>
{this.props.hasProvisionPermission && (
<button id="create-project" onClick={this.handleCreateProjectClick}>
<span
className="big-spacer-right"
>
- organization.default_visibility_of_new_projects
-
- <strong>
- visibility.public
- </strong>
- <a
- className="js-change-visibility spacer-left link-no-underline"
- href="#"
- onClick={[Function]}
+ <span
+ className="text-middle"
>
- <EditIcon
- className="text-text-top"
- />
- </a>
+ organization.default_visibility_of_new_projects
+
+ <strong>
+ visibility.public
+ </strong>
+ </span>
+ <EditButton
+ className="js-change-visibility spacer-left button-small"
+ onClick={[Function]}
+ />
</span>
<button
id="create-project"
import React from 'react';
import { shallow } from 'enzyme';
import ThresholdInput from '../ThresholdInput';
-import Select from '../../../../components/controls/Select';
import { change } from '../../../../helpers/testUtils';
describe('on strings', () => {
it('should render Select', () => {
const select = shallow(
<ThresholdInput name="foo" value="2" metric={{ type: 'RATING' }} onChange={jest.fn()} />
- ).find(Select);
+ ).find('Select');
expect(select.length).toEqual(1);
expect(select.prop('value')).toEqual('2');
});
const onChange = jest.fn();
const select = shallow(
<ThresholdInput name="foo" value="2" metric={{ type: 'RATING' }} onChange={onChange} />
- ).find(Select);
+ ).find('Select');
select.prop('onChange')({ label: 'D', value: '4' });
expect(onChange).toBeCalledWith('4');
});
const onChange = jest.fn();
const select = shallow(
<ThresholdInput name="foo" value="2" metric={{ type: 'RATING' }} onChange={onChange} />
- ).find(Select);
+ ).find('Select');
select.prop('onChange')(null);
expect(onChange).toBeCalledWith('');
});
import { Group } from './ProfilePermissions';
import { removeGroup } from '../../../api/quality-profiles';
import SimpleModal, { ChildrenProps } from '../../../components/controls/SimpleModal';
-import DeleteIcon from '../../../components/icons-components/DeleteIcon';
import GroupIcon from '../../../components/icons-components/GroupIcon';
+import { DeleteButton } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
interface Props {
this.mounted = false;
}
- handleDeleteClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- event.currentTarget.blur();
+ handleDeleteClick = () => {
this.setState({ deleteModal: true });
};
return (
<div className="clearfix big-spacer-bottom">
- <a
- className="pull-right spacer-top spacer-left spacer-right button-icon"
- href="#"
- onClick={this.handleDeleteClick}>
- <DeleteIcon />
- </a>
+ <DeleteButton
+ className="pull-right spacer-top spacer-left spacer-right button-small"
+ onClick={this.handleDeleteClick}
+ />
<GroupIcon className="pull-left spacer-right" size={32} />
<div className="overflow-hidden" style={{ lineHeight: '32px' }}>
<strong>{group.name}</strong>
import { User } from './ProfilePermissions';
import { removeUser } from '../../../api/quality-profiles';
import SimpleModal, { ChildrenProps } from '../../../components/controls/SimpleModal';
-import DeleteIcon from '../../../components/icons-components/DeleteIcon';
+import { DeleteButton } from '../../../components/ui/buttons';
import Avatar from '../../../components/ui/Avatar';
import { translate } from '../../../helpers/l10n';
this.mounted = false;
}
- handleDeleteClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- event.currentTarget.blur();
+ handleDeleteClick = () => {
this.setState({ deleteModal: true });
};
return (
<div className="clearfix big-spacer-bottom">
- <a
- className="pull-right spacer-top spacer-left spacer-right button-icon"
- href="#"
- onClick={this.handleDeleteClick}>
- <DeleteIcon />
- </a>
+ <DeleteButton
+ className="pull-right spacer-top spacer-left spacer-right button-small"
+ onClick={this.handleDeleteClick}
+ />
<Avatar className="pull-left spacer-right" hash={user.avatar} name={user.name} size={32} />
<div className="overflow-hidden">
<strong>{user.name}</strong>
import * as React from 'react';
import { shallow } from 'enzyme';
import ProfilePermissionsGroup from '../ProfilePermissionsGroup';
-import { click } from '../../../../helpers/testUtils';
const removeGroup = require('../../../../api/quality-profiles').removeGroup as jest.Mock<any>;
(wrapper.instance() as ProfilePermissionsGroup).mounted = true;
expect(wrapper.find('SimpleModal').exists()).toBeFalsy();
- click(wrapper.find('a'));
+ wrapper.find('DeleteButton').prop<Function>('onClick')();
+ wrapper.update();
expect(wrapper.find('SimpleModal').exists()).toBeTruthy();
wrapper.find('SimpleModal').prop<Function>('onSubmit')();
import * as React from 'react';
import { shallow } from 'enzyme';
import ProfilePermissionsUser from '../ProfilePermissionsUser';
-import { click } from '../../../../helpers/testUtils';
const removeUser = require('../../../../api/quality-profiles').removeUser as jest.Mock<any>;
(wrapper.instance() as ProfilePermissionsUser).mounted = true;
expect(wrapper.find('SimpleModal').exists()).toBeFalsy();
- click(wrapper.find('a'));
+ wrapper.find('DeleteButton').prop<Function>('onClick')();
+ wrapper.update();
expect(wrapper.find('SimpleModal').exists()).toBeTruthy();
wrapper.find('SimpleModal').prop<Function>('onSubmit')();
<div
className="clearfix big-spacer-bottom"
>
- <a
- className="pull-right spacer-top spacer-left spacer-right button-icon"
- href="#"
+ <DeleteButton
+ className="pull-right spacer-top spacer-left spacer-right button-small"
onClick={[Function]}
- >
- <DeleteIcon />
- </a>
+ />
<GroupIcon
className="pull-left spacer-right"
size={32}
<div
className="clearfix big-spacer-bottom"
>
- <a
- className="pull-right spacer-top spacer-left spacer-right button-icon"
- href="#"
+ <DeleteButton
+ className="pull-right spacer-top spacer-left spacer-right button-small"
onClick={[Function]}
- >
- <DeleteIcon />
- </a>
+ />
<Connect(Avatar)
className="pull-left spacer-right"
name="Luke Skywalker"
import PropTypes from 'prop-types';
import PrimitiveInput from './PrimitiveInput';
import { getEmptyValue } from '../../utils';
-import DeleteIcon from '../../../../components/icons-components/DeleteIcon';
+import { DeleteButton } from '../../../../components/ui/buttons';
export default class MultiValueInput extends React.PureComponent {
static propTypes = {
this.props.onChange(newValue);
}
- handleDeleteValue(e, index) {
- e.preventDefault();
- e.target.blur();
-
+ handleDeleteValue(index) {
const newValue = [...this.ensureValue()];
newValue.splice(index, 1);
this.props.onChange(newValue);
{!isLast && (
<div className="display-inline-block spacer-left">
- <button
- className="js-remove-value button-clean"
- onClick={e => this.handleDeleteValue(e, index)}>
- <DeleteIcon />
- </button>
+ <DeleteButton
+ className="js-remove-value"
+ onClick={this.handleDeleteValue.bind(this, index)}
+ />
</div>
)}
</li>
import PropTypes from 'prop-types';
import PrimitiveInput from './PrimitiveInput';
import { getEmptyValue, getUniqueName } from '../../utils';
-import DeleteIcon from '../../../../components/icons-components/DeleteIcon';
+import { DeleteButton } from '../../../../components/ui/buttons';
export default class PropertySetInput extends React.PureComponent {
static propTypes = {
return getUniqueName(this.props.setting.definition, field.key);
}
- handleDeleteValue(e, index) {
- e.preventDefault();
- e.target.blur();
-
+ handleDeleteValue(index) {
const newValue = [...this.ensureValue()];
newValue.splice(index, 1);
this.props.onChange(newValue);
/>
</td>
))}
- <td className="thin nowrap">
+ <td className="thin nowrap text-middle">
{!isLast && (
- <button
- className="js-remove-value button-link"
- onClick={e => this.handleDeleteValue(e, index)}>
- <DeleteIcon className="text-middle" />
- </button>
+ <DeleteButton
+ className="js-remove-value"
+ onClick={this.handleDeleteValue.bind(this, index)}
+ />
)}
</td>
</tr>
import * as React from 'react';
import ChangeLogLevelForm from './ChangeLogLevelForm';
import RestartForm from '../../../components/common/RestartForm';
-import EditIcon from '../../../components/icons-components/EditIcon';
+import { EditButton } from '../../../components/ui/buttons';
import { getBaseUrl } from '../../../helpers/urls';
import { translate } from '../../../helpers/l10n';
}
}
- handleLogsLevelOpen = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
+ handleLogsLevelOpen = () => {
this.setState({ openLogsLevelForm: true });
};
return (
<div className="page-actions">
<span>
- {translate('system.logs_level')}
- {':'}
- <strong className="little-spacer-left">{this.state.logLevel}</strong>
- <a
+ <span className="text-middle">
+ {translate('system.logs_level')}
+ {':'}
+ <strong className="little-spacer-left">{this.state.logLevel}</strong>
+ </span>
+ <EditButton
id="edit-logs-level-button"
- className="spacer-left link-no-underline"
- href="#"
- onClick={this.handleLogsLevelOpen}>
- <EditIcon className="little-spacer-top" />
- </a>
+ className="spacer-left button-small"
+ onClick={this.handleLogsLevelOpen}
+ />
</span>
{this.props.canDownloadLogs && (
<div className="display-inline-block dropdown spacer-left">
className="page-actions"
>
<span>
- system.logs_level
- :
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- INFO
- </strong>
- <a
- className="spacer-left link-no-underline"
- href="#"
+ system.logs_level
+ :
+ <strong
+ className="little-spacer-left"
+ >
+ INFO
+ </strong>
+ </span>
+ <EditButton
+ className="spacer-left button-small"
id="edit-logs-level-button"
onClick={[Function]}
- >
- <EditIcon
- className="little-spacer-top"
- />
- </a>
+ />
</span>
<div
className="display-inline-block dropdown spacer-left"
className="page-actions"
>
<span>
- system.logs_level
- :
- <strong
- className="little-spacer-left"
+ <span
+ className="text-middle"
>
- INFO
- </strong>
- <a
- className="spacer-left link-no-underline"
- href="#"
+ system.logs_level
+ :
+ <strong
+ className="little-spacer-left"
+ >
+ INFO
+ </strong>
+ </span>
+ <EditButton
+ className="spacer-left button-small"
id="edit-logs-level-button"
onClick={[Function]}
- >
- <EditIcon
- className="little-spacer-top"
- />
- </a>
+ />
</span>
<a
className="button spacer-left"
import * as React from 'react';
import { map } from 'lodash';
import CheckIcon from '../../../../components/icons-components/CheckIcon';
-import CloseIcon from '../../../../components/icons-components/CloseIcon';
+import ClearIcon from '../../../../components/icons-components/ClearIcon';
import HealthItem from './HealthItem';
import { HealthType, SysValue, SysValueObject } from '../../../../api/system';
import { HEALTH_FIELD } from '../../utils';
if (value) {
return <CheckIcon />;
} else {
- return <CloseIcon />;
+ return <ClearIcon />;
}
}
it('should render `true`', () => {
const wrapper = mount(<SysInfoItem name="test" value={true} />);
- expect(wrapper.find('CheckIcon')).toHaveLength(1);
+ expect(wrapper.find('CheckIcon').exists()).toBeTruthy();
});
it('should render `false`', () => {
const wrapper = mount(<SysInfoItem name="test" value={false} />);
- expect(wrapper.find('CloseIcon')).toHaveLength(1);
+ expect(wrapper.find('ClearIcon').exists()).toBeTruthy();
});
<svg
className={undefined}
height={16}
+ version="1.1"
viewBox="0 0 16 16"
width={16}
- xmlns="http://www.w3.org/2000/svg"
+ xmlSpace="preserve"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
>
<path
d="M14.92 4.804q0 0.357-0.25 0.607l-7.679 7.679q-0.25 0.25-0.607 0.25t-0.607-0.25l-4.446-4.446q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.634 5.857-5.866q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607z"
// @flow
import React from 'react';
import { debounce } from 'lodash';
-import CloseIcon from '../../../components/icons-components/CloseIcon';
import {
createOrganization,
deleteOrganization,
getOrganization
} from '../../../api/organizations';
+import { DeleteButton } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
/*::
}
};
- handleOrganizationDelete = (event /*: Event */) => {
- event.preventDefault();
+ handleOrganizationDelete = () => {
const { organization } = this.state;
if (organization) {
this.setState({ loading: true });
const valid = unique && organization.length >= 2;
return done ? (
- <form onSubmit={this.handleOrganizationDelete}>
+ <div>
<span className="spacer-right text-middle">{organization}</span>
{loading ? (
<i className="spinner text-middle" />
) : (
- <button className="button-clean text-middle">
- <CloseIcon className="icon-red" />
- </button>
+ <DeleteButton className="button-small" onClick={this.handleOrganizationDelete} />
)}
- </form>
+ </div>
) : (
<form onSubmit={this.handleOrganizationCreate}>
<input
*/
// @flow
import React from 'react';
-import CloseIcon from '../../../components/icons-components/CloseIcon';
import { createProject, deleteProject } from '../../../api/components';
+import { DeleteButton } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
/*::
}, this.stopLoading);
};
- handleProjectDelete = (event /*: Event */) => {
- event.preventDefault();
+ handleProjectDelete = () => {
const { projectKey } = this.state;
this.setState({ loading: true });
deleteProject(projectKey).then(() => {
const valid = projectKey.length > 0;
const form = done ? (
- <form onSubmit={this.handleProjectDelete}>
+ <div>
<span className="spacer-right text-middle">{projectKey}</span>
{loading ? (
<i className="spinner text-middle" />
) : (
- <button className="button-clean text-middle">
- <CloseIcon className="icon-red" />
- </button>
+ <DeleteButton className="button-small text-middle" onClick={this.handleProjectDelete} />
)}
- </form>
+ </div>
) : (
<form onSubmit={this.handleProjectCreate}>
<input
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-import { createProject, deleteProject } from '../../../api/components';
-import DeleteIcon from '../../../components/icons-components/DeleteIcon';
-import { translate } from '../../../helpers/l10n';
-
-/*::
-type Props = {
- onDelete: () => void,
- onDone: (projectKey: string) => void,
- organization?: string,
- projectKey?: string
-};
-*/
-
-/*::
-type State = {
- done: boolean,
- loading: boolean,
- projectKey: string
-};
-*/
-
-export default class ProjectKeyStep extends React.PureComponent {
- /*:: mounted: boolean; */
- /*:: props: Props; */
- /*:: state: State; */
-
- constructor(props /*: Props */) {
- super(props);
- this.state = {
- done: props.projectKey != null,
- loading: false,
- projectKey: props.projectKey || ''
- };
- }
-
- componentDidMount() {
- this.mounted = true;
- }
-
- componentWillUnmount() {
- this.mounted = false;
- }
-
- stopLoading = () => {
- if (this.mounted) {
- this.setState({ loading: false });
- }
- };
-
- sanitizeProjectKey = (projectKey /*: string */) => projectKey.replace(/[^a-zA-Z0-9-_\.:]/, '');
-
- handleProjectKeyChange = (event /*: { target: HTMLInputElement } */) => {
- this.setState({ projectKey: this.sanitizeProjectKey(event.target.value) });
- };
-
- handleProjectCreate = (event /*: Event */) => {
- event.preventDefault();
- const { projectKey } = this.state;
- const data /*: { [string]: string } */ = {
- name: projectKey,
- project: projectKey
- };
- if (this.props.organization) {
- data.organization = this.props.organization;
- }
- this.setState({ loading: true });
- createProject(data).then(() => {
- if (this.mounted) {
- this.setState({ done: true, loading: false });
- this.props.onDone(projectKey);
- }
- }, this.stopLoading);
- };
-
- handleProjectDelete = (event /*: Event */) => {
- event.preventDefault();
- const { projectKey } = this.state;
- this.setState({ loading: true });
- deleteProject(projectKey).then(() => {
- if (this.mounted) {
- this.setState({ done: false, loading: false, projectKey: '' });
- this.props.onDelete();
- }
- }, this.stopLoading);
- };
-
- render() {
- const { done, loading, projectKey } = this.state;
-
- const valid = projectKey.length > 0;
-
- const form = done ? (
- <form onSubmit={this.handleProjectDelete}>
- <span className="spacer-right text-middle">{projectKey}</span>
- {loading ? (
- <i className="spinner" />
- ) : (
- <button className="button-clean">
- <DeleteIcon />
- </button>
- )}
- </form>
- ) : (
- <form onSubmit={this.handleProjectCreate}>
- <input
- autoFocus={true}
- className="input-large spacer-right text-middle"
- minLength={1}
- maxLength={400}
- onChange={this.handleProjectKeyChange}
- required={true}
- type="text"
- value={projectKey}
- />
- {loading ? (
- <i className="spinner" />
- ) : (
- <button className="text-middle" disabled={!valid}>
- {translate('Done')}
- </button>
- )}
- <div className="note spacer-top abs-width-300">
- {translate('onboarding.project_key_requirement')}
- </div>
- </form>
- );
-
- return (
- <div className="big-spacer-top">
- <h4 className="spacer-bottom">{translate('onboarding.language.project_key')}</h4>
- {form}
- </div>
- );
- }
-}
import Step from './Step';
import { getTokens, generateToken, revokeToken } from '../../../api/user-tokens';
import AlertErrorIcon from '../../../components/icons-components/AlertErrorIcon';
-import CloseIcon from '../../../components/icons-components/CloseIcon';
+import { DeleteButton } from '../../../components/ui/buttons';
import { translate } from '../../../helpers/l10n';
/*::
}
};
- handleTokenRevoke = (event /*: Event */) => {
- event.preventDefault();
+ handleTokenRevoke = () => {
const { tokenName } = this.state;
if (tokenName) {
this.setState({ loading: true });
{loading ? (
<i className="spinner text-middle" />
) : (
- <button className="button-clean text-middle" onClick={this.handleTokenRevoke}>
- <CloseIcon className="icon-red" />
- </button>
+ <DeleteButton className="button-small text-middle" onClick={this.handleTokenRevoke} />
)}
</form>
) : (
getOrganization: () => Promise.resolve(null)
}));
+jest.mock('../../../../components/icons-components/ClearIcon');
+
it('creates new organization', async () => {
const onDone = jest.fn();
const wrapper = mount(<NewOrganizationForm onDelete={jest.fn()} onDone={onDone} />);
const wrapper = mount(<NewOrganizationForm onDelete={onDelete} onDone={jest.fn()} />);
wrapper.setState({ done: true, loading: false, organization: 'foo' });
expect(wrapper).toMatchSnapshot();
- submit(wrapper.find('form'));
+ wrapper.find('DeleteButton').prop('onClick')();
+ wrapper.update();
expect(wrapper).toMatchSnapshot(); // spinner
await new Promise(setImmediate);
wrapper.update();
deleteProject: () => Promise.resolve()
}));
+jest.mock('../../../../components/icons-components/ClearIcon');
+
it('creates new project', async () => {
const onDone = jest.fn();
const wrapper = mount(<NewProjectForm onDelete={jest.fn()} onDone={onDone} />);
const wrapper = mount(<NewProjectForm onDelete={onDelete} onDone={jest.fn()} />);
wrapper.setState({ done: true, loading: false, projectKey: 'foo' });
expect(wrapper).toMatchSnapshot();
- submit(wrapper.find('form'));
+ wrapper.find('DeleteButton').prop('onClick')();
+ wrapper.update();
expect(wrapper).toMatchSnapshot(); // spinner
await new Promise(setImmediate);
wrapper.update();
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-import { mount } from 'enzyme';
-import ProjectKeyStep from '../ProjectKeyStep';
-import { change, doAsync, submit } from '../../../../helpers/testUtils';
-
-jest.mock('../../../../api/components', () => ({
- createProject: () => Promise.resolve(),
- deleteProject: () => Promise.resolve()
-}));
-
-jest.mock(
- '../../../../components/icons-components/DeleteIcon',
- () =>
- function DeleteIcon() {
- return null;
- }
-);
-
-it('creates new project', async () => {
- const onDone = jest.fn();
- const wrapper = mount(<ProjectKeyStep onDelete={jest.fn()} onDone={onDone} />);
- expect(wrapper).toMatchSnapshot();
- change(wrapper.find('input'), 'foo');
- submit(wrapper.find('form'));
- expect(wrapper).toMatchSnapshot(); // spinner
- await new Promise(setImmediate);
- wrapper.update();
- expect(wrapper).toMatchSnapshot();
- expect(onDone).toBeCalledWith('foo');
-});
-
-it('deletes project', async () => {
- const onDelete = jest.fn();
- const wrapper = mount(<ProjectKeyStep onDelete={onDelete} onDone={jest.fn()} />);
- wrapper.setState({ done: true, loading: false, projectKey: 'foo' });
- expect(wrapper).toMatchSnapshot();
- submit(wrapper.find('form'));
- expect(wrapper).toMatchSnapshot(); // spinner
- await new Promise(setImmediate);
- wrapper.update();
- expect(wrapper).toMatchSnapshot();
- expect(onDelete).toBeCalled();
-});
revokeToken: () => Promise.resolve()
}));
+jest.mock('../../../../components/icons-components/ClearIcon');
+
const currentUser = { login: 'user' };
it('generates token', async () => {
await new Promise(setImmediate);
wrapper.setState({ token: 'abcd1234', tokenName: 'my token' });
expect(wrapper).toMatchSnapshot();
- submit(wrapper.find('form'));
+ wrapper.find('DeleteButton').prop('onClick')();
+ wrapper.update();
expect(wrapper).toMatchSnapshot(); // spinner
await new Promise(setImmediate);
wrapper.update();
onDelete={[Function]}
onDone={[Function]}
>
- <form
- onSubmit={[Function]}
- >
+ <div>
<span
className="spacer-right text-middle"
>
foo
</span>
- <button
- className="button-clean text-middle"
+ <DeleteButton
+ className="button-small"
+ onClick={[Function]}
>
- <CloseIcon
- className="icon-red"
+ <ButtonIcon
+ className="button-small"
+ color="#d4333f"
+ onClick={[Function]}
>
- <svg
- className="icon-red"
- height={16}
- viewBox="0 0 16 16"
- width={16}
- xmlns="http://www.w3.org/2000/svg"
+ <button
+ className="button-small button-icon"
+ onClick={[Function]}
+ style={
+ Object {
+ "color": "#d4333f",
+ }
+ }
>
- <path
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- fill="currentColor"
- />
- </svg>
- </CloseIcon>
- </button>
- </form>
+ <ClearIcon />
+ </button>
+ </ButtonIcon>
+ </DeleteButton>
+ </div>
</NewOrganizationForm>
`;
onDelete={[Function]}
onDone={[Function]}
>
- <form
- onSubmit={[Function]}
- >
+ <div>
<span
className="spacer-right text-middle"
>
foo
</span>
- <button
- className="button-clean text-middle"
+ <DeleteButton
+ className="button-small"
+ onClick={[Function]}
>
- <CloseIcon
- className="icon-red"
+ <ButtonIcon
+ className="button-small"
+ color="#d4333f"
+ onClick={[Function]}
>
- <svg
- className="icon-red"
- height={16}
- viewBox="0 0 16 16"
- width={16}
- xmlns="http://www.w3.org/2000/svg"
+ <button
+ className="button-small button-icon"
+ onClick={[Function]}
+ style={
+ Object {
+ "color": "#d4333f",
+ }
+ }
>
- <path
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- fill="currentColor"
- />
- </svg>
- </CloseIcon>
- </button>
- </form>
+ <ClearIcon />
+ </button>
+ </ButtonIcon>
+ </DeleteButton>
+ </div>
</NewOrganizationForm>
`;
onDelete={[Function]}
onDone={[Function]}
>
- <form
- onSubmit={[Function]}
- >
+ <div>
<span
className="spacer-right text-middle"
>
<i
className="spinner text-middle"
/>
- </form>
+ </div>
</NewOrganizationForm>
`;
>
onboarding.language.project_key
</h4>
- <form
- onSubmit={[Function]}
- >
+ <div>
<span
className="spacer-right text-middle"
>
foo
</span>
- <button
- className="button-clean text-middle"
+ <DeleteButton
+ className="button-small text-middle"
+ onClick={[Function]}
>
- <CloseIcon
- className="icon-red"
+ <ButtonIcon
+ className="button-small text-middle"
+ color="#d4333f"
+ onClick={[Function]}
>
- <svg
- className="icon-red"
- height={16}
- viewBox="0 0 16 16"
- width={16}
- xmlns="http://www.w3.org/2000/svg"
+ <button
+ className="button-small text-middle button-icon"
+ onClick={[Function]}
+ style={
+ Object {
+ "color": "#d4333f",
+ }
+ }
>
- <path
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- fill="currentColor"
- />
- </svg>
- </CloseIcon>
- </button>
- </form>
+ <ClearIcon />
+ </button>
+ </ButtonIcon>
+ </DeleteButton>
+ </div>
</div>
</NewProjectForm>
`;
>
onboarding.language.project_key
</h4>
- <form
- onSubmit={[Function]}
- >
+ <div>
<span
className="spacer-right text-middle"
>
foo
</span>
- <button
- className="button-clean text-middle"
+ <DeleteButton
+ className="button-small text-middle"
+ onClick={[Function]}
>
- <CloseIcon
- className="icon-red"
+ <ButtonIcon
+ className="button-small text-middle"
+ color="#d4333f"
+ onClick={[Function]}
>
- <svg
- className="icon-red"
- height={16}
- viewBox="0 0 16 16"
- width={16}
- xmlns="http://www.w3.org/2000/svg"
+ <button
+ className="button-small text-middle button-icon"
+ onClick={[Function]}
+ style={
+ Object {
+ "color": "#d4333f",
+ }
+ }
>
- <path
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- fill="currentColor"
- />
- </svg>
- </CloseIcon>
- </button>
- </form>
+ <ClearIcon />
+ </button>
+ </ButtonIcon>
+ </DeleteButton>
+ </div>
</div>
</NewProjectForm>
`;
>
onboarding.language.project_key
</h4>
- <form
- onSubmit={[Function]}
- >
+ <div>
<span
className="spacer-right text-middle"
>
<i
className="spinner text-middle"
/>
- </form>
+ </div>
</div>
</NewProjectForm>
`;
+++ /dev/null
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`creates new project 1`] = `
-<ProjectKeyStep
- onDelete={[Function]}
- onDone={[Function]}
->
- <div
- className="big-spacer-top"
- >
- <h4
- className="spacer-bottom"
- >
- onboarding.language.project_key
- </h4>
- <form
- onSubmit={[Function]}
- >
- <input
- autoFocus={true}
- className="input-large spacer-right text-middle"
- maxLength={400}
- minLength={1}
- onChange={[Function]}
- required={true}
- type="text"
- value=""
- />
- <button
- className="text-middle"
- disabled={true}
- >
- Done
- </button>
- <div
- className="note spacer-top abs-width-300"
- >
- onboarding.project_key_requirement
- </div>
- </form>
- </div>
-</ProjectKeyStep>
-`;
-
-exports[`creates new project 2`] = `
-<ProjectKeyStep
- onDelete={[Function]}
- onDone={[Function]}
->
- <div
- className="big-spacer-top"
- >
- <h4
- className="spacer-bottom"
- >
- onboarding.language.project_key
- </h4>
- <form
- onSubmit={[Function]}
- >
- <input
- autoFocus={true}
- className="input-large spacer-right text-middle"
- maxLength={400}
- minLength={1}
- onChange={[Function]}
- required={true}
- type="text"
- value="foo"
- />
- <i
- className="spinner"
- />
- <div
- className="note spacer-top abs-width-300"
- >
- onboarding.project_key_requirement
- </div>
- </form>
- </div>
-</ProjectKeyStep>
-`;
-
-exports[`creates new project 3`] = `
-<ProjectKeyStep
- onDelete={[Function]}
- onDone={[Function]}
->
- <div
- className="big-spacer-top"
- >
- <h4
- className="spacer-bottom"
- >
- onboarding.language.project_key
- </h4>
- <form
- onSubmit={[Function]}
- >
- <span
- className="spacer-right text-middle"
- >
- foo
- </span>
- <button
- className="button-clean"
- >
- <DeleteIcon />
- </button>
- </form>
- </div>
-</ProjectKeyStep>
-`;
-
-exports[`deletes project 1`] = `
-<ProjectKeyStep
- onDelete={[Function]}
- onDone={[Function]}
->
- <div
- className="big-spacer-top"
- >
- <h4
- className="spacer-bottom"
- >
- onboarding.language.project_key
- </h4>
- <form
- onSubmit={[Function]}
- >
- <span
- className="spacer-right text-middle"
- >
- foo
- </span>
- <button
- className="button-clean"
- >
- <DeleteIcon />
- </button>
- </form>
- </div>
-</ProjectKeyStep>
-`;
-
-exports[`deletes project 2`] = `
-<ProjectKeyStep
- onDelete={[Function]}
- onDone={[Function]}
->
- <div
- className="big-spacer-top"
- >
- <h4
- className="spacer-bottom"
- >
- onboarding.language.project_key
- </h4>
- <form
- onSubmit={[Function]}
- >
- <span
- className="spacer-right text-middle"
- >
- foo
- </span>
- <i
- className="spinner"
- />
- </form>
- </div>
-</ProjectKeyStep>
-`;
-
-exports[`deletes project 3`] = `
-<ProjectKeyStep
- onDelete={[Function]}
- onDone={[Function]}
->
- <div
- className="big-spacer-top"
- >
- <h4
- className="spacer-bottom"
- >
- onboarding.language.project_key
- </h4>
- <form
- onSubmit={[Function]}
- >
- <input
- autoFocus={true}
- className="input-large spacer-right text-middle"
- maxLength={400}
- minLength={1}
- onChange={[Function]}
- required={true}
- type="text"
- value=""
- />
- <button
- className="text-middle"
- disabled={true}
- >
- Done
- </button>
- <div
- className="note spacer-top abs-width-300"
- >
- onboarding.project_key_requirement
- </div>
- </form>
- </div>
-</ProjectKeyStep>
-`;
>
abcd1234
</strong>
- <button
- className="button-clean text-middle"
+ <DeleteButton
+ className="button-small text-middle"
onClick={[Function]}
>
- <CloseIcon
- className="icon-red"
+ <ButtonIcon
+ className="button-small text-middle"
+ color="#d4333f"
+ onClick={[Function]}
>
- <svg
- className="icon-red"
- height={16}
- viewBox="0 0 16 16"
- width={16}
- xmlns="http://www.w3.org/2000/svg"
+ <button
+ className="button-small text-middle button-icon"
+ onClick={[Function]}
+ style={
+ Object {
+ "color": "#d4333f",
+ }
+ }
>
- <path
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- fill="currentColor"
- />
- </svg>
- </CloseIcon>
- </button>
+ <ClearIcon />
+ </button>
+ </ButtonIcon>
+ </DeleteButton>
</form>
<div
className="note big-spacer-top width-50"
>
abcd1234
</strong>
- <button
- className="button-clean text-middle"
+ <DeleteButton
+ className="button-small text-middle"
onClick={[Function]}
>
- <CloseIcon
- className="icon-red"
+ <ButtonIcon
+ className="button-small text-middle"
+ color="#d4333f"
+ onClick={[Function]}
>
- <svg
- className="icon-red"
- height={16}
- viewBox="0 0 16 16"
- width={16}
- xmlns="http://www.w3.org/2000/svg"
+ <button
+ className="button-small text-middle button-icon"
+ onClick={[Function]}
+ style={
+ Object {
+ "color": "#d4333f",
+ }
+ }
>
- <path
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- fill="currentColor"
- />
- </svg>
- </CloseIcon>
- </button>
+ <ClearIcon />
+ </button>
+ </ButtonIcon>
+ </DeleteButton>
</form>
<div
className="note big-spacer-top width-50"
import init from '../init';
import { getCurrentUser } from '../../../store/rootReducer';
import { translate } from '../../../helpers/l10n';
+// import styles to have the `.button-icon` styles
+import '../../../components/ui/buttons.css';
class UsersAppContainer extends React.PureComponent {
static propTypes = {
<label>{{t 'my_profile.scm_accounts'}}</label>
<span class="js-scm-input hidden">
<input name="scmAccounts" type="text" size="50" maxlength="255">
- <a class="icon-delete js-remove-scm" href="#"></a>
+ <button class="js-remove-scm button-icon text-top" href="#">
+ <svg width="16" height="16" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
+ <g transform="matrix(0.0392029,0,0,0.0392029,0.878798,-1.19111)">
+ <path d="M334.7,138.6L277.5,81.4L181.6,177.3L85.8,81.4L28.6,138.6L124.4,234.4L28.6,330.3L85.8,387.5L181.6,291.6L277.5,387.5L334.7,330.3L238.8,234.4L334.7,138.6Z" style="fill: #d4333f"/>
+ </g>
+ </svg>
+ </button>
</span>
{{#each scmAccounts}}
<span class="js-scm-input">
<input name="scmAccounts" type="text" size="50" maxlength="255" value="{{this}}">
- <a class="icon-delete js-remove-scm" href="#"></a>
+ <button class="js-remove-scm button-icon text-top" href="#">
+ <svg width="16" height="16" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
+ <g transform="matrix(0.0392029,0,0,0.0392029,0.878798,-1.19111)">
+ <path d="M334.7,138.6L277.5,81.4L181.6,177.3L85.8,81.4L28.6,138.6L124.4,234.4L28.6,330.3L85.8,387.5L181.6,291.6L277.5,387.5L334.7,330.3L238.8,234.4L334.7,138.6Z" style="fill: #d4333f"/>
+ </g>
+ </svg>
+ </button>
</span>
{{/each}}
<div class="spacer-bottom">
<div className={classNames('dropdown', props.className)}>
<button
className={classNames('dropdown-toggle', props.toggleClassName, {
- 'button-small button-compact': props.small
+ 'button-small': props.small
})}
data-toggle="dropdown">
<SettingsIcon className="text-text-bottom" />
<i className="icon-dropdown little-spacer-left" />
</button>
- <ul className="dropdown-menu dropdown-menu-right">{props.children}</ul>
+ <ul className="dropdown-menu">{props.children}</ul>
</div>
);
}
import * as React from 'react';
import * as classNames from 'classnames';
import { pick } from 'lodash';
+import * as theme from '../../app/theme';
+import ClearIcon from '../icons-components/ClearIcon';
+import { ButtonIcon } from '../ui/buttons';
import './styles.css';
-import CloseIcon from '../icons-components/CloseIcon';
interface Props {
className?: string;
this.props.onChange(value);
};
- handleResetClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- event.currentTarget.blur();
+ handleResetClick = () => {
this.props.onChange(undefined);
};
</svg>
</span>
{this.props.value !== undefined && (
- <a className="date-input-control-reset" href="#" onClick={this.handleResetClick}>
- <CloseIcon className="" />
- </a>
+ <ButtonIcon
+ className="button-tiny date-input-control-reset"
+ color={theme.gray60}
+ onClick={this.handleResetClick}>
+ <ClearIcon size={12} />
+ </ButtonIcon>
)}
</span>
);
ReactCreatableSelectProps,
ReactAsyncSelectProps
} from 'react-select';
+import * as theme from '../../app/theme';
+import ClearIcon from '../icons-components/ClearIcon';
+import { ButtonIcon } from '../ui/buttons';
import './react-select.css';
+function renderInput() {
+ return (
+ <ButtonIcon className="button-tiny spacer-left text-middle" color={theme.gray60}>
+ <ClearIcon size={12} />
+ </ButtonIcon>
+ );
+}
+
export default function Select(props: ReactSelectProps) {
// TODO try to define good defaults, if any
- return <ReactSelect {...props} />;
+ // ReactSelect doesn't declare `clearRenderer` prop
+ const ReactSelectAny = ReactSelect as any;
+ // hide the "x" icon when select is empty
+ const clearable = props.clearable ? Boolean(props.value) : false;
+ return <ReactSelectAny {...props} clearable={clearable} clearRenderer={renderInput} />;
}
export function Creatable(props: ReactCreatableSelectProps) {
position: relative;
text-align: center;
vertical-align: middle;
- width: 9px;
- padding-left: 4px;
+ width: 16px;
+ height: 16px;
padding-right: 4px;
}
*/
import * as React from 'react';
import * as theme from '../../app/theme';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function AlertErrorIcon({ className, size = 16 }: Props) {
+export default function AlertErrorIcon({ className, fill = theme.red, size = 16 }: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: theme.red }}
+ style={{ fill }}
d="M11.402 10.018q0-0.232-0.17-0.402l-1.616-1.616 1.616-1.616q0.17-0.17 0.17-0.402 0-0.241-0.17-0.411l-0.804-0.804q-0.17-0.17-0.411-0.17-0.232 0-0.402 0.17l-1.616 1.616-1.616-1.616q-0.17-0.17-0.402-0.17-0.241 0-0.411 0.17l-0.804 0.804q-0.17 0.17-0.17 0.411 0 0.232 0.17 0.402l1.616 1.616-1.616 1.616q-0.17 0.17-0.17 0.402 0 0.241 0.17 0.411l0.804 0.804q0.17 0.17 0.411 0.17 0.232 0 0.402-0.17l1.616-1.616 1.616 1.616q0.17 0.17 0.402 0.17 0.241 0 0.411-0.17l0.804-0.804q0.17-0.17 0.17-0.411zM14.857 8q0 1.866-0.92 3.442t-2.496 2.496-3.442 0.92-3.442-0.92-2.496-2.496-0.92-3.442 0.92-3.442 2.496-2.496 3.442-0.92 3.442 0.92 2.496 2.496 0.92 3.442z"
/>
</svg>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function AlertWarnIcon({ className, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function AlertWarnIcon({ className, fill = '#ed7d20', size = 16 }: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: '#ed7d20' }}
+ style={{ fill }}
d="M8 1.143q1.866 0 3.442.92t2.496 2.496.92 3.442-.92 3.442-2.496 2.496-3.442.92-3.442-.92-2.496-2.496-.92-3.442.92-3.442 2.496-2.496T8 1.143zm1.143 11.134v-1.696q0-.125-.08-.21t-.196-.085H7.153q-.116 0-.205.089t-.089.205v1.696q0 .116.089.205t.205.089h1.714q.116 0 .196-.085t.08-.21zm-.018-3.072l.161-5.545q0-.107-.089-.161-.089-.071-.214-.071H7.019q-.125 0-.214.071-.089.054-.089.161l.152 5.545q0 .089.089.156t.214.067h1.652q.125 0 .21-.067t.094-.156z"
/>
</svg>
import * as React from 'react';
import ShortLivingBranchIcon from './ShortLivingBranchIcon';
import LongLivingBranchIcon from './LongLivingBranchIcon';
+import { IconProps } from './types';
// import PullRequestIcon from './PullRequestIcon';
import { Branch } from '../../app/types';
import { isShortLivingBranch } from '../../helpers/branches';
-interface Props {
+interface Props extends IconProps {
branch: Branch;
- className?: string;
- color?: string;
- size?: number;
}
export default function BranchIcon({ branch, ...props }: Props) {
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function BubblesIcon({ className, size = 16 }: Props) {
+export default function BubblesIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- fill="currentColor"
+ style={{ fill }}
d="M4.1 10.2c1 0 1.9.8 1.9 1.9S5.1 14 4.1 14s-1.9-.8-1.9-1.9.8-1.9 1.9-1.9m0-2C2 8.2.2 9.9.2 12.1S1.9 16 4.1 16 8 14.3 8 12.1 6.2 8.2 4.1 8.2zM10.3 2c2 0 3.7 1.7 3.7 3.7s-1.7 3.7-3.7 3.7-3.8-1.6-3.8-3.7S8.2 2 10.3 2m0-2C7.1 0 4.5 2.6 4.5 5.7s2.6 5.7 5.7 5.7S16 8.9 16 5.7 13.4 0 10.3 0z"
/>
</svg>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function BugIcon({ className, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function BugIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: 'currentColor' }}
+ style={{ fill }}
d="M11 9h1.3l.5.8.8-.5-.8-1.3H11v-.3l2-2.3V3h-1v2l-1 1.2V5c-.1-.8-.7-1.5-1.4-1.9L11 1.8l-.7-.7-1.8 1.6-1.8-1.6-.7.7 1.5 1.3C6.7 3.5 6.1 4.2 6 5v1.1L5 5V3H4v2.3l2 2.3V8H4.2l-.7 1.2.8.5.4-.7H6v.3l-2 1.9V14h1v-2.4l1-1C6 12 7.1 13 8.4 13h.8c.7 0 1.4-.3 1.8-.9.3-.4.3-.9.2-1.4l.9.9V14h1v-2.8l-2-1.9V9zm-2 2H8V6h1v5z"
/>
</svg>
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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 * as React from 'react';
-import * as theme from '../../app/theme';
-
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function ChangeIcon({ className, size = 12 }: Props) {
- return (
- <svg
- className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 14 14"
- width={size}
- height={size}>
- <path
- fill={theme.darkBlue}
- d="M3.35 12.82l.85-.84L2.02 9.8l-.84.85v.98h1.2v1.2h.97zM8.2 4.24c0-.13-.08-.2-.22-.2-.06 0-.1.02-.15.06l-5 5c-.05.05-.08.1-.08.17 0 .13.07.2.2.2.07 0 .12-.02.16-.06l5.02-5c.05-.04.07-.1.07-.16zm-.5-1.77l3.83 3.84-7.7 7.7H0v-3.84l7.7-7.7zm6.3.88c0 .33-.1.6-.34.84L12.12 5.7 8.28 1.88 9.8.35c.24-.23.5-.35.85-.35.32 0 .6.12.84.35l2.16 2.16c.23.25.34.53.34.85z"
- />
- </svg>
- );
-}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*::
-type Props = { className?: string, size?: number };
-*/
-
-export default function ChartLegendIcon({ className, size = 16 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
- width={size}
- height={size}>
- <path
- style={{ fill: 'currentColor' }}
- d="M14.325 7.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-10.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h10.857q0.357 0 0.607 0.25t0.25 0.607z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function ChartLegendIcon({
+ className,
+ fill = 'currentColor',
+ size = 16
+}: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M14.325 7.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-10.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h10.857q0.357 0 0.607 0.25t0.25 0.607z"
+ />
+ </svg>
+ );
+}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function CheckIcon({ className, size = 16 }: Props) {
+export default function CheckIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: 'currentColor' }}
+ style={{ fill }}
d="M14.92 4.804q0 0.357-0.25 0.607l-7.679 7.679q-0.25 0.25-0.607 0.25t-0.607-0.25l-4.446-4.446q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.634 5.857-5.866q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607z"
/>;
</svg>
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:contact 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function ClearIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M14 4.242L11.758 2l-3.76 3.76L4.242 2 2 4.242l3.756 3.756L2 11.758 4.242 14l3.756-3.76 3.76 3.76L14 11.758l-3.76-3.76L14 4.242z"
+ />
+ </svg>
+ );
+}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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 * as React from 'react';
-
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function CloseIcon({ className, size = 16 }: Props) {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- className={className}
- height={size}
- width={size}
- viewBox="0 0 16 16">
- <path
- fill="currentColor"
- d="M12.843 11.232q0 0.357-0.25 0.607l-1.214 1.214q-0.25 0.25-0.607 0.25t-0.607-0.25l-2.625-2.625-2.625 2.625q-0.25 0.25-0.607 0.25t-0.607-0.25l-1.214-1.214q-0.25-0.25-0.25-0.607t0.25-0.607l2.625-2.625-2.625-2.625q-0.25-0.25-0.25-0.607t0.25-0.607l1.214-1.214q0.25-0.25 0.607-0.25t0.607 0.25l2.625 2.625 2.625-2.625q0.25-0.25 0.607-0.25t0.607 0.25l1.214 1.214q0.25 0.25 0.25 0.607t-0.25 0.607l-2.625 2.625 2.625 2.625q0.25 0.25 0.25 0.607z"
- />
- </svg>
- );
-}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function CodeSmellIcon({ className, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function CodeSmellIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ xmlns="http://www.w3.org/2000/svg">
<path
- style={{ fill: 'currentColor' }}
+ style={{ fill }}
d="M8 2C4.7 2 2 4.7 2 8s2.7 6 6 6 6-2.7 6-6-2.7-6-6-6zm-.5 5.5h.9v.9h-.9v-.9zm-3.8.2c-.1 0-.2-.1-.2-.2 0-.4.1-1.2.6-2S5.3 4.2 5.6 4c.2 0 .3 0 .3.1l1.3 2.3c0 .1 0 .2-.1.2-.1.2-.2.3-.3.5-.1.2-.2.4-.2.5 0 .1-.1.2-.2.2l-2.7-.1zM9.9 12c-.3.2-1.1.5-2 .5-.9 0-1.7-.3-2-.5-.1 0-.1-.2-.1-.3l1.3-2.3c0-.1.1-.1.2-.1.2.1.3.1.5.1s.4 0 .5-.1c.1 0 .2 0 .2.1l1.3 2.3c.2.2.2.3.1.3zm2.5-4.1L9.7 8c-.1 0-.2-.1-.2-.2 0-.2-.1-.4-.2-.5 0-.1-.2-.3-.3-.4-.1 0-.1-.1-.1-.2l1.3-2.3c.1-.1.2-.1.3-.1.3.2 1 .7 1.5 1.5s.6 1.6.6 2c0 0-.1.1-.2.1z"
/>
</svg>
*/
import * as React from 'react';
import * as theme from '../../app/theme';
+import { ClearIcon } from './icons';
interface Props {
className?: string;
size?: number;
}
-export default function DeleteIcon({ className, size = 12 }: Props) {
- return (
- <svg
- className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 14 14"
- width={size}
- height={size}>
- <path
- fill={theme.red}
- d="M14 11.27c0 .3-.1.58-.33.8l-1.6 1.6c-.22.22-.5.33-.8.33-.32 0-.6-.1-.8-.33L7 10.2l-3.46 3.47c-.22.22-.5.33-.8.33-.32 0-.6-.1-.8-.33l-1.6-1.6c-.23-.22-.34-.5-.34-.8 0-.32.1-.6.33-.8L3.8 7 .32 3.54C.1 3.32 0 3.04 0 2.74c0-.32.1-.6.33-.8l1.6-1.6c.22-.23.5-.34.8-.34.32 0 .6.1.8.33L7 3.8 10.46.32c.22-.22.5-.33.8-.33.32 0 .6.1.8.33l1.6 1.6c.23.22.34.5.34.8 0 .32-.1.6-.33.8L10.2 7l3.47 3.46c.22.22.33.5.33.8z"
- />
- </svg>
- );
+export default function DeleteIcon(props: Props) {
+ return <ClearIcon fill={theme.red} {...props} />;
}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function EditIcon({ className, size = 14 }: Props) {
+export default function EditIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 14 14"
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- fill="currentColor"
- d="M3.918 11.918l0.711-0.711-1.836-1.836-0.711 0.711v0.836h1v1h0.836zM8.004 4.668q0-0.172-0.172-0.172-0.078 0-0.133 0.055l-4.234 4.234q-0.055 0.055-0.055 0.133 0 0.172 0.172 0.172 0.078 0 0.133-0.055l4.234-4.234q0.055-0.055 0.055-0.133zM7.582 3.168l3.25 3.25-6.5 6.5h-3.25v-3.25zM12.918 3.918q0 0.414-0.289 0.703l-1.297 1.297-3.25-3.25 1.297-1.289q0.281-0.297 0.703-0.297 0.414 0 0.711 0.297l1.836 1.828q0.289 0.305 0.289 0.711z"
+ style={{ fill }}
+ d="M4.875 12.986l.721-.72-1.861-1.862-.721.72v.848h1.014v1.014h.847zm4.143-7.35c0-.117-.058-.175-.174-.175a.183.183 0 0 0-.135.056L4.416 9.81a.183.183 0 0 0-.056.135c0 .116.058.174.175.174a.183.183 0 0 0 .134-.056L8.962 5.77a.183.183 0 0 0 .056-.134zM8.59 4.115l3.295 3.295L5.295 14H2v-3.295l6.59-6.59zm5.41.76a.97.97 0 0 1-.293.713l-1.315 1.315-3.295-3.295L10.412 2.3c.19-.2.428-.301.713-.301.28 0 .52.1.72.301l1.862 1.853c.195.206.293.447.293.721z"
/>
</svg>
);
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import * as theme from '../../app/theme';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- fill?: string;
- size?: number;
-}
-
-export default function GroupIcon({ className, fill = '#aaa', size = 36 }: Props) {
+export default function GroupIcon({ className, fill = theme.gray67, size = 36 }: IconProps) {
return (
- <svg className={className} width={size} height={size} viewBox="0 0 36 36">
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 36 36"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<g transform="matrix(0.0625,0,0,0.0625,3,4)">
<path
- fill={fill}
+ style={{ fill }}
d="M148.25,224C121.25,224.833 99.167,235.5 82,256L48.5,256C34.833,256 23.333,252.625 14,245.875C4.667,239.125 0,229.25 0,216.25C0,157.417 10.333,128 31,128C32,128 35.625,129.75 41.875,133.25C48.125,136.75 56.25,140.292 66.25,143.875C76.25,147.458 86.167,149.25 96,149.25C107.167,149.25 118.25,147.333 129.25,143.5C128.417,149.667 128,155.167 128,160C128,183.167 134.75,204.5 148.25,224ZM416,383.25C416,403.25 409.917,419.042 397.75,430.625C385.583,442.208 369.417,448 349.25,448L130.75,448C110.583,448 94.417,442.208 82.25,430.625C70.083,419.042 64,403.25 64,383.25C64,374.417 64.292,365.792 64.875,357.375C65.458,348.958 66.625,339.875 68.375,330.125C70.125,320.375 72.333,311.333 75,303C77.667,294.667 81.25,286.542 85.75,278.625C90.25,270.708 95.417,263.958 101.25,258.375C107.083,252.792 114.208,248.333 122.625,245C131.042,241.667 140.333,240 150.5,240C152.167,240 155.75,241.792 161.25,245.375C166.75,248.958 172.833,252.958 179.5,257.375C186.167,261.792 195.083,265.792 206.25,269.375C217.417,272.958 228.667,274.75 240,274.75C251.333,274.75 262.583,272.958 273.75,269.375C284.917,265.792 293.833,261.792 300.5,257.375C307.167,252.958 313.25,248.958 318.75,245.375C324.25,241.792 327.833,240 329.5,240C339.667,240 348.958,241.667 357.375,245C365.792,248.333 372.917,252.792 378.75,258.375C384.583,263.958 389.75,270.708 394.25,278.625C398.75,286.542 402.333,294.667 405,303C407.667,311.333 409.875,320.375 411.625,330.125C413.375,339.875 414.542,348.958 415.125,357.375C415.708,365.792 416,374.417 416,383.25ZM160,64C160,81.667 153.75,96.75 141.25,109.25C128.75,121.75 113.667,128 96,128C78.333,128 63.25,121.75 50.75,109.25C38.25,96.75 32,81.667 32,64C32,46.333 38.25,31.25 50.75,18.75C63.25,6.25 78.333,0 96,0C113.667,0 128.75,6.25 141.25,18.75C153.75,31.25 160,46.333 160,64ZM336,160C336,186.5 326.625,209.125 307.875,227.875C289.125,246.625 266.5,256 240,256C213.5,256 190.875,246.625 172.125,227.875C153.375,209.125 144,186.5 144,160C144,133.5 153.375,110.875 172.125,92.125C190.875,73.375 213.5,64 240,64C266.5,64 289.125,73.375 307.875,92.125C326.625,110.875 336,133.5 336,160ZM480,216.25C480,229.25 475.333,239.125 466,245.875C456.667,252.625 445.167,256 431.5,256L398,256C380.833,235.5 358.75,224.833 331.75,224C345.25,204.5 352,183.167 352,160C352,155.167 351.583,149.667 350.75,143.5C361.75,147.333 372.833,149.25 384,149.25C393.833,149.25 403.75,147.458 413.75,143.875C423.75,140.292 431.875,136.75 438.125,133.25C444.375,129.75 448,128 449,128C469.667,128 480,157.417 480,216.25ZM448,64C448,81.667 441.75,96.75 429.25,109.25C416.75,121.75 401.667,128 384,128C366.333,128 351.25,121.75 338.75,109.25C326.25,96.75 320,81.667 320,64C320,46.333 326.25,31.25 338.75,18.75C351.25,6.25 366.333,0 384,0C401.667,0 416.75,6.25 429.25,18.75C441.75,31.25 448,46.333 448,64Z"
/>
</g>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- fill?: string;
- size?: number;
-}
-
-export default function HelpIcon({ className, fill = 'currentColor', size = 16 }: Props) {
+export default function HelpIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
- <svg className={className} viewBox="0 0 16 16" width={size} height={size}>
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<g transform="matrix(0.0364583,0,0,0.0364583,1,-0.166667)">
<path
- fill={fill}
+ style={{ fill }}
d="M224,344L224,296C224,293.667 223.25,291.75 221.75,290.25C220.25,288.75 218.333,288 216,288L168,288C165.667,288 163.75,288.75 162.25,290.25C160.75,291.75 160,293.667 160,296L160,344C160,346.333 160.75,348.25 162.25,349.75C163.75,351.25 165.667,352 168,352L216,352C218.333,352 220.25,351.25 221.75,349.75C223.25,348.25 224,346.333 224,344ZM288,176C288,161.333 283.375,147.75 274.125,135.25C264.875,122.75 253.333,113.083 239.5,106.25C225.667,99.417 211.5,96 197,96C156.5,96 125.583,113.75 104.25,149.25C101.75,153.25 102.417,156.75 106.25,159.75L139.25,184.75C140.417,185.75 142,186.25 144,186.25C146.667,186.25 148.75,185.25 150.25,183.25C159.083,171.917 166.25,164.25 171.75,160.25C177.417,156.25 184.583,154.25 193.25,154.25C201.25,154.25 208.375,156.417 214.625,160.75C220.875,165.083 224,170 224,175.5C224,181.833 222.333,186.917 219,190.75C215.667,194.583 210,198.333 202,202C191.5,206.667 181.875,213.875 173.125,223.625C164.375,233.375 160,243.833 160,255L160,264C160,266.333 160.75,268.25 162.25,269.75C163.75,271.25 165.667,272 168,272L216,272C218.333,272 220.25,271.25 221.75,269.75C223.25,268.25 224,266.333 224,264C224,260.833 225.792,256.708 229.375,251.625C232.958,246.542 237.5,242.417 243,239.25C248.333,236.25 252.417,233.875 255.25,232.125C258.083,230.375 261.917,227.458 266.75,223.375C271.583,219.292 275.292,215.292 277.875,211.375C280.458,207.458 282.792,202.417 284.875,196.25C286.958,190.083 288,183.333 288,176ZM384,224C384,258.833 375.417,290.958 358.25,320.375C341.083,349.792 317.792,373.083 288.375,390.25C258.958,407.417 226.833,416 192,416C157.167,416 125.042,407.417 95.625,390.25C66.208,373.083 42.917,349.792 25.75,320.375C8.583,290.958 0,258.833 0,224C0,189.167 8.583,157.042 25.75,127.625C42.917,98.208 66.208,74.917 95.625,57.75C125.042,40.583 157.167,32 192,32C226.833,32 258.958,40.583 288.375,57.75C317.792,74.917 341.083,98.208 358.25,127.625C375.417,157.042 384,189.167 384,224Z"
/>
</g>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function IconHistory({ className, size = 16 }: Props) {
+export default function IconHistory({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: 'currentColor' }}
+ style={{ fill }}
d="M14.7 3.4v3.3c0 .1 0 .2-.1.2s-.2 0-.3-.1l-.9-.9-4.8 4.8c-.1.1-.1.1-.2.1s-.1 0-.2-.1L6.4 9l-3.2 3.2-1.5-1.5 4.5-4.5c.1-.1.1-.1.2-.1s.1 0 .2.1L8.4 8l3.5-3.5-.9-1c-.1-.1-.1-.2-.1-.3s.1-.1.2-.1h3.3c.1 0 .1 0 .2.1.1 0 .1.1.1.2z"
/>
</svg>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function LinkIcon({ className, size = 14 }: Props) {
+export default function LinkIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
- <path
- fill="currentColor"
- d="M13.501 11.429q0-0.357-0.25-0.607l-1.857-1.857q-0.25-0.25-0.607-0.25-0.375 0-0.643 0.286 0.027 0.027 0.17 0.165t0.192 0.192 0.134 0.17 0.116 0.228 0.031 0.246q0 0.357-0.25 0.607t-0.607 0.25q-0.134 0-0.246-0.031t-0.228-0.116-0.17-0.134-0.192-0.192-0.165-0.17q-0.295 0.277-0.295 0.652 0 0.357 0.25 0.607l1.839 1.848q0.241 0.241 0.607 0.241 0.357 0 0.607-0.232l1.313-1.304q0.25-0.25 0.25-0.598zM7.224 5.134q0-0.357-0.25-0.607l-1.839-1.848q-0.25-0.25-0.607-0.25-0.348 0-0.607 0.241l-1.313 1.304q-0.25 0.25-0.25 0.598 0 0.357 0.25 0.607l1.857 1.857q0.241 0.241 0.607 0.241 0.375 0 0.643-0.277-0.027-0.027-0.17-0.165t-0.192-0.192-0.134-0.17-0.116-0.228-0.031-0.246q0-0.357 0.25-0.607t0.607-0.25q0.134 0 0.246 0.031t0.228 0.116 0.17 0.134 0.192 0.192 0.165 0.17q0.295-0.277 0.295-0.652zM15.215 11.429q0 1.071-0.759 1.813l-1.313 1.304q-0.741 0.741-1.813 0.741-1.080 0-1.821-0.759l-1.839-1.848q-0.741-0.741-0.741-1.813 0-1.098 0.786-1.866l-0.786-0.786q-0.768 0.786-1.857 0.786-1.071 0-1.821-0.75l-1.857-1.857q-0.75-0.75-0.75-1.821t0.759-1.813l1.313-1.304q0.741-0.741 1.813-0.741 1.080 0 1.821 0.759l1.839 1.848q0.741 0.741 0.741 1.813 0 1.098-0.786 1.866l0.786 0.786q0.768-0.786 1.857-0.786 1.071 0 1.821 0.75l1.857 1.857q0.75 0.75 0.75 1.821z"
- />
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <g transform="matrix(0.823497,0,0,0.823497,1.47008,1.4122)">
+ <path
+ style={{ fill }}
+ d="M13.501,11.429C13.501,11.191 13.418,10.989 13.251,10.822L11.394,8.965C11.227,8.798 11.025,8.715 10.787,8.715C10.537,8.715 10.323,8.81 10.144,9.001C10.162,9.019 10.219,9.074 10.314,9.166C10.409,9.258 10.473,9.322 10.506,9.358C10.539,9.394 10.583,9.451 10.64,9.528C10.697,9.605 10.735,9.681 10.756,9.756C10.777,9.831 10.787,9.913 10.787,10.002C10.787,10.24 10.704,10.442 10.537,10.609C10.37,10.776 10.168,10.859 9.93,10.859C9.841,10.859 9.759,10.849 9.684,10.828C9.609,10.807 9.533,10.769 9.456,10.712C9.379,10.655 9.322,10.611 9.286,10.578C9.25,10.545 9.186,10.481 9.094,10.386C9.002,10.291 8.947,10.234 8.929,10.216C8.732,10.401 8.634,10.618 8.634,10.868C8.634,11.106 8.717,11.308 8.884,11.475L10.723,13.323C10.884,13.484 11.086,13.564 11.33,13.564C11.568,13.564 11.77,13.487 11.937,13.332L13.25,12.028C13.417,11.861 13.5,11.662 13.5,11.43L13.501,11.429ZM7.224,5.134C7.224,4.896 7.141,4.694 6.974,4.527L5.135,2.679C4.968,2.512 4.766,2.429 4.528,2.429C4.296,2.429 4.094,2.509 3.921,2.67L2.608,3.974C2.441,4.141 2.358,4.34 2.358,4.572C2.358,4.81 2.441,5.012 2.608,5.179L4.465,7.036C4.626,7.197 4.828,7.277 5.072,7.277C5.322,7.277 5.536,7.185 5.715,7C5.697,6.982 5.64,6.927 5.545,6.835C5.45,6.743 5.386,6.679 5.353,6.643C5.32,6.607 5.276,6.55 5.219,6.473C5.162,6.396 5.124,6.32 5.103,6.245C5.082,6.17 5.072,6.088 5.072,5.999C5.072,5.761 5.155,5.559 5.322,5.392C5.489,5.225 5.691,5.142 5.929,5.142C6.018,5.142 6.1,5.152 6.175,5.173C6.25,5.194 6.326,5.232 6.403,5.289C6.48,5.346 6.537,5.39 6.573,5.423C6.609,5.456 6.673,5.52 6.765,5.615C6.857,5.71 6.912,5.767 6.93,5.785C7.127,5.6 7.225,5.383 7.225,5.133L7.224,5.134ZM15.215,11.429C15.215,12.143 14.962,12.747 14.456,13.242L13.143,14.546C12.649,15.04 12.045,15.287 11.33,15.287C10.61,15.287 10.003,15.034 9.509,14.528L7.67,12.68C7.176,12.186 6.929,11.582 6.929,10.867C6.929,10.135 7.191,9.513 7.715,9.001L6.929,8.215C6.417,8.739 5.798,9.001 5.072,9.001C4.358,9.001 3.751,8.751 3.251,8.251L1.394,6.394C0.894,5.894 0.644,5.287 0.644,4.573C0.644,3.859 0.897,3.255 1.403,2.76L2.716,1.456C3.21,0.962 3.814,0.715 4.529,0.715C5.249,0.715 5.856,0.968 6.35,1.474L8.189,3.322C8.683,3.816 8.93,4.42 8.93,5.135C8.93,5.867 8.668,6.489 8.144,7.001L8.93,7.787C9.442,7.263 10.061,7.001 10.787,7.001C11.501,7.001 12.108,7.251 12.608,7.751L14.465,9.608C14.965,10.108 15.215,10.715 15.215,11.429L15.215,11.429Z"
+ />
+ </g>
</svg>
);
}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*::
-type Props = { className?: string, size?: number };
-*/
-
-export default function ListIcon({ className, size = 16 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- className={className}
- height={size}
- width={size}
- viewBox="0 0 16 16">
- <path
- fill="currentColor"
- d="M15.045 11.526v1.007q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354zM15.045 8.506v1.006q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354zM15.045 5.487v1.006q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354zM15.045 2.468v1.006q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function ListIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M15.045 11.526v1.007q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354zM15.045 8.506v1.006q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354zM15.045 5.487v1.006q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354zM15.045 2.468v1.006q0 0.204-0.149 0.354t-0.354 0.149h-13.084q-0.204 0-0.354-0.149t-0.149-0.354v-1.006q0-0.204 0.149-0.354t0.354-0.149h13.084q0.204 0 0.354 0.149t0.149 0.354z"
+ />
+ </svg>
+ );
+}
*/
import * as React from 'react';
import * as theme from '../../app/theme';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- color?: string;
- size?: number;
-}
-
-export default function LongLivingBranchIcon({ className, color = theme.blue, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function LongLivingBranchIcon({
+ className,
+ fill = theme.blue,
+ size = 16
+}: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<g transform="translate(5, 0)">
<path
- style={{ fill: color }}
+ style={{ fill }}
d="M4.5 8c0-.9-.6-1.7-1.5-1.9V4c.9-.2 1.5-1 1.5-1.9 0-1.1-.9-2-2-2s-2 .9-2 2C.5 3 1.1 3.8 2 4v2.1C1.1 6.3.5 7.1.5 8s.6 1.7 1.5 2v2.1c-.9.2-1.5 1-1.5 1.9 0 1.1.9 2 2 2s2-.9 2-2c0-.9-.6-1.7-1.5-1.9V10c.9-.3 1.5-1 1.5-2zm-3-5.9c0-.6.4-1 1-1s1 .4 1 1-.4 1-1 1-1-.5-1-1zm0 5.9c0-.6.4-1 1-1s1 .4 1 1-.4 1-1 1-1-.4-1-1zm2 6c0 .6-.4 1-1 1s-1-.4-1-1 .4-1 1-1 1 .5 1 1z"
/>
</g>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
+interface Props extends IconProps {
open: boolean;
- size?: number;
}
-export default function OpenCloseIcon({ className, open, size = 14 }: Props) {
+export default function OpenCloseIcon({
+ className,
+ fill = 'currentColor',
+ open,
+ size = 14
+}: Props) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
width={size}
height={size}
- style={{ fill: 'currentColor' }}>
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
{open ? (
- <path d="M13.506 9.289l-5.191 5.184q-0.133 0.133-0.315 0.133t-0.315-0.133l-5.191-5.184q-0.133-0.133-0.133-0.318t0.133-0.318l1.161-1.154q0.133-0.133 0.315-0.133t0.315 0.133l3.715 3.715 3.715-3.715q0.133-0.133 0.315-0.133t0.315 0.133l1.161 1.154q0.133 0.133 0.133 0.318t-0.133 0.318z" />
+ <path
+ style={{ fill }}
+ d="M13.506 9.289l-5.191 5.184q-0.133 0.133-0.315 0.133t-0.315-0.133l-5.191-5.184q-0.133-0.133-0.133-0.318t0.133-0.318l1.161-1.154q0.133-0.133 0.315-0.133t0.315 0.133l3.715 3.715 3.715-3.715q0.133-0.133 0.315-0.133t0.315 0.133l1.161 1.154q0.133 0.133 0.133 0.318t-0.133 0.318z"
+ />
) : (
- <path d="M13.527 9.318l-5.244 5.244q-0.134 0.134-0.318 0.134t-0.318-0.134l-1.173-1.173q-0.134-0.134-0.134-0.318t0.134-0.318l3.753-3.753-3.753-3.753q-0.134-0.134-0.134-0.318t0.134-0.318l1.173-1.173q0.134-0.134 0.318-0.134t0.318 0.134l5.244 5.244q0.134 0.134 0.134 0.318t-0.134 0.318z" />
+ <path
+ style={{ fill }}
+ d="M13.527 9.318l-5.244 5.244q-0.134 0.134-0.318 0.134t-0.318-0.134l-1.173-1.173q-0.134-0.134-0.134-0.318t0.134-0.318l3.753-3.753-3.753-3.753q-0.134-0.134-0.134-0.318t0.134-0.318l1.173-1.173q0.134-0.134 0.318-0.134t0.318 0.134l5.244 5.244q0.134 0.134 0.134 0.318t-0.134 0.318z"
+ />
)}
</svg>
);
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-import * as theme from '../../app/theme';
-
-/*::
-type Props = { className?: string, size?: number };
-*/
-
-export default function OrganizationIcon({ className, size = 16 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- className={className}
- height={size}
- width={size}
- viewBox="0 0 16 16">
- <path
- style={{ fill: theme.blue }}
- d="M13.5 6c-.4 0-.7.1-1.1.2L11 4.8v-.3C11 3.1 9.9 2 8.5 2S6 3.1 6 4.5v.2L4.5 6.2c-.3-.1-.7-.2-1-.2C2.1 6 1 7.1 1 8.5S2.1 11 3.5 11 6 9.9 6 8.5c0-.7-.3-1.3-.7-1.7l1-1c.4.6 1 1 1.7 1.1V9c-1.1.2-2 1.2-2 2.4C6 12.9 7.1 14 8.5 14s2.5-1.1 2.5-2.5c0-1.2-.9-2.2-2-2.4V6.9c.7-.1 1.2-.5 1.6-1.1l1 1c-.4.4-.6 1-.6 1.6 0 1.4 1.1 2.5 2.5 2.5s2.5-1 2.5-2.4S14.9 6 13.5 6zm-10 4C2.7 10 2 9.3 2 8.5S2.7 7 3.5 7 5 7.7 5 8.5 4.3 10 3.5 10zm6.5 1.5c0 .8-.7 1.5-1.5 1.5S7 12.3 7 11.5 7.7 10 8.5 10s1.5.7 1.5 1.5zM8.5 6C7.7 6 7 5.3 7 4.5S7.7 3 8.5 3s1.5.7 1.5 1.5S9.3 6 8.5 6zm5 4c-.8 0-1.5-.7-1.5-1.5S12.7 7 13.5 7s1.5.7 1.5 1.5-.7 1.5-1.5 1.5z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import * as theme from '../../app/theme';
+import { IconProps } from './types';
+
+export default function OrganizationIcon({ className, fill = theme.blue, size = 16 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M13.5 6c-.4 0-.7.1-1.1.2L11 4.8v-.3C11 3.1 9.9 2 8.5 2S6 3.1 6 4.5v.2L4.5 6.2c-.3-.1-.7-.2-1-.2C2.1 6 1 7.1 1 8.5S2.1 11 3.5 11 6 9.9 6 8.5c0-.7-.3-1.3-.7-1.7l1-1c.4.6 1 1 1.7 1.1V9c-1.1.2-2 1.2-2 2.4C6 12.9 7.1 14 8.5 14s2.5-1.1 2.5-2.5c0-1.2-.9-2.2-2-2.4V6.9c.7-.1 1.2-.5 1.6-1.1l1 1c-.4.4-.6 1-.6 1.6 0 1.4 1.1 2.5 2.5 2.5s2.5-1 2.5-2.4S14.9 6 13.5 6zm-10 4C2.7 10 2 9.3 2 8.5S2.7 7 3.5 7 5 7.7 5 8.5 4.3 10 3.5 10zm6.5 1.5c0 .8-.7 1.5-1.5 1.5S7 12.3 7 11.5 7.7 10 8.5 10s1.5.7 1.5 1.5zM8.5 6C7.7 6 7 5.3 7 4.5S7.7 3 8.5 3s1.5.7 1.5 1.5S9.3 6 8.5 6zm5 4c-.8 0-1.5-.7-1.5-1.5S12.7 7 13.5 7s1.5.7 1.5 1.5-.7 1.5-1.5 1.5z"
+ />
+ </svg>
+ );
+}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
-import * as classNames from 'classnames';
+import * as theme from '../../app/theme';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function PendingIcon({ className, size = 16 }: Props) {
+export default function PendingIcon({ className, fill = theme.gray67, size = 16 }: IconProps) {
return (
<svg
- className={classNames('icon-pending', className)}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
+ className={className}
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<g transform="matrix(0.0364583,0,0,0.0364583,1,-0.166667)">
- <path d="M224,136L224,248C224,250.333 223.25,252.25 221.75,253.75C220.25,255.25 218.333,256 216,256L136,256C133.667,256 131.75,255.25 130.25,253.75C128.75,252.25 128,250.333 128,248L128,232C128,229.667 128.75,227.75 130.25,226.25C131.75,224.75 133.667,224 136,224L192,224L192,136C192,133.667 192.75,131.75 194.25,130.25C195.75,128.75 197.667,128 200,128L216,128C218.333,128 220.25,128.75 221.75,130.25C223.25,131.75 224,133.667 224,136ZM328,224C328,199.333 321.917,176.583 309.75,155.75C297.583,134.917 281.083,118.417 260.25,106.25C239.417,94.083 216.667,88 192,88C167.333,88 144.583,94.083 123.75,106.25C102.917,118.417 86.417,134.917 74.25,155.75C62.083,176.583 56,199.333 56,224C56,248.667 62.083,271.417 74.25,292.25C86.417,313.083 102.917,329.583 123.75,341.75C144.583,353.917 167.333,360 192,360C216.667,360 239.417,353.917 260.25,341.75C281.083,329.583 297.583,313.083 309.75,292.25C321.917,271.417 328,248.667 328,224ZM384,224C384,258.833 375.417,290.958 358.25,320.375C341.083,349.792 317.792,373.083 288.375,390.25C258.958,407.417 226.833,416 192,416C157.167,416 125.042,407.417 95.625,390.25C66.208,373.083 42.917,349.792 25.75,320.375C8.583,290.958 0,258.833 0,224C0,189.167 8.583,157.042 25.75,127.625C42.917,98.208 66.208,74.917 95.625,57.75C125.042,40.583 157.167,32 192,32C226.833,32 258.958,40.583 288.375,57.75C317.792,74.917 341.083,98.208 358.25,127.625C375.417,157.042 384,189.167 384,224Z" />
+ <path
+ style={{ fill }}
+ d="M224,136L224,248C224,250.333 223.25,252.25 221.75,253.75C220.25,255.25 218.333,256 216,256L136,256C133.667,256 131.75,255.25 130.25,253.75C128.75,252.25 128,250.333 128,248L128,232C128,229.667 128.75,227.75 130.25,226.25C131.75,224.75 133.667,224 136,224L192,224L192,136C192,133.667 192.75,131.75 194.25,130.25C195.75,128.75 197.667,128 200,128L216,128C218.333,128 220.25,128.75 221.75,130.25C223.25,131.75 224,133.667 224,136ZM328,224C328,199.333 321.917,176.583 309.75,155.75C297.583,134.917 281.083,118.417 260.25,106.25C239.417,94.083 216.667,88 192,88C167.333,88 144.583,94.083 123.75,106.25C102.917,118.417 86.417,134.917 74.25,155.75C62.083,176.583 56,199.333 56,224C56,248.667 62.083,271.417 74.25,292.25C86.417,313.083 102.917,329.583 123.75,341.75C144.583,353.917 167.333,360 192,360C216.667,360 239.417,353.917 260.25,341.75C281.083,329.583 297.583,313.083 309.75,292.25C321.917,271.417 328,248.667 328,224ZM384,224C384,258.833 375.417,290.958 358.25,320.375C341.083,349.792 317.792,373.083 288.375,390.25C258.958,407.417 226.833,416 192,416C157.167,416 125.042,407.417 95.625,390.25C66.208,373.083 42.917,349.792 25.75,320.375C8.583,290.958 0,258.833 0,224C0,189.167 8.583,157.042 25.75,127.625C42.917,98.208 66.208,74.917 95.625,57.75C125.042,40.583 157.167,32 192,32C226.833,32 258.958,40.583 288.375,57.75C317.792,74.917 341.083,98.208 358.25,127.625C375.417,157.042 384,189.167 384,224Z"
+ />
</g>
</svg>
);
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*::
-type Props = { className?: string, size?: number };
-*/
-
-export default function ProjectEventIcon({ className, size = 14 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
- width={size}
- height={size}>
- <path
- style={{ fill: '#fff', stroke: 'currentColor', strokeWidth: '2px' }}
- d="M8 2 L14 8 L8 14 L2 8 L8 2 L14 8"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+
+interface Props {
+ className?: string;
+ size?: number;
+}
+
+export default function ProjectEventIcon({ className, size = 14 }: Props) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill: '#fff', stroke: 'currentColor', strokeWidth: '2px' }}
+ d="M8 2 L14 8 L8 14 L2 8 L8 2 L14 8"
+ />
+ </svg>
+ );
+}
*/
import * as React from 'react';
import * as theme from '../../app/theme';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- color?: string;
- size?: number;
-}
-
-export default function PullRequestIcon({ className, color = theme.blue, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function PullRequestIcon({ className, fill = theme.blue, size = 16 }: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: color }}
+ style={{ fill }}
d="M3 11.9V4.1c.9-.2 1.5-1 1.5-1.9 0-1.1-.9-2-2-2s-2 .9-2 2c0 .9.6 1.7 1.5 1.9v7.8c-.9.2-1.5 1-1.5 1.9 0 1.1.9 2 2 2s2-.9 2-2c0-.9-.6-1.6-1.5-1.9zM1.5 2.2c0-.6.4-1 1-1s1 .4 1 1-.4 1-1 1-1-.4-1-1zm1 12.7c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1zM14 11.9V5.5c0-.1-.2-3.1-5.1-3.5L10.1.8 9.5.1 6.9 2.6l2.6 2.5.7-.7L8.8 3c4 .2 4.2 2.4 4.2 2.5v6.4c-.9.2-1.5 1-1.5 1.9 0 1.1.9 2 2 2s2-.9 2-2c0-.9-.6-1.6-1.5-1.9zm-.5 3c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1z"
/>
</svg>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- fill?: string;
- size?: number;
- style?: React.CSSProperties;
-}
-
-export default function SettingsIcon({
- className,
- fill = 'currentColor',
- size = 14,
- style
-}: Props) {
+export default function SettingsIcon({ className, fill = 'currentColor', size = 14 }: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 14 14"
width={size}
height={size}
- style={style}>
+ viewBox="0 0 14 14"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<g transform="matrix(0.0364583,0,0,0.0364583,0,-1.16667)">
<path
- d="M256,224C256,206.333 249.75,191.25 237.25,178.75C224.75,166.25 209.667,160 192,160C174.333,160 159.25,166.25 146.75,178.75C134.25,191.25 128,206.333 128,224C128,241.667 134.25,256.75 146.75,269.25C159.25,281.75 174.333,288 192,288C209.667,288 224.75,281.75 237.25,269.25C249.75,256.75 256,241.667 256,224ZM384,196.75L384,252.25C384,254.25 383.333,256.167 382,258C380.667,259.833 379,260.917 377,261.25L330.75,268.25C327.583,277.25 324.333,284.833 321,291C326.833,299.333 335.75,310.833 347.75,325.5C349.417,327.5 350.25,329.583 350.25,331.75C350.25,333.917 349.5,335.833 348,337.5C343.5,343.667 335.25,352.667 323.25,364.5C311.25,376.333 303.417,382.25 299.75,382.25C297.75,382.25 295.583,381.5 293.25,380L258.75,353C251.417,356.833 243.833,360 236,362.5C233.333,385.167 230.917,400.667 228.75,409C227.583,413.667 224.583,416 219.75,416L164.25,416C161.917,416 159.875,415.292 158.125,413.875C156.375,412.458 155.417,410.667 155.25,408.5L148.25,362.5C140.083,359.833 132.583,356.75 125.75,353.25L90.5,380C88.833,381.5 86.75,382.25 84.25,382.25C81.917,382.25 79.833,381.333 78,379.5C57,360.5 43.25,346.5 36.75,337.5C35.583,335.833 35,333.917 35,331.75C35,329.75 35.667,327.833 37,326C39.5,322.5 43.75,316.958 49.75,309.375C55.75,301.792 60.25,295.917 63.25,291.75C58.75,283.417 55.333,275.167 53,267L7.25,260.25C5.083,259.917 3.333,258.875 2,257.125C0.667,255.375 0,253.417 0,251.25L0,195.75C0,193.75 0.667,191.833 2,190C3.333,188.167 4.917,187.083 6.75,186.75L53.25,179.75C55.583,172.083 58.833,164.417 63,156.75C56.333,147.25 47.417,135.75 36.25,122.25C34.583,120.25 33.75,118.25 33.75,116.25C33.75,114.583 34.5,112.667 36,110.5C40.333,104.5 48.542,95.542 60.625,83.625C72.708,71.708 80.583,65.75 84.25,65.75C86.417,65.75 88.583,66.583 90.75,68.25L125.25,95C132.583,91.167 140.167,88 148,85.5C150.667,62.833 153.083,47.333 155.25,39C156.417,34.333 159.417,32 164.25,32L219.75,32C222.083,32 224.125,32.708 225.875,34.125C227.625,35.542 228.583,37.333 228.75,39.5L235.75,85.5C243.917,88.167 251.417,91.25 258.25,94.75L293.75,68C295.25,66.5 297.25,65.75 299.75,65.75C301.917,65.75 304,66.583 306,68.25C327.5,88.083 341.25,102.25 347.25,110.75C348.417,112.083 349,113.917 349,116.25C349,118.25 348.333,120.167 347,122C344.5,125.5 340.25,131.042 334.25,138.625C328.25,146.208 323.75,152.083 320.75,156.25C325.083,164.583 328.5,172.75 331,180.75L376.75,187.75C378.917,188.083 380.667,189.125 382,190.875C383.333,192.625 384,194.583 384,196.75Z"
style={{ fill }}
+ d="M256,224C256,206.333 249.75,191.25 237.25,178.75C224.75,166.25 209.667,160 192,160C174.333,160 159.25,166.25 146.75,178.75C134.25,191.25 128,206.333 128,224C128,241.667 134.25,256.75 146.75,269.25C159.25,281.75 174.333,288 192,288C209.667,288 224.75,281.75 237.25,269.25C249.75,256.75 256,241.667 256,224ZM384,196.75L384,252.25C384,254.25 383.333,256.167 382,258C380.667,259.833 379,260.917 377,261.25L330.75,268.25C327.583,277.25 324.333,284.833 321,291C326.833,299.333 335.75,310.833 347.75,325.5C349.417,327.5 350.25,329.583 350.25,331.75C350.25,333.917 349.5,335.833 348,337.5C343.5,343.667 335.25,352.667 323.25,364.5C311.25,376.333 303.417,382.25 299.75,382.25C297.75,382.25 295.583,381.5 293.25,380L258.75,353C251.417,356.833 243.833,360 236,362.5C233.333,385.167 230.917,400.667 228.75,409C227.583,413.667 224.583,416 219.75,416L164.25,416C161.917,416 159.875,415.292 158.125,413.875C156.375,412.458 155.417,410.667 155.25,408.5L148.25,362.5C140.083,359.833 132.583,356.75 125.75,353.25L90.5,380C88.833,381.5 86.75,382.25 84.25,382.25C81.917,382.25 79.833,381.333 78,379.5C57,360.5 43.25,346.5 36.75,337.5C35.583,335.833 35,333.917 35,331.75C35,329.75 35.667,327.833 37,326C39.5,322.5 43.75,316.958 49.75,309.375C55.75,301.792 60.25,295.917 63.25,291.75C58.75,283.417 55.333,275.167 53,267L7.25,260.25C5.083,259.917 3.333,258.875 2,257.125C0.667,255.375 0,253.417 0,251.25L0,195.75C0,193.75 0.667,191.833 2,190C3.333,188.167 4.917,187.083 6.75,186.75L53.25,179.75C55.583,172.083 58.833,164.417 63,156.75C56.333,147.25 47.417,135.75 36.25,122.25C34.583,120.25 33.75,118.25 33.75,116.25C33.75,114.583 34.5,112.667 36,110.5C40.333,104.5 48.542,95.542 60.625,83.625C72.708,71.708 80.583,65.75 84.25,65.75C86.417,65.75 88.583,66.583 90.75,68.25L125.25,95C132.583,91.167 140.167,88 148,85.5C150.667,62.833 153.083,47.333 155.25,39C156.417,34.333 159.417,32 164.25,32L219.75,32C222.083,32 224.125,32.708 225.875,34.125C227.625,35.542 228.583,37.333 228.75,39.5L235.75,85.5C243.917,88.167 251.417,91.25 258.25,94.75L293.75,68C295.25,66.5 297.25,65.75 299.75,65.75C301.917,65.75 304,66.583 306,68.25C327.5,88.083 341.25,102.25 347.25,110.75C348.417,112.083 349,113.917 349,116.25C349,118.25 348.333,120.167 347,122C344.5,125.5 340.25,131.042 334.25,138.625C328.25,146.208 323.75,152.083 320.75,156.25C325.083,164.583 328.5,172.75 331,180.75L376.75,187.75C378.917,188.083 380.667,189.125 382,190.875C383.333,192.625 384,194.583 384,196.75Z"
/>
</g>
</svg>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
import * as theme from '../../app/theme';
-interface Props {
- className?: string;
- color?: string;
- size?: number;
-}
-
-export default function ShortLivingBranchIcon({ className, color = theme.blue, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function ShortLivingBranchIcon({
+ className,
+ fill = theme.blue,
+ size = 16
+}: IconProps) {
return (
<svg
- xmlns="http://www.w3.org/2000/svg"
className={className}
- height={size}
width={size}
- viewBox="0 0 16 16">
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<g transform="translate(3, 0)">
<path
- style={{ fill: color }}
+ style={{ fill }}
d="M9.5 6.5c0-1.1-.9-2-2-2s-2 .9-2 2c0 .8.5 1.5 1.2 1.8-.3.6-.7 1.1-1.2 1.4-.9.5-1.9.5-2.5.4V4c.9-.2 1.5-1 1.5-1.9 0-1.1-.9-2-2-2s-2 .9-2 2C.5 3 1.1 3.8 2 4v8c-.9.2-1.5 1-1.5 1.9 0 1.1.9 2 2 2s2-.9 2-2c0-.9-.6-1.7-1.5-1.9v-1c.2 0 .5.1.7.1.7 0 1.5-.1 2.2-.6.8-.5 1.4-1.2 1.7-2.1 1.1 0 1.9-.9 1.9-1.9zm-8-4.4c0-.6.4-1 1-1s1 .4 1 1-.4 1-1 1-1-.5-1-1zm2 11.9c0 .6-.4 1-1 1s-1-.4-1-1 .4-1 1-1 1 .4 1 1zm4-6.5c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1z"
/>
</g>
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*::
-type Props = { className?: string, size?: number };
-*/
-
-export default function SortAscIcon({ className, size = 16 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
- width={size}
- height={size}>
- <path
- style={{ fill: 'currentColor' }}
- d="M6.571 12.857q0 0.107-0.089 0.214l-2.848 2.848q-0.089 0.080-0.205 0.080-0.107 0-0.205-0.080l-2.857-2.857q-0.134-0.143-0.063-0.313 0.071-0.179 0.268-0.179h1.714v-12.286q0-0.125 0.080-0.205t0.205-0.080h1.714q0.125 0 0.205 0.080t0.080 0.205v12.286h1.714q0.125 0 0.205 0.080t0.080 0.205zM16 14v1.714q0 0.125-0.080 0.205t-0.205 0.080h-7.429q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h7.429q0.125 0 0.205 0.080t0.080 0.205zM14.286 9.429v1.714q0 0.125-0.080 0.205t-0.205 0.080h-5.714q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h5.714q0.125 0 0.205 0.080t0.080 0.205zM12.571 4.857v1.714q0 0.125-0.080 0.205t-0.205 0.080h-4q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h4q0.125 0 0.205 0.080t0.080 0.205zM10.857 0.286v1.714q0 0.125-0.080 0.205t-0.205 0.080h-2.286q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h2.286q0.125 0 0.205 0.080t0.080 0.205z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function SortAscIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M6.571 12.857q0 0.107-0.089 0.214l-2.848 2.848q-0.089 0.080-0.205 0.080-0.107 0-0.205-0.080l-2.857-2.857q-0.134-0.143-0.063-0.313 0.071-0.179 0.268-0.179h1.714v-12.286q0-0.125 0.080-0.205t0.205-0.080h1.714q0.125 0 0.205 0.080t0.080 0.205v12.286h1.714q0.125 0 0.205 0.080t0.080 0.205zM16 14v1.714q0 0.125-0.080 0.205t-0.205 0.080h-7.429q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h7.429q0.125 0 0.205 0.080t0.080 0.205zM14.286 9.429v1.714q0 0.125-0.080 0.205t-0.205 0.080h-5.714q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h5.714q0.125 0 0.205 0.080t0.080 0.205zM12.571 4.857v1.714q0 0.125-0.080 0.205t-0.205 0.080h-4q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h4q0.125 0 0.205 0.080t0.080 0.205zM10.857 0.286v1.714q0 0.125-0.080 0.205t-0.205 0.080h-2.286q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h2.286q0.125 0 0.205 0.080t0.080 0.205z"
+ />
+ </svg>
+ );
+}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*::
-type Props = { className?: string, size?: number };
-*/
-
-export default function SortDescIcon({ className, size = 16 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
- width={size}
- height={size}>
- <path
- style={{ fill: 'currentColor' }}
- d="M10.857 14v1.714q0 0.125-0.080 0.205t-0.205 0.080h-2.286q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h2.286q0.125 0 0.205 0.080t0.080 0.205zM6.571 12.857q0 0.107-0.089 0.214l-2.848 2.848q-0.089 0.080-0.205 0.080-0.107 0-0.205-0.080l-2.857-2.857q-0.134-0.143-0.063-0.313 0.071-0.179 0.268-0.179h1.714v-12.286q0-0.125 0.080-0.205t0.205-0.080h1.714q0.125 0 0.205 0.080t0.080 0.205v12.286h1.714q0.125 0 0.205 0.080t0.080 0.205zM12.571 9.429v1.714q0 0.125-0.080 0.205t-0.205 0.080h-4q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h4q0.125 0 0.205 0.080t0.080 0.205zM14.286 4.857v1.714q0 0.125-0.080 0.205t-0.205 0.080h-5.714q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h5.714q0.125 0 0.205 0.080t0.080 0.205zM16 0.286v1.714q0 0.125-0.080 0.205t-0.205 0.080h-7.429q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h7.429q0.125 0 0.205 0.080t0.080 0.205z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function SortDescIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M10.857 14v1.714q0 0.125-0.080 0.205t-0.205 0.080h-2.286q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h2.286q0.125 0 0.205 0.080t0.080 0.205zM6.571 12.857q0 0.107-0.089 0.214l-2.848 2.848q-0.089 0.080-0.205 0.080-0.107 0-0.205-0.080l-2.857-2.857q-0.134-0.143-0.063-0.313 0.071-0.179 0.268-0.179h1.714v-12.286q0-0.125 0.080-0.205t0.205-0.080h1.714q0.125 0 0.205 0.080t0.080 0.205v12.286h1.714q0.125 0 0.205 0.080t0.080 0.205zM12.571 9.429v1.714q0 0.125-0.080 0.205t-0.205 0.080h-4q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h4q0.125 0 0.205 0.080t0.080 0.205zM14.286 4.857v1.714q0 0.125-0.080 0.205t-0.205 0.080h-5.714q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h5.714q0.125 0 0.205 0.080t0.080 0.205zM16 0.286v1.714q0 0.125-0.080 0.205t-0.205 0.080h-7.429q-0.125 0-0.205-0.080t-0.080-0.205v-1.714q0-0.125 0.080-0.205t0.205-0.080h7.429q0.125 0 0.205 0.080t0.080 0.205z"
+ />
+ </svg>
+ );
+}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*:: type Props = { className?: string, size?: number }; */
-
-export default function TreeIcon({ className, size = 16 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- className={className}
- height={size}
- width={size}
- viewBox="0 0 16 16">
- <path
- fill="currentColor"
- d="M15.045 2.467c0-0.277-0.225-0.503-0.503-0.503h-13.084c-0.277 0-0.503 0.225-0.503 0.503v1.007c0 0.277 0.225 0.503 0.503 0.503h13.084c0.277 0 0.503-0.225 0.503-0.503v-1.007zM15.045 5.487c0-0.277-0.194-0.503-0.432-0.503h-11.216c-0.238 0-0.432 0.225-0.432 0.503v1.007c0 0.277 0.193 0.503 0.432 0.503h11.216c0.238 0 0.432-0.225 0.432-0.503v-1.007zM15.045 8.506c0-0.277-0.161-0.503-0.359-0.503h-9.346c-0.198 0-0.359 0.225-0.359 0.503v1.007c0 0.277 0.161 0.503 0.359 0.503h9.346c0.198 0 0.359-0.225 0.359-0.503v-1.007zM15.045 11.527c0-0.277-0.129-0.503-0.287-0.503h-7.477c-0.159 0-0.288 0.225-0.288 0.503v1.007c0 0.277 0.129 0.503 0.288 0.503h7.477c0.159 0 0.287-0.225 0.287-0.503v-1.007z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function TreeIcon({ className, fill = 'currentColor', size = 16 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M15.045 2.467c0-0.277-0.225-0.503-0.503-0.503h-13.084c-0.277 0-0.503 0.225-0.503 0.503v1.007c0 0.277 0.225 0.503 0.503 0.503h13.084c0.277 0 0.503-0.225 0.503-0.503v-1.007zM15.045 5.487c0-0.277-0.194-0.503-0.432-0.503h-11.216c-0.238 0-0.432 0.225-0.432 0.503v1.007c0 0.277 0.193 0.503 0.432 0.503h11.216c0.238 0 0.432-0.225 0.432-0.503v-1.007zM15.045 8.506c0-0.277-0.161-0.503-0.359-0.503h-9.346c-0.198 0-0.359 0.225-0.359 0.503v1.007c0 0.277 0.161 0.503 0.359 0.503h9.346c0.198 0 0.359-0.225 0.359-0.503v-1.007zM15.045 11.527c0-0.277-0.129-0.503-0.287-0.503h-7.477c-0.159 0-0.288 0.225-0.288 0.503v1.007c0 0.277 0.129 0.503 0.288 0.503h7.477c0.159 0 0.287-0.225 0.287-0.503v-1.007z"
+ />
+ </svg>
+ );
+}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-/*:: type Props = { className?: string, size?: number }; */
-
-export default function TreemapIcon({ className, size = 14 } /*: Props */) {
- /* eslint-disable max-len */
- return (
- <svg
- className={className}
- height={size}
- width={size}
- viewBox="0 0 16 16"
- fillRule="evenodd"
- clipRule="evenodd"
- strokeLinejoin="round"
- strokeMiterlimit="1.414">
- <path
- fill="currentColor"
- d="M0 0h8v16h-8zM9.143 0h6.857v9.143h-6.857zM9.143 10.286h6.857v5.714h-6.857z"
- />
- </svg>
- );
-}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as React from 'react';
+import { IconProps } from './types';
+
+export default function TreemapIcon({ className, fill = 'currentColor', size = 14 }: IconProps) {
+ return (
+ <svg
+ className={className}
+ width={size}
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
+ <path
+ style={{ fill }}
+ d="M0 0h8v16h-8zM9.143 0h6.857v9.143h-6.857zM9.143 10.286h6.857v5.714h-6.857z"
+ />
+ </svg>
+ );
+}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { IconProps } from './types';
-interface Props {
- className?: string;
- size?: number;
-}
-
-export default function VulnerabilityIcon({ className, size = 16 }: Props) {
- /* eslint-disable max-len */
+export default function VulnerabilityIcon({
+ className,
+ fill = 'currentColor',
+ size = 16
+}: IconProps) {
return (
<svg
className={className}
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 16 16"
width={size}
- height={size}>
+ height={size}
+ viewBox="0 0 16 16"
+ version="1.1"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ xmlSpace="preserve">
<path
- style={{ fill: 'currentColor' }}
+ style={{ fill }}
d="M10.8 5H6V3.9a2.28 2.28 0 0 1 2-2.5 2.22 2.22 0 0 1 1.8 1.2.48.48 0 0 0 .7.2.48.48 0 0 0 .2-.7A3 3 0 0 0 8 .4a3.34 3.34 0 0 0-3 3.5v1.2a2.16 2.16 0 0 0-2 2.1v4.4a2.22 2.22 0 0 0 2.2 2.2h5.6a2.22 2.22 0 0 0 2.2-2.2V7.2A2.22 2.22 0 0 0 10.8 5zm-2.2 5.5v1.2H7.4v-1.2a1.66 1.66 0 0 1-1.1-1.6A1.75 1.75 0 0 1 8 7.2a1.71 1.71 0 0 1 .6 3.3z"
/>
</svg>
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:contact 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.
+ */
+export default function ClearIcon() {
+ return null;
+}
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import _AlertErrorIcon from './AlertErrorIcon';
-import _AlertWarnIcon from './AlertWarnIcon';
-import _BranchIcon from './BranchIcon';
-import _BubblesIcon from './BubblesIcon';
-import _BugIcon from './BugIcon';
-import _ChangeIcon from './ChangeIcon';
-import _ChartLegendIcon from './ChartLegendIcon';
-import _CheckIcon from './CheckIcon';
-import _CloseIcon from './CloseIcon';
-import _CodeSmellIcon from './CodeSmellIcon';
-import _DeleteIcon from './DeleteIcon';
-import _FavoriteIcon from './FavoriteIcon';
-import _HelpIcon from './HelpIcon';
-import _HistoryIcon from './HistoryIcon';
-import _LinkIcon from './LinkIcon';
-import _ListIcon from './ListIcon';
-import _LongLivingBranchIcon from './LongLivingBranchIcon';
-import _OpenCloseIcon from './OpenCloseIcon';
-import _OrganizationIcon from './OrganizationIcon';
-import _PendingIcon from './PendingIcon';
-import _ProjectEventIcon from './ProjectEventIcon';
-import _PullRequestIcon from './PullRequestIcon';
-import _QualifierIcon from './QualifierIcon';
-import _ShortLivingBranchIcon from './ShortLivingBranchIcon';
-import _SortAscIcon from './SortAscIcon';
-import _SortDescIcon from './SortDescIcon';
-import _TreeIcon from './TreeIcon';
-import _TreemapIcon from './TreemapIcon';
-import _VulnerabilityIcon from './VulnerabilityIcon';
-
-export const AlertErrorIcon = _AlertErrorIcon;
-export const AlertWarnIcon = _AlertWarnIcon;
-export const BranchIcon = _BranchIcon;
-export const BubblesIcon = _BubblesIcon;
-export const BugIcon = _BugIcon;
-export const ChangeIcon = _ChangeIcon;
-export const ChartLegendIcon = _ChartLegendIcon;
-export const CheckIcon = _CheckIcon;
-export const CloseIcon = _CloseIcon;
-export const CodeSmellIcon = _CodeSmellIcon;
-export const DeleteIcon = _DeleteIcon;
-export const FavoriteIcon = _FavoriteIcon;
-export const HelpIcon = _HelpIcon;
-export const HistoryIcon = _HistoryIcon;
-export const LinkIcon = _LinkIcon;
-export const ListIcon = _ListIcon;
-export const LongLivingBranchIcon = _LongLivingBranchIcon;
-export const OpenCloseIcon = _OpenCloseIcon;
-export const OrganizationIcon = _OrganizationIcon;
-export const PendingIcon = _PendingIcon;
-export const ProjectEventIcon = _ProjectEventIcon;
-export const PullRequestIcon = _PullRequestIcon;
-export const QualifierIcon = _QualifierIcon;
-export const ShortLivingBranchIcon = _ShortLivingBranchIcon;
-export const SortAscIcon = _SortAscIcon;
-export const SortDescIcon = _SortDescIcon;
-export const TreeIcon = _TreeIcon;
-export const TreemapIcon = _TreemapIcon;
-export const VulnerabilityIcon = _VulnerabilityIcon;
+export { default as AlertErrorIcon } from './AlertErrorIcon';
+export { default as AlertWarnIcon } from './AlertWarnIcon';
+export { default as BranchIcon } from './BranchIcon';
+export { default as BubblesIcon } from './BubblesIcon';
+export { default as BugIcon } from './BugIcon';
+// @deprecated use EditIcon
+export { default as ChangeIcon } from './EditIcon';
+export { default as ChartLegendIcon } from './ChartLegendIcon';
+export { default as CheckIcon } from './CheckIcon';
+export { default as ClearIcon } from './ClearIcon';
+// @deprecated use ClearIcon
+export { default as CloseIcon } from './ClearIcon';
+export { default as CodeSmellIcon } from './CodeSmellIcon';
+// @deprecated use ClearIcon
+export { default as DeleteIcon } from './DeleteIcon';
+export { default as EditIcon } from './EditIcon';
+export { default as FavoriteIcon } from './FavoriteIcon';
+export { default as HelpIcon } from './HelpIcon';
+export { default as HistoryIcon } from './HistoryIcon';
+export { default as LinkIcon } from './LinkIcon';
+export { default as ListIcon } from './ListIcon';
+export { default as LongLivingBranchIcon } from './LongLivingBranchIcon';
+export { default as OpenCloseIcon } from './OpenCloseIcon';
+export { default as OrganizationIcon } from './OrganizationIcon';
+export { default as PendingIcon } from './PendingIcon';
+export { default as ProjectEventIcon } from './ProjectEventIcon';
+export { default as PullRequestIcon } from './PullRequestIcon';
+export { default as QualifierIcon } from './QualifierIcon';
+export { default as ShortLivingBranchIcon } from './ShortLivingBranchIcon';
+export { default as SortAscIcon } from './SortAscIcon';
+export { default as SortDescIcon } from './SortDescIcon';
+export { default as TreeIcon } from './TreeIcon';
+export { default as TreemapIcon } from './TreemapIcon';
+export { default as VulnerabilityIcon } from './VulnerabilityIcon';
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:contact 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.
+ */
+export interface IconProps {
+ className?: string;
+ fill?: string;
+ size?: number;
+}
import Avatar from '../../../components/ui/Avatar';
import BubblePopupHelper from '../../../components/common/BubblePopupHelper';
import EditIcon from '../../../components/icons-components/EditIcon';
-import DeleteIcon from '../../../components/icons-components/DeleteIcon';
+import { EditButton, DeleteButton } from '../../../components/ui/buttons';
import CommentDeletePopup from '../popups/CommentDeletePopup';
import CommentPopup from '../popups/CommentPopup';
import DateFromNow from '../../../components/intl/DateFromNow';
toggleComment={this.toggleEditPopup}
/>
}>
- <button
- className="js-issue-comment-edit button-link icon-half-transparent"
- onClick={this.toggleEditPopup}>
- <EditIcon />
- </button>
+ <EditButton
+ className="js-issue-comment-edit button-small"
+ onClick={this.toggleEditPopup}
+ />
</BubblePopupHelper>
)}
{comment.updatable && (
position="bottomright"
togglePopup={this.toggleDeletePopup}
popup={<CommentDeletePopup onDelete={this.handleDelete} />}>
- <button
- className="js-issue-comment-delete button-link icon-half-transparent little-spacer-left"
- onClick={this.toggleDeletePopup}>
- <DeleteIcon />
- </button>
+ <DeleteButton
+ className="js-issue-comment-delete button-small"
+ onClick={this.toggleDeletePopup}
+ />
</BubblePopupHelper>
)}
</div>
const element = shallow(
<IssueCommentLine comment={comment} onDelete={jest.fn()} onEdit={jest.fn()} />
);
- click(element.find('button.js-issue-comment-edit'));
+ element.find('.js-issue-comment-edit').prop('onClick')();
expect(element.state()).toMatchSnapshot();
- click(element.find('button.js-issue-comment-delete'));
+ element.find('.js-issue-comment-delete').prop('onClick')();
expect(element.state()).toMatchSnapshot();
+ element.update();
expect(element).toMatchSnapshot();
});
position="bottomright"
togglePopup={[Function]}
>
- <button
- className="js-issue-comment-edit button-link icon-half-transparent"
+ <EditButton
+ className="js-issue-comment-edit button-small"
onClick={[Function]}
- >
- <EditIcon />
- </button>
+ />
</BubblePopupHelper>
<BubblePopupHelper
className="bubble-popup-helper-inline"
position="bottomright"
togglePopup={[Function]}
>
- <button
- className="js-issue-comment-delete button-link icon-half-transparent little-spacer-left"
+ <DeleteButton
+ className="js-issue-comment-delete button-small"
onClick={[Function]}
- >
- <DeleteIcon />
- </button>
+ />
</BubblePopupHelper>
</div>
</div>
position="bottomright"
togglePopup={[Function]}
>
- <button
- className="js-issue-comment-edit button-link icon-half-transparent"
+ <EditButton
+ className="js-issue-comment-edit button-small"
onClick={[Function]}
- >
- <EditIcon />
- </button>
+ />
</BubblePopupHelper>
<BubblePopupHelper
className="bubble-popup-helper-inline"
position="bottomright"
togglePopup={[Function]}
>
- <button
- className="js-issue-comment-delete button-link icon-half-transparent little-spacer-left"
+ <DeleteButton
+ className="js-issue-comment-delete button-small"
onClick={[Function]}
- >
- <DeleteIcon />
- </button>
+ />
</BubblePopupHelper>
</div>
</div>
*/
import * as React from 'react';
import * as classNames from 'classnames';
-import NavBarNotif from './NavBarNotif';
import './NavBar.css';
interface Props {
children?: any;
className?: string;
height: number;
- notif?: React.ReactElement<NavBarNotif>;
+ notif?: React.ReactNode;
}
export default function NavBar({ children, className, height, notif, ...other }: Props) {
*/
import * as React from 'react';
import * as classNames from 'classnames';
-import CloseIcon from '../icons-components/CloseIcon';
+import { DeleteButton } from '../ui/buttons';
interface Props {
children?: React.ReactNode;
onCancel?: () => {};
}
-export default class NavBarNotif extends React.PureComponent<Props> {
- handleCancel = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- if (this.props.onCancel) {
- this.props.onCancel();
- }
- };
-
- render() {
- if (!this.props.children) {
- return null;
- }
- return (
- <div className={classNames('navbar-notif', this.props.className)}>
- <div className="navbar-limited clearfix">
- <div className={classNames({ 'navbar-notif-cancelable': !!this.props.onCancel })}>
- {this.props.children}
- {this.props.onCancel && (
- <a className="button-link text-danger" href="#" onClick={this.handleCancel}>
- <CloseIcon />
- </a>
- )}
- </div>
+export default function NavBarNotif(props: Props) {
+ if (!props.children) {
+ return null;
+ }
+ return (
+ <div className={classNames('navbar-notif', props.className)}>
+ <div className="navbar-limited clearfix">
+ <div className={classNames({ 'navbar-notif-cancelable': !!props.onCancel })}>
+ {props.children}
+ {props.onCancel && <DeleteButton className="button-small" onClick={props.onCancel} />}
</div>
</div>
- );
- }
+ </div>
+ );
}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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.
+ */
+.button-icon {
+ display: inline-flex;
+ justify-content: center;
+ align-items: center;
+ vertical-align: middle;
+ width: var(--controlHeight);
+ height: var(--controlHeight);
+ padding: 0;
+ border: none;
+ color: inherit;
+}
+
+.button-icon.button-small {
+ width: var(--smallControlHeight);
+ height: var(--smallControlHeight);
+ padding: 0;
+}
+
+.button-icon.button-small svg {
+ margin-top: 0;
+}
+
+.button-icon.button-tiny {
+ width: var(--tinyControlHeight);
+ height: var(--tinyControlHeight);
+ padding: 0;
+}
+
+.button-icon:hover,
+.button-icon:focus {
+ background-color: currentColor;
+}
+
+.button-icon:hover svg,
+.button-icon:focus svg {
+ color: #fff;
+}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:contact 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 * as React from 'react';
+import * as classNames from 'classnames';
+import * as theme from '../../app/theme';
+import ClearIcon from '../icons-components/ClearIcon';
+import './buttons.css';
+import EditIcon from '../icons-components/EditIcon';
+
+interface ButtonIconProps {
+ children: React.ReactNode;
+ className?: string;
+ color?: string;
+ onClick?: () => void;
+ [x: string]: any;
+}
+
+export class ButtonIcon extends React.PureComponent<ButtonIconProps> {
+ handleClick = (event: React.SyntheticEvent<HTMLButtonElement>) => {
+ event.preventDefault();
+ event.currentTarget.blur();
+ event.stopPropagation();
+ if (this.props.onClick) {
+ this.props.onClick();
+ }
+ };
+
+ render() {
+ const { children, className, color = theme.darkBlue, ...props } = this.props;
+ return (
+ <button
+ className={classNames(className, 'button-icon')}
+ onClick={this.handleClick}
+ style={{ color }}
+ {...props}>
+ {children}
+ </button>
+ );
+ }
+}
+
+interface ActionButtonProps {
+ className?: string;
+ onClick?: () => void;
+ [x: string]: any;
+}
+
+export function DeleteButton(props: ActionButtonProps) {
+ return (
+ <ButtonIcon color={theme.red} {...props}>
+ <ClearIcon />
+ </ButtonIcon>
+ );
+}
+
+export function EditButton(props: ActionButtonProps) {
+ return (
+ <ButtonIcon {...props}>
+ <EditIcon />
+ </ButtonIcon>
+ );
+}
}
public ProjectsPage invertSorting() {
- getOpenTopBar().$(".js-projects-sorting-select a.button-icon").should(Condition.exist).click();
+ getOpenTopBar().$(".js-projects-sorting-invert").should(Condition.exist).click();
return this;
}
import com.sonar.orchestrator.Orchestrator;
import com.sonar.orchestrator.build.SonarScanner;
-import org.sonarqube.tests.Category1Suite;
import org.junit.AfterClass;
import org.junit.Before;
import org.junit.BeforeClass;
import org.junit.ClassRule;
import org.junit.Test;
import org.junit.rules.RuleChain;
+import org.sonarqube.pageobjects.Navigation;
+import org.sonarqube.pageobjects.projects.ProjectsPage;
+import org.sonarqube.tests.Category1Suite;
import org.sonarqube.tests.Tester;
import org.sonarqube.ws.WsUsers;
import org.sonarqube.ws.client.PostRequest;
import org.sonarqube.ws.client.WsClient;
import org.sonarqube.ws.client.project.DeleteRequest;
-import org.sonarqube.pageobjects.Navigation;
-import org.sonarqube.pageobjects.projects.ProjectsPage;
import static com.codeborne.selenide.Selenide.clearBrowserLocalStorage;
import static com.codeborne.selenide.WebDriverRunner.url;
projects / sonarqube.git / commitdiff