From b3486c04574377545324f36361e9fe16c7447637 Mon Sep 17 00:00:00 2001 From: jeyren95 Date: Wed, 7 Feb 2024 15:09:10 +0800 Subject: [PATCH 1/4] fix(issue-3148): use href link instead of react-router link when navigating between player profiles --- .gitignore | 1 + src/components/Visualizations/Table/HeroImage.jsx | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index 996e47f9f7..5bccbc4783 100644 --- a/.gitignore +++ b/.gitignore @@ -8,3 +8,4 @@ build .env yarn.lock src/*.d.ts +.vite diff --git a/src/components/Visualizations/Table/HeroImage.jsx b/src/components/Visualizations/Table/HeroImage.jsx index 605b830261..aa7d61774a 100644 --- a/src/components/Visualizations/Table/HeroImage.jsx +++ b/src/components/Visualizations/Table/HeroImage.jsx @@ -572,7 +572,7 @@ class TableHeroImage extends React.Component { )} {accountId ? ( - {title} + {title} ) : ( title )} From ddfa147dae776e8537f84816b3cab10471d6825c Mon Sep 17 00:00:00 2001 From: jeyren95 Date: Wed, 7 Feb 2024 18:35:26 +0800 Subject: [PATCH 2/4] fix(issue-3148): added playerWinLossLoading condition when navigating between player profiles --- src/components/Player/Header/PlayerHeader.jsx | 27 +++++++++++++++---- src/components/Player/Header/PlayerStats.jsx | 6 ++--- .../Visualizations/Table/HeroImage.jsx | 9 +++++-- 3 files changed, 32 insertions(+), 10 deletions(-) diff --git a/src/components/Player/Header/PlayerHeader.jsx b/src/components/Player/Header/PlayerHeader.jsx index 473a748f16..2c9c4ef55e 100644 --- a/src/components/Player/Header/PlayerHeader.jsx +++ b/src/components/Player/Header/PlayerHeader.jsx @@ -271,12 +271,27 @@ const getRankTierMedal = (rankTier, leaderboardRank) => { }; const PlayerHeader = ({ - playerName, officialPlayerName, playerId, picture, registered, plus, loading, error, small, playerSoloCompetitiveRank, loggedInUser, rankTier, leaderboardRank, strings, + playerName, + officialPlayerName, + playerId, + picture, + registered, + plus, + playerLoading, + playerError, + small, + playerSoloCompetitiveRank, + loggedInUser, + rankTier, + leaderboardRank, + strings, + playerWinLossLoading, + playerWinLossError, }) => { - if (error) { + if (playerError || playerWinLossError) { return ; } - if (loading) { + if (playerLoading || playerWinLossLoading) { return ; } @@ -358,8 +373,10 @@ PlayerHeader.propTypes = { }; const mapStateToProps = state => ({ - loading: state.app.player.loading, - error: state.app.player.error, + playerLoading: state.app.player.loading, + playerWinLossLoading: state.app.playerWinLoss.loading, + playerError: state.app.player.error, + playerWinLossError: state.app.playerWinLoss.error, playerName: (state.app.player.data.profile || {}).personaname, officialPlayerName: (state.app.player.data.profile || {}).name, playerSoloCompetitiveRank: state.app.player.data.solo_competitive_rank, diff --git a/src/components/Player/Header/PlayerStats.jsx b/src/components/Player/Header/PlayerStats.jsx index db27a30b3b..9dda2292dc 100644 --- a/src/components/Player/Header/PlayerStats.jsx +++ b/src/components/Player/Header/PlayerStats.jsx @@ -3,8 +3,8 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; // import ActionHelp from 'material-ui/svg-icons/action/help'; import styled from 'styled-components'; +import { Facebook } from 'react-content-loader'; import Error from '../../Error'; -import Spinner from '../../Spinner'; import PlayedWith from './PlayedWith'; import { PlayerStatsCard } from './Styled'; import constants from '../../constants'; @@ -68,7 +68,7 @@ export const PlayerStatsCards = ({ return ; } if (loading) { - return ; + return ; } return ( @@ -109,7 +109,7 @@ PlayerStatsCards.propTypes = { }; const mapStateToProps = state => ({ - loading: state.app.player.loading, + loading: state.app.playerWinLoss.loading, error: state.app.player.error, wins: state.app.playerWinLoss.data.win, losses: state.app.playerWinLoss.data.lose, diff --git a/src/components/Visualizations/Table/HeroImage.jsx b/src/components/Visualizations/Table/HeroImage.jsx index aa7d61774a..d6d3fb03ce 100644 --- a/src/components/Visualizations/Table/HeroImage.jsx +++ b/src/components/Visualizations/Table/HeroImage.jsx @@ -1,4 +1,5 @@ import React from 'react'; +import { withRouter } from 'react-router-dom'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import ReactTooltip from 'react-tooltip'; @@ -464,6 +465,7 @@ class TableHeroImage extends React.Component { predictedVictory, leaverStatus, strings, + match, hero = {}, } = this.props; const { tooltipVisible } = this.state; @@ -477,6 +479,9 @@ class TableHeroImage extends React.Component { }, }; + const { params } = match; + const { playerId } = params; + return ( @@ -572,7 +577,7 @@ class TableHeroImage extends React.Component { )} {accountId ? ( - {title} + {title} ) : ( title )} @@ -828,4 +833,4 @@ const mapStateToProps = (state) => ({ strings: state.app.strings, }); -export default connect(mapStateToProps)(TableHeroImage); +export default withRouter(connect(mapStateToProps)(TableHeroImage)); From 821084e1a20020a7bd986eee458447b80f53af78 Mon Sep 17 00:00:00 2001 From: jeyren95 Date: Wed, 7 Feb 2024 18:46:32 +0800 Subject: [PATCH 3/4] fix(issue-3148): removed unnecessary code --- src/components/Visualizations/Table/HeroImage.jsx | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/src/components/Visualizations/Table/HeroImage.jsx b/src/components/Visualizations/Table/HeroImage.jsx index d6d3fb03ce..0a04fa2ee1 100644 --- a/src/components/Visualizations/Table/HeroImage.jsx +++ b/src/components/Visualizations/Table/HeroImage.jsx @@ -1,5 +1,4 @@ import React from 'react'; -import { withRouter } from 'react-router-dom'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import ReactTooltip from 'react-tooltip'; @@ -465,7 +464,6 @@ class TableHeroImage extends React.Component { predictedVictory, leaverStatus, strings, - match, hero = {}, } = this.props; const { tooltipVisible } = this.state; @@ -478,10 +476,7 @@ class TableHeroImage extends React.Component { this.setTooltipVisibility(false); }, }; - - const { params } = match; - const { playerId } = params; - + return ( @@ -833,4 +828,4 @@ const mapStateToProps = (state) => ({ strings: state.app.strings, }); -export default withRouter(connect(mapStateToProps)(TableHeroImage)); +export default connect(mapStateToProps)(TableHeroImage); From 93d807047d5aad3a7ab50f745b1ae4cbb22a7469 Mon Sep 17 00:00:00 2001 From: jeyren95 Date: Wed, 7 Feb 2024 19:08:50 +0800 Subject: [PATCH 4/4] fix(issue-3148): removed extra loading condition in PlayerHeader --- src/components/Player/Header/PlayerHeader.jsx | 16 ++++++---------- src/components/Player/Header/PlayerStats.jsx | 4 ++-- 2 files changed, 8 insertions(+), 12 deletions(-) diff --git a/src/components/Player/Header/PlayerHeader.jsx b/src/components/Player/Header/PlayerHeader.jsx index 2c9c4ef55e..66d3f58a11 100644 --- a/src/components/Player/Header/PlayerHeader.jsx +++ b/src/components/Player/Header/PlayerHeader.jsx @@ -277,21 +277,19 @@ const PlayerHeader = ({ picture, registered, plus, - playerLoading, - playerError, + loading, + error, small, playerSoloCompetitiveRank, loggedInUser, rankTier, leaderboardRank, strings, - playerWinLossLoading, - playerWinLossError, }) => { - if (playerError || playerWinLossError) { + if (error) { return ; } - if (playerLoading || playerWinLossLoading) { + if (loading) { return ; } @@ -373,10 +371,8 @@ PlayerHeader.propTypes = { }; const mapStateToProps = state => ({ - playerLoading: state.app.player.loading, - playerWinLossLoading: state.app.playerWinLoss.loading, - playerError: state.app.player.error, - playerWinLossError: state.app.playerWinLoss.error, + loading: state.app.player.loading, + error: state.app.player.error, playerName: (state.app.player.data.profile || {}).personaname, officialPlayerName: (state.app.player.data.profile || {}).name, playerSoloCompetitiveRank: state.app.player.data.solo_competitive_rank, diff --git a/src/components/Player/Header/PlayerStats.jsx b/src/components/Player/Header/PlayerStats.jsx index 9dda2292dc..81f7e590ec 100644 --- a/src/components/Player/Header/PlayerStats.jsx +++ b/src/components/Player/Header/PlayerStats.jsx @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; // import ActionHelp from 'material-ui/svg-icons/action/help'; import styled from 'styled-components'; -import { Facebook } from 'react-content-loader'; +import Spinner from '../../Spinner'; import Error from '../../Error'; import PlayedWith from './PlayedWith'; import { PlayerStatsCard } from './Styled'; @@ -68,7 +68,7 @@ export const PlayerStatsCards = ({ return ; } if (loading) { - return ; + return ; } return (