0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2025-01-27 22:59:51 -05:00

fix: ui change details issue in props update (#959) (#960)

This commit is contained in:
Ayush Sharma 2018-08-28 08:04:15 +02:00 committed by Juan Picado @jotadeveloper
parent 96bed90db1
commit 431e7608d2
2 changed files with 12 additions and 13 deletions

View file

@ -30,12 +30,6 @@ export default class PackageSidebar extends React.Component {
await this.loadPackageData(this.props.packageName); await this.loadPackageData(this.props.packageName);
} }
async UNSAFE_componentWillReceiveProps(newProps) {
if (newProps.packageName !== this.props.packageName) {
await this.loadPackageData(newProps.packageName);
}
}
async loadPackageData(packageName) { async loadPackageData(packageName) {
let packageMeta; let packageMeta;

View file

@ -20,12 +20,14 @@ export default class Detail extends Component {
state = { state = {
readMe: '', readMe: '',
notFound: false, notFound: false
}; };
getPackageName(props = this.props) { getPackageName(props = this.props) {
const params = props.match.params; const params = props.match.params;
return `${(params.scope && '@' + params.scope + '/') || ''}${params.package}`; return `${(params.scope && '@' + params.scope + '/') || ''}${
params.package
}`;
} }
get packageName() { get packageName() {
return this.getPackageName(); return this.getPackageName();
@ -35,9 +37,12 @@ export default class Detail extends Component {
await this.loadPackageInfo(this.packageName); await this.loadPackageInfo(this.packageName);
} }
componentDidUpdate(newProps) { componentDidUpdate(prevProps) {
if (newProps.isUserLoggedIn !== this.props.isUserLoggedIn) { const condition1 = prevProps.isUserLoggedIn !== this.props.isUserLoggedIn;
const packageName = this.getPackageName(newProps); const condition2 =
prevProps.match.params.package !== this.props.match.params.package;
if (condition1 || condition2) {
const packageName = this.getPackageName(this.props);
this.loadPackageInfo(packageName); this.loadPackageInfo(packageName);
} }
} }
@ -64,13 +69,13 @@ export default class Detail extends Component {
const {notFound, readMe} = this.state; const {notFound, readMe} = this.state;
if (notFound) { if (notFound) {
return <NotFound pkg={this.packageName}/>; return <NotFound pkg={this.packageName} />;
} else if (isEmpty(readMe)) { } else if (isEmpty(readMe)) {
return <Loading text={loadingMessage} />; return <Loading text={loadingMessage} />;
} }
return ( return (
<div className={classes.twoColumn}> <div className={classes.twoColumn}>
<PackageDetail readMe={readMe} packageName={this.packageName}/> <PackageDetail readMe={readMe} packageName={this.packageName} />
<PackageSidebar packageName={this.packageName} /> <PackageSidebar packageName={this.packageName} />
</div> </div>
); );