Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FlatTermSelector: Set Correct Loading State #13758

Merged
merged 2 commits into from
Feb 13, 2019
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ class FlatTermSelector extends Component {

componentDidMount() {
if ( ! isEmpty( this.props.terms ) ) {
this.setState( { loading: false } );
this.setState( { loading: true } );
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @tfrommen thank you for your PR. Would it work if we set the loading state true when ! isEmpty( this.props.terms ) on the constructor instead of on componentDidMount? The reason being we would avoid an unnecessary rerender that happens when setting state via componentDidMount.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @jorgefilipecosta - hm, sure, I could do that. And I understand your reasoning.

On the other hand, it somehow feels a bit strange to split the actual loading logic (including the subsequent loading: false) from the part where we set the loading state to be true (in the constructor). 🤔 🤷‍♂️

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @tfrommen,
On the constructor, we are initializing the state to false loading: false,. I don't think it is wrong to initialize to true or false depending on if this.props.terms is empty or not. If terms exist we know that the component will start the loading process.
Basically, we would set the loading on the constructor and unset the loading when the request is finished, I agree the code would look better if this logical parts were together but given the performance reason I think the separation is ok.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jorgefilipecosta updated as per your feedback.

this.initRequest = this.fetchTerms( {
include: this.props.terms.join( ',' ),
per_page: -1,
Expand Down