From 37bf1c20ee5a64fccad73f7c46ccaf08833a5be1 Mon Sep 17 00:00:00 2001 From: Rafael Zendron Date: Tue, 16 Jun 2026 19:16:24 -0300 Subject: [PATCH 1/3] feat: add refresh ability to GitHub RHS sidebar (#131) - Add refresh button in RHS header with spinner animation - Auto-refresh data when RHS is opened - Wire getSidebarContent action to SidebarRight component Resolves #131 --- webapp/src/components/sidebar_right/index.jsx | 3 +- .../sidebar_right/sidebar_right.jsx | 42 +++++++++++++++++++ 2 files changed, 44 insertions(+), 1 deletion(-) 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..7b3e25147 100644 --- a/webapp/src/components/sidebar_right/sidebar_right.jsx +++ b/webapp/src/components/sidebar_right/sidebar_right.jsx @@ -4,6 +4,7 @@ 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'; @@ -78,10 +79,31 @@ 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}; + } + + handleRefresh = async (e) => { + if (e) { + e.preventDefault(); + } + if (this.state.refreshing) { + return; + } + this.setState({refreshing: true}); + await this.props.actions.getSidebarContent(); + this.setState({refreshing: false}); + }; + componentDidMount() { + // Auto-refresh on open to guarantee latest data (issue #131) + this.handleRefresh(); + if (this.props.yourPrs && this.props.rhsState === RHSStates.PRS) { this.props.actions.getYourPrsDetails(mapGithubItemListToPrList(this.props.yourPrs)); } @@ -163,6 +185,19 @@ export default class SidebarRight extends React.PureComponent { rel='noopener noreferrer' >{title} + {'Refresh'}} + > + + + +
Date: Sun, 5 Jul 2026 00:40:07 -0300 Subject: [PATCH 2/3] sidebar_right: fix RHS refresh bugs per code review - Remove redundant auto-refresh on componentDidMount (already triggered by WS and sidebar_buttons) - Fix race condition in handleRefresh using instance flag + mounted guard - Change to
@@ -212,16 +244,3 @@ export default class SidebarRight extends React.PureComponent { ); } } - -const style = { - sectionHeader: { - padding: '15px', - display: 'flex', - justifyContent: 'space-between', - alignItems: 'center', - }, - refreshButton: { - color: 'rgba(0, 0, 0, 0.4)', - cursor: 'pointer', - }, -}; From 0d143a321e1b6c2ef034556a86ed6e360ddddc6d Mon Sep 17 00:00:00 2001 From: rafaumeu Date: Sat, 11 Jul 2026 20:45:17 -0300 Subject: [PATCH 3/3] sidebar_right: hoist getStyle to module scope for memoization --- .../sidebar_right/sidebar_right.jsx | 36 +++++++++---------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/webapp/src/components/sidebar_right/sidebar_right.jsx b/webapp/src/components/sidebar_right/sidebar_right.jsx index bc7501fba..782f723ed 100644 --- a/webapp/src/components/sidebar_right/sidebar_right.jsx +++ b/webapp/src/components/sidebar_right/sidebar_right.jsx @@ -11,6 +11,24 @@ import {makeStyleFromTheme, changeOpacity} from 'mattermost-redux/utils/theme_ut 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 (
{ - 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, - }, - }; - }); - const style = getStyle(this.props.theme); const baseURL = this.props.enterpriseURL ? this.props.enterpriseURL : 'https://github.com'; let orgQuery = '';