Ensured same timestamp is used when generating memoization ID after mounting the component

This commit is contained in:
Alejandro Celaya 2019-03-04 18:19:50 +01:00
parent 252edaa2ca
commit 7e27ceb885

View file

@ -36,8 +36,7 @@ const ShortUrlVisits = ({ processStatsFromVisits }) => class ShortUrlVisits exte
const { startDate, endDate } = dates; const { startDate, endDate } = dates;
// While the "page" is loaded, use the timestamp + filtering dates as memoization IDs for stats calcs // While the "page" is loaded, use the timestamp + filtering dates as memoization IDs for stats calcs
this.memoizationId = `${new Date().getTime()}_${shortCode}_${startDate}_${endDate}`; this.memoizationId = `${this.timeWhenMounted}_${shortCode}_${startDate}_${endDate}`;
getShortUrlVisits(shortCode, dates); getShortUrlVisits(shortCode, dates);
}; };
@ -45,6 +44,7 @@ const ShortUrlVisits = ({ processStatsFromVisits }) => class ShortUrlVisits exte
const { match: { params }, getShortUrlDetail } = this.props; const { match: { params }, getShortUrlDetail } = this.props;
const { shortCode } = params; const { shortCode } = params;
this.timeWhenMounted = new Date().getTime();
this.loadVisits(); this.loadVisits();
getShortUrlDetail(shortCode); getShortUrlDetail(shortCode);
} }
@ -137,7 +137,7 @@ const ShortUrlVisits = ({ processStatsFromVisits }) => class ShortUrlVisits exte
placeholderText="Since" placeholderText="Since"
isClearable isClearable
maxDate={this.state.endDate} maxDate={this.state.endDate}
onChange={(date) => this.setState({ startDate: date }, () => this.loadVisits())} onChange={(date) => this.setState({ startDate: date }, this.loadVisits)}
/> />
</div> </div>
<div className="col-xl-3 col-lg-4 col-md-6"> <div className="col-xl-3 col-lg-4 col-md-6">
@ -147,7 +147,7 @@ const ShortUrlVisits = ({ processStatsFromVisits }) => class ShortUrlVisits exte
placeholderText="Until" placeholderText="Until"
isClearable isClearable
minDate={this.state.startDate} minDate={this.state.startDate}
onChange={(date) => this.setState({ endDate: date }, () => this.loadVisits())} onChange={(date) => this.setState({ endDate: date }, this.loadVisits)}
/> />
</div> </div>
</div> </div>