diff --git a/webapp/src/components/sidebar_right/index.jsx b/webapp/src/components/sidebar_right/index.jsx index 3e62e1c69..7653aa5a7 100644 --- a/webapp/src/components/sidebar_right/index.jsx +++ b/webapp/src/components/sidebar_right/index.jsx @@ -4,7 +4,7 @@ import {connect} from 'react-redux'; import {bindActionCreators} from 'redux'; -import {getReviewsDetails, getYourPrsDetails} from '../../actions'; +import {getReviewsDetails, getYourPrsDetails, getSidebarContent} from '../../actions'; import {getSidebarData} from 'src/selectors'; @@ -30,6 +30,7 @@ function mapDispatchToProps(dispatch) { actions: bindActionCreators({ getYourPrsDetails, getReviewsDetails, + getSidebarContent, }, dispatch), }; } diff --git a/webapp/src/components/sidebar_right/sidebar_right.jsx b/webapp/src/components/sidebar_right/sidebar_right.jsx index 567527929..782f723ed 100644 --- a/webapp/src/components/sidebar_right/sidebar_right.jsx +++ b/webapp/src/components/sidebar_right/sidebar_right.jsx @@ -4,17 +4,38 @@ import React from 'react'; import PropTypes from 'prop-types'; import Scrollbars from 'react-custom-scrollbars-2'; +import {OverlayTrigger, Tooltip} from 'react-bootstrap'; -import {RHSStates} from '../../constants'; +import {makeStyleFromTheme, changeOpacity} from 'mattermost-redux/utils/theme_utils'; +import {RHSStates} from '../../constants'; import GithubItems from './github_items'; +const getStyle = makeStyleFromTheme((theme) => { + return { + sectionHeader: { + padding: '15px', + display: 'flex', + justifyContent: 'space-between', + alignItems: 'center', + }, + refreshButton: { + color: changeOpacity(theme.centerChannelColor, 0.6), + cursor: 'pointer', + background: 'transparent', + border: 'none', + padding: 0, + }, + }; +}); + export function renderView(props) { return (
); + /> + ); } export function renderThumbHorizontal(props) { @@ -22,7 +43,8 @@ export function renderThumbHorizontal(props) {
); + /> + ); } export function renderThumbVertical(props) { @@ -30,7 +52,8 @@ export function renderThumbVertical(props) {
); + /> + ); } function mapGithubItemListToPrList(gilist) { @@ -78,10 +101,20 @@ export default class SidebarRight extends React.PureComponent { actions: PropTypes.shape({ getYourPrsDetails: PropTypes.func.isRequired, getReviewsDetails: PropTypes.func.isRequired, + getSidebarContent: PropTypes.func.isRequired, }).isRequired, }; + constructor(props) { + super(props); + this.state = {refreshing: false}; + this._mounted = false; + this._refreshing = false; + } + componentDidMount() { + this._mounted = true; + if (this.props.yourPrs && this.props.rhsState === RHSStates.PRS) { this.props.actions.getYourPrsDetails(mapGithubItemListToPrList(this.props.yourPrs)); } @@ -91,6 +124,29 @@ export default class SidebarRight extends React.PureComponent { } } + componentWillUnmount() { + this._mounted = false; + } + + handleRefresh = async (e) => { + if (e) { + e.preventDefault(); + } + if (this._refreshing) { + return; + } + this._refreshing = true; + this.setState({refreshing: true}); + try { + await this.props.actions.getSidebarContent(); + } finally { + this._refreshing = false; + if (this._mounted) { + this.setState({refreshing: false}); + } + } + }; + componentDidUpdate(prevProps) { if (shouldUpdateDetails(this.props.yourPrs, prevProps.yourPrs, RHSStates.PRS, this.props.rhsState, prevProps.rhsState)) { this.props.actions.getYourPrsDetails(mapGithubItemListToPrList(this.props.yourPrs)); @@ -102,6 +158,7 @@ export default class SidebarRight extends React.PureComponent { } render() { + const style = getStyle(this.props.theme); const baseURL = this.props.enterpriseURL ? this.props.enterpriseURL : 'https://github.com'; let orgQuery = ''; this.props.orgs.map((org) => { @@ -116,27 +173,23 @@ export default class SidebarRight extends React.PureComponent { switch (rhsState) { case RHSStates.PRS: - githubItems = yourPrs; title = 'Your Open Pull Requests'; listUrl = baseURL + '/pulls?q=is%3Aopen+is%3Apr+author%3A' + username + '+archived%3Afalse' + orgQuery; break; case RHSStates.REVIEWS: - githubItems = reviews; listUrl = baseURL + '/pulls?q=is%3Aopen+is%3Apr+review-requested%3A' + username + '+archived%3Afalse' + orgQuery; title = 'Pull Requests Needing Review'; break; case RHSStates.UNREADS: - githubItems = unreads; title = 'Unread Messages'; listUrl = baseURL + '/notifications'; break; case RHSStates.ASSIGNMENTS: - githubItems = yourAssignments; title = 'Your Assignments'; listUrl = baseURL + '/pulls?q=is%3Aopen+archived%3Afalse+assignee%3A' + username + orgQuery; @@ -163,6 +216,20 @@ export default class SidebarRight extends React.PureComponent { rel='noopener noreferrer' >{title} + {'Refresh'}} + > + +