Skip to content

Replaced some NumberPickers to reduce the number of warnings#3161

Closed
offtherailz wants to merge 3 commits intogeosolutions-it:masterfrom
offtherailz:fix_setState_warnings
Closed

Replaced some NumberPickers to reduce the number of warnings#3161
offtherailz wants to merge 3 commits intogeosolutions-it:masterfrom
offtherailz:fix_setState_warnings

Conversation

@offtherailz
Copy link
Copy Markdown
Member

Description

Last travis and jenkins builds became unreadable. This is mainly due to ThematicMaps usage of NumberPickers. Tests on this react-widgets component create a lot of warnings that make the log grow a lot.
This replaces NumberPicker for ThematicMaps and for FilterField, where the NumberPickers is used with minimal functionalities, with an home made class that preserves the style of react widgets and implements only minimal functionalities.
The NumberPicker component is also used in styler for shape file and raster styler (that I don't know if it is yet used).

---> Please test thematic maps before merge this pull request. <--

Please check if the PR fulfills these requirements

What kind of change does this PR introduce? (check one with "x", remove the others)

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Other... Please describe:

What is the current behavior? (You can also link to an open issue here)
Travis log is very full of warning like this

ERROR: 'Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the Viewport component.'

What is the new behavior?
The log is still big, the warnings above was not removed at all, but a lot of them is not there anymore. This makes the log a little more manageble.

Does this PR introduce a breaking change? (check one with "x", remove the other)

  • No

@ghost ghost assigned offtherailz Aug 9, 2018
@offtherailz offtherailz requested a review from mbarto August 9, 2018 15:51
@coveralls
Copy link
Copy Markdown

coveralls commented Aug 9, 2018

Coverage Status

Coverage increased (+0.02%) to 81.065% when pulling 4c98665 on offtherailz:fix_setState_warnings into 415e63d on geosolutions-it:master.

@offtherailz
Copy link
Copy Markdown
Member Author

offtherailz commented Aug 10, 2018

Old one 9735 rows of log

new one 3822 rows of log

const isValid = v => {
return TEMP_NUMBER_REGEX.test(`${v}`);
};
const isNumber = v => {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

why don't we use lodash isNumber?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

Is a little different: isNumber don't exclude -Infinity, +Infinity, NaN. Maybe I can use _.isFinite somehow, but the scope of this function is to check if the number inserted by the user "as string" is a valid number.

return !isNaN(vv) && isValid(vv);
};

const round = (v, precision = 0) => {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Is this different than lodash round?

Copy link
Copy Markdown
Member Author

@offtherailz offtherailz Sep 4, 2018

Choose a reason for hiding this comment

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

Not sure, it returns a string. I get it from the original NumberPicker. It also avoid float .99999 issues

Copy link
Copy Markdown
Member Author

@offtherailz offtherailz Oct 3, 2018

Choose a reason for hiding this comment

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

The purpose is to re-use as much as possible the logic of the original NumberPicker.
See this

@@ -0,0 +1,105 @@
/*
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

I don't get any documentation for this component, not even from PropTypes, so it's not very clear how to use it.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

Sure, I should document it. Going to do it

</Col>
<Col xs="4">
<NumberPicker
format="- ###.###"
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

So we lost the ability to specify a format... we can live without it, I think

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

Yes, for the moment I couldn't implement all the functionalities of the original one.

<NumberPicker
format="- ###.###"
value={classItem.max}
precision={3}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

So, we also lost the ability to specify precision, but I can see precision handling in the component. How can I use it?

Copy link
Copy Markdown
Member Author

@offtherailz offtherailz Sep 4, 2018

Choose a reason for hiding this comment

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

I removed this because is misaligned with NumberPicker for min value, so I thought it was a typo.

@tdipisa
Copy link
Copy Markdown
Member

tdipisa commented Sep 28, 2018

@offtherailz, documentation needed before merging this.

@offtherailz
Copy link
Copy Markdown
Member Author

@mbarto I found a second to document a little bit more the component. Please take a look, so we can merge this.

@mbarto
Copy link
Copy Markdown
Contributor

mbarto commented Oct 3, 2018

This one (#3207) should solve the same issue, completely, without code rewrite. If you don't see any drawback I think it's preferrable.

@offtherailz
Copy link
Copy Markdown
Member Author

Great solution! didn't found this option. Going to close this PR

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants