'sw-absolut sw-box-border sw-rounded-2 sw-overflow-hidden',
isDisabled && 'sw-pointer-events-none sw-cursor-not-allowed'
),
- menu: () => 'sw-z-dropdown-menu',
option: ({ isDisabled }) =>
classNames(
- 'sw-py-2 sw-px-3 sw-cursor-pointer',
+ 'it__select-option sw-py-2 sw-px-3 sw-cursor-pointer',
isDisabled && 'sw-pointer-events-none sw-cursor-not-allowed'
),
...props.classNames,
<FacetItemsList labelledby={this.getFacetHeaderId(SecurityStandard.SONARSOURCE)}>
{selectedBelowLimit.map((item) => (
<FacetItem
- active={true}
+ active
key={item}
name={renderSonarSourceSecurityCategory(this.state.standards, item)}
onClick={this.handleSonarSourceSecurityItemClick}
const user = userEvent.setup();
renderIssueApp();
- await user.click(await ui.issueItem5.find());
+ await user.click(await ui.issueItemAction5.find());
expect(ui.projectIssueItem6.getAll()).toHaveLength(2); // there will be 2 buttons one in concise issue and other in code viewer
- await user.click(ui.issueItemAction6.get());
+ await user.click(ui.projectIssueItem6.getAll()[1]);
expect(screen.getByRole('heading', { level: 1, name: 'Second issue' })).toBeInTheDocument();
});
? translate('bulk_change')
: translateWithParameters('issue_bulk_change.form.title', issues.length)
}
- isScrollable={true}
+ isScrollable
loading={submitting}
body={this.renderForm()}
primaryButton={
aria-label={translate('permalink')}
className="sw-ml-1 sw-align-bottom"
copyValue={getPathUrlAsString(issueUrl, false)}
- discreet={true}
+ discreet
/>
</div>
<div className="sw-flex sw-items-center sw-justify-between">
}}
loading={loadingMore}
total={paging.total}
- useMIUIButtons={true}
+ useMIUIButtons
/>
)}
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import styled from '@emotion/styled';
-import { themeBorder, themeColor } from 'design-system';
import * as React from 'react';
import Issue from '../../../components/issue/Issue';
import { BranchLike } from '../../../types/branch-like';
}
export default class ListItem extends React.PureComponent<Props> {
- nodeRef: HTMLLIElement | null = null;
-
- componentDidMount() {
- const { selected } = this.props;
- if (this.nodeRef && selected) {
- this.nodeRef.scrollIntoView({ block: 'center', inline: 'center' });
- }
- }
-
- componentDidUpdate(prevProps: Props) {
- const { selected } = this.props;
- if (!prevProps.selected && selected && this.nodeRef) {
- this.nodeRef.scrollIntoView({ block: 'center', inline: 'center' });
- }
- }
-
handleFilter = (property: string, issue: TypeIssue) => {
const { onFilterChange } = this.props;
const { branchLike, issue } = this.props;
return (
- <IssueItem ref={(node) => (this.nodeRef = node)}>
- <Issue
- branchLike={branchLike}
- checked={this.props.checked}
- issue={issue}
- onChange={this.props.onChange}
- onCheck={this.props.onCheck}
- onClick={this.props.onClick}
- onPopupToggle={this.props.onPopupToggle}
- openPopup={this.props.openPopup}
- selected={this.props.selected}
- />
- </IssueItem>
+ <Issue
+ branchLike={branchLike}
+ checked={this.props.checked}
+ issue={issue}
+ onChange={this.props.onChange}
+ onCheck={this.props.onCheck}
+ onClick={this.props.onClick}
+ onPopupToggle={this.props.onPopupToggle}
+ openPopup={this.props.openPopup}
+ selected={this.props.selected}
+ />
);
}
}
-
-const IssueItem = styled.li`
- box-sizing: border-box;
- border: ${themeBorder('default', 'transparent')};
- border-top: ${themeBorder('default')};
- outline: none;
-
- &.selected {
- border: ${themeBorder('default', 'tableRowSelected')};
- }
-
- &:hover {
- background: ${themeColor('tableRowHover')};
- }
-
- &:last-child {
- border-bottom: ${themeBorder('default')};
- }
-`;
return (
<Dropdown
- allowResizing={true}
+ allowResizing
closeOnClick={false}
id="tag-selector"
overlay={
{this.renderGroup(firstGroup, 0, { onlyFirst: true })}
<div>
<ExpandLink
- blurAfterClick={true}
+ blurAfterClick
onClick={this.handleMoreLocationsClick}
- preventDefault={true}
+ preventDefault
to={{}}
>
{translateWithParameters(
</ExecutionFlowAccordion>
))}
</div>
- <IssueLocationsNavigatorKeyboardHint showLeftRightHint={true} />
+ <IssueLocationsNavigatorKeyboardHint showLeftRightHint />
</>
);
}
loadMore={props.fetchMoreIssues}
loading={loadingMore}
total={paging.total}
- useMIUIButtons={true}
+ useMIUIButtons
/>
)}
</StyledWrapper>
<FacetItemsList labelledby={this.getFacetHeaderId(property)}>
{selectedBelowLimit.map((item) => (
<FacetItem
- active={true}
+ active
className="it__search-navigator-facet"
key={item}
name={this.props.renderFacetItem(item)}
loadMoreAriaLabel={showMoreAriaLabel}
ready={!searching}
total={searchPaging.total}
- useMIUIButtons={true}
+ useMIUIButtons
/>
)}
</>
className="it__search-navigator-facet-box it__search-navigator-facet-header"
data-property={property}
id={this.getFacetHeaderId(property)}
- inner={true}
+ inner
key={property}
name={translate(`issues.facet.${name}`)}
open={open}
fetching={fetchingCwe}
getFacetItemText={(item) => renderCWECategory(this.state.standards, item)}
getSearchResultText={(item) => renderCWECategory(this.state.standards, item)}
- inner={true}
+ inner
loadSearchResultCount={this.loadCWESearchResultCount}
onChange={this.props.onChange}
onSearch={this.handleCWESearch}
count={count}
countLabel={translateWithParameters('x_selected', count)}
data-property={this.property}
- hasEmbeddedFacets={true}
+ hasEmbeddedFacets
id={this.getFacetHeaderId(this.property)}
name={translate('issues.facet', this.property)}
onClear={this.handleClear}
onChange={jest.fn()}
onSearch={jest.fn()}
onToggle={jest.fn()}
- open={true}
+ open
property="foo"
searchPlaceholder="search for foo..."
stats={{ a: 10, b: 8, c: 1 }}
name: 'source_viewer.issues_on_line.X_issues_of_type_Y.source_viewer.issues_on_line.show.2.issue.type.BUG.plural',
})
);
- const firstIssueBox = issueRow.getByRole('link', { name: 'First Issue' });
- const secondIssueBox = issueRow.getByRole('link', { name: 'Second Issue' });
- expect(firstIssueBox).toBeInTheDocument();
- expect(secondIssueBox).toBeInTheDocument();
- expect(
- issueRow.getByRole('button', {
- name: 'source_viewer.issues_on_line.X_issues_of_type_Y.source_viewer.issues_on_line.hide.2.issue.type.BUG.plural',
- })
- ).toBeInTheDocument();
-
- await user.click(firstIssueBox);
- expect(onIssueSelect).toHaveBeenCalledWith('first-issue');
-
- await user.click(secondIssueBox);
- expect(onIssueSelect).toHaveBeenCalledWith('second-issue');
});
it('should show coverage information', async () => {
border: 1px solid var(--gray80);
box-sizing: border-box;
background-color: #fff;
- overflow: hidden;
}
.source-table {
);
return (
- <div className="sw-flex sw-flex-wrap sw-items-center sw-justify-between">
- <ul className="sw-flex sw-items-center sw-gap-3 sw-body-sm">
+ <div
+ className={classNames(className, 'sw-flex sw-flex-wrap sw-items-center sw-justify-between')}
+ >
+ <ul className="it__issue-header-actions sw-flex sw-items-center sw-gap-3 sw-body-sm">
<li>
<IssueType canSetType={canSetType} issue={issue} setIssueProperty={setIssueProperty} />
</li>
</>
</Tooltip>
</IssueMetaListItem>
- <SeparatorCircleIcon aria-hidden={true} as="li" />
+ <SeparatorCircleIcon aria-hidden as="li" />
</>
)}
<CommentIcon aria-label={translate('issue.comment.formlink')} />
{issue.comments?.length}
</IssueMetaListItem>
- <SeparatorCircleIcon aria-hidden={true} as="li" />
+ <SeparatorCircleIcon aria-hidden as="li" />
</>
)}
{showLine && isDefined(issue.textRange) && (
{translateWithParameters('issue.ncloc_x.short', issue.textRange.endLine)}
</IssueMetaListItem>
</Tooltip>
- <SeparatorCircleIcon aria-hidden={true} as="li" />
+ <SeparatorCircleIcon aria-hidden as="li" />
</>
)}
{issue.effort && (
<IssueMetaListItem className={issueMetaListItemClassNames}>
{translateWithParameters('issue.x_effort', issue.effort)}
</IssueMetaListItem>
- <SeparatorCircleIcon aria-hidden={true} as="li" />
+ <SeparatorCircleIcon aria-hidden as="li" />
</>
)}
<IssueMetaListItem className={issueMetaListItemClassNames}>
return (
<SearchSelectDropdown
size="medium"
+ className="it__issue-assign"
controlAriaLabel={
assinedUser
? translateWithParameters('issue.assign.assigned_to_x_click_to_change', assinedUser)
import { getComponentIssuesUrl } from '../../../helpers/urls';
import { BranchLike } from '../../../types/branch-like';
import { Issue } from '../../../types/types';
-import Link from '../../common/Link';
import { IssueMessageHighlighting } from '../IssueMessageHighlighting';
export interface IssueMessageProps {
return (
<>
{props.onClick ? (
- <StandoutLink onClick={props.onClick} preventDefault to={{}}>
+ <StandoutLink onClick={props.onClick} className="it__issue-message" preventDefault to={{}}>
<IssueMessageHighlighting message={message} messageFormattings={messageFormattings} />
</StandoutLink>
) : (
)}
{displayWhyIsThisAnIssue && (
- <Link
+ <StandoutLink
aria-label={translate('issue.why_this_issue.long')}
- className="spacer-right"
target="_blank"
+ className="sw-ml-2"
to={whyIsThisAnIssueUrl}
>
{translate('issue.why_this_issue')}
- </Link>
+ </StandoutLink>
)}
</>
);
const typesOptions = SEVERITY.map((severity) => ({
label: translate('severity', severity),
value: severity,
- Icon: <SeverityIcon severity={severity} aria-hidden={true} />,
+ Icon: <SeverityIcon severity={severity} aria-hidden />,
}));
if (this.props.canSetSeverity) {
translate('severity', issue.severity)
)}
menuIsOpen={this.props.isOpen && this.props.canSetSeverity}
- className="js-issue-type"
+ className="it__issue-severity"
options={typesOptions}
onMenuClose={this.handleClose}
onMenuOpen={() => this.toggleSetSeverity(true)}
return (
<span className="sw-flex sw-items-center sw-gap-1">
- <SeverityIcon
- className="little-spacer-right"
- severity={issue.severity}
- aria-hidden={true}
- />
+ <SeverityIcon className="little-spacer-right" severity={issue.severity} aria-hidden />
{translate('severity', issue.severity)}
</span>
);
translate('issue.status', issue.status)
)}
size="medium"
- className="js-issue-transition"
+ className="it__issue-transition"
components={{
SingleValue: <
V,
'issue.type.type_x_click_to_change',
translate('issue.type', issue.type)
)}
- className="js-issue-type"
+ className="it__issue-type"
options={typesOptions}
setValue={this.setType}
value={issue.type}
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
+import styled from '@emotion/styled';
import classNames from 'classnames';
-import { Checkbox } from 'design-system';
+import { Checkbox, themeBorder, themeColor } from 'design-system';
import * as React from 'react';
import { deleteIssueComment, editIssueComment } from '../../../api/issues';
import { translate, translateWithParameters } from '../../../helpers/l10n';
}
export default class IssueView extends React.PureComponent<Props> {
+ nodeRef: HTMLLIElement | null = null;
+
+ componentDidMount() {
+ const { selected } = this.props;
+ if (this.nodeRef && selected) {
+ this.nodeRef.scrollIntoView({ block: 'center', inline: 'center' });
+ }
+ }
+
+ componentDidUpdate(prevProps: Props) {
+ const { selected } = this.props;
+ if (!prevProps.selected && selected && this.nodeRef) {
+ this.nodeRef.scrollIntoView({ block: 'center', inline: 'center' });
+ }
+ }
+
handleCheck = () => {
if (this.props.onCheck) {
this.props.onCheck(this.props.issue.key);
const hasCheckbox = this.props.onCheck != null;
- const issueClass = classNames('sw-py-3 sw-flex sw-items-center sw-justify-between sw-w-full ', {
- 'no-click': this.props.onClick === undefined,
- selected: this.props.selected,
- });
+ const issueClass = classNames(
+ 'it__issue-item sw-py-3 sw-flex sw-items-center sw-justify-between sw-w-full ',
+ {
+ 'no-click': this.props.onClick === undefined,
+ selected: this.props.selected,
+ }
+ );
return (
- <div className={issueClass} role="region" aria-label={issue.message}>
+ <IssueItem
+ className={issueClass}
+ role="region"
+ aria-label={issue.message}
+ ref={(node) => (this.nodeRef = node)}
+ >
<div className="sw-flex sw-w-full sw-px-2 sw-gap-4">
{hasCheckbox && (
<Checkbox
onAssign={this.props.onAssign}
onChange={this.props.onChange}
togglePopup={this.props.togglePopup}
- showComments={true}
+ showComments
/>
</div>
</div>
- </div>
+ </IssueItem>
);
}
}
const tagName = (node.tagName || '').toUpperCase();
return clickableTags.includes(tagName) || isClickable(node.parentElement);
}
+
+const IssueItem = styled.li`
+ box-sizing: border-box;
+ border: ${themeBorder('default', 'transparent')};
+ border-top: ${themeBorder('default')};
+ outline: none;
+
+ &:last-child {
+ border-bottom: ${themeBorder('default')};
+ }
+
+ &.selected {
+ border: ${themeBorder('default', 'tableRowSelected')};
+ &:last-child {
+ }
+ }
+
+ &:hover {
+ background: ${themeColor('tableRowHover')};
+ }
+`;
projects / sonarqube.git / commitdiff