зеркало из https://github.com/mozilla/treeherder.git
Bug 1743545 - Make watched repo buttons links. (#7333)
* Change watched repo buttons to links using react-router-dom Link element
This commit is contained in:
Родитель
dba583ea48
Коммит
4f67f92b55
|
@ -5,6 +5,7 @@ import { render, waitFor, fireEvent } from '@testing-library/react';
|
|||
import thunk from 'redux-thunk';
|
||||
import configureMockStore from 'redux-mock-store';
|
||||
import { createBrowserHistory } from 'history';
|
||||
import { BrowserRouter } from 'react-router-dom';
|
||||
|
||||
import FilterModel from '../../../ui/models/filter';
|
||||
import SecondaryNavBar from '../../../ui/job-view/headerbars/SecondaryNavBar';
|
||||
|
@ -36,22 +37,24 @@ describe('SecondaryNavBar', () => {
|
|||
const testSecondaryNavBar = (store, props) => {
|
||||
return (
|
||||
<Provider store={store}>
|
||||
<SecondaryNavBar
|
||||
updateButtonClick={() => {}}
|
||||
serverChanged={false}
|
||||
filterModel={
|
||||
new FilterModel({
|
||||
pushRoute: history.push,
|
||||
router,
|
||||
})
|
||||
}
|
||||
repos={repos}
|
||||
setCurrentRepoTreeStatus={() => {}}
|
||||
duplicateJobsVisible={false}
|
||||
groupCountsExpanded={false}
|
||||
toggleFieldFilterVisible={() => {}}
|
||||
{...props}
|
||||
/>
|
||||
<BrowserRouter>
|
||||
<SecondaryNavBar
|
||||
updateButtonClick={() => {}}
|
||||
serverChanged={false}
|
||||
filterModel={
|
||||
new FilterModel({
|
||||
pushRoute: history.push,
|
||||
router,
|
||||
})
|
||||
}
|
||||
repos={repos}
|
||||
setCurrentRepoTreeStatus={() => {}}
|
||||
duplicateJobsVisible={false}
|
||||
groupCountsExpanded={false}
|
||||
toggleFieldFilterVisible={() => {}}
|
||||
{...props}
|
||||
/>
|
||||
</BrowserRouter>
|
||||
</Provider>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -452,3 +452,9 @@ fieldset[disabled] .btn-view-nav-closed.active {
|
|||
.navbar-link:visited {
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
/* Watched repo */
|
||||
|
||||
.btn-watched-repo {
|
||||
padding: 0.375rem 0.5rem;
|
||||
}
|
||||
|
|
|
@ -11,15 +11,13 @@ import {
|
|||
faTimesCircle,
|
||||
} from '@fortawesome/free-solid-svg-icons';
|
||||
import {
|
||||
ButtonGroup,
|
||||
Button,
|
||||
DropdownMenu,
|
||||
DropdownItem,
|
||||
DropdownToggle,
|
||||
UncontrolledDropdown,
|
||||
} from 'reactstrap';
|
||||
import { push as pushRoute } from 'connected-react-router';
|
||||
import { connect } from 'react-redux';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import TreeStatusModel from '../../models/treeStatus';
|
||||
import BugLinkify from '../../shared/BugLinkify';
|
||||
|
@ -59,7 +57,7 @@ const statusInfoMap = {
|
|||
},
|
||||
};
|
||||
|
||||
class WatchedRepo extends React.Component {
|
||||
export default class WatchedRepo extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
|
@ -127,7 +125,7 @@ class WatchedRepo extends React.Component {
|
|||
};
|
||||
|
||||
render() {
|
||||
const { repoName, unwatchRepo, repo, pushRoute } = this.props;
|
||||
const { repoName, unwatchRepo, repo } = this.props;
|
||||
const { status, messageOfTheDay, reason, statusInfo } = this.state;
|
||||
const watchedRepo = repo.name;
|
||||
const activeClass = watchedRepo === repoName ? 'active' : '';
|
||||
|
@ -135,15 +133,11 @@ class WatchedRepo extends React.Component {
|
|||
const pulseIcon = statusInfo.pulseIcon || null;
|
||||
|
||||
return (
|
||||
<ButtonGroup>
|
||||
<Button
|
||||
onClick={() => {
|
||||
pushRoute({ search: updateRepoParams(watchedRepo) });
|
||||
this.updateTreeStatus(true);
|
||||
}}
|
||||
className={`btn-view-nav ${btnClass} ${activeClass}`}
|
||||
<div className="btn-group" role="group">
|
||||
<Link
|
||||
to={updateRepoParams(watchedRepo)}
|
||||
className={`btn btn-sm btn-view-nav ${btnClass} ${activeClass} btn-watched-repo`}
|
||||
title={status}
|
||||
size="sm"
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={icon}
|
||||
|
@ -152,7 +146,7 @@ class WatchedRepo extends React.Component {
|
|||
pulse={pulseIcon}
|
||||
/>{' '}
|
||||
{watchedRepo}
|
||||
</Button>
|
||||
</Link>
|
||||
<UncontrolledDropdown>
|
||||
<DropdownToggle className={`btn-view-nav ${activeClass}`}>
|
||||
<FontAwesomeIcon
|
||||
|
@ -221,7 +215,7 @@ class WatchedRepo extends React.Component {
|
|||
</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</UncontrolledDropdown>
|
||||
</ButtonGroup>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -235,7 +229,4 @@ WatchedRepo.propTypes = {
|
|||
pushLogUrl: PropTypes.string,
|
||||
}).isRequired,
|
||||
setCurrentRepoTreeStatus: PropTypes.func.isRequired,
|
||||
pushRoute: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
export default connect(null, { pushRoute })(WatchedRepo);
|
||||
|
|
Загрузка…
Ссылка в новой задаче