Get Free Trial

Upgrade to 2.9 toolbar issues

Answered
dan asked on June 24, 2021

Hi 
We are testing 2.9 upgrade but found some issues with the toolbar

  • export button has no response
  • Grid button has no response
  • No hover pops up on chart button, clicking the button has no response

We upgrade by updating the react-flexmonster and flexmonster libraries to 2.9. Our project is a ‘create react app’ project. 

12 answers

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster June 24, 2021

Hello,
 
Thank you for reaching out.
 
We assume the reason for this issue may be the Toolbar customization performed on your side. Please note that the new “Share” tab was introduced in 2.9. It is hidden by default; still, it takes its place in the array of tabs that you may customize.
 
We suggest checking if your customization is not tied to tabs’ indexes. We suggest using their id to avoid similar situations.
 
If the issue remains or you do not use the Toolbar customization, please send us a sample where the issue would be reproducible.
 
Looking forward to hearing from you.
 
Kind regards,
Illia

Public
dan June 24, 2021

Hi Illia
We removed the customization bit, now the toolbar is showing the default icons, and we found that the ‘connect’, ‘open’, ‘export’, ‘grid’, ‘charts’, ‘format’ icons had no response.
Unfortunately it’s not easy for me to send you a sample due to company policies.
I am suspecting some we might have missed to update some dependencies. The upgrade was done manually by updating the libraries react/react-flexmonster/react-dom/flexmonster to the following versions

 “flexmonster”: “2.9.1”,
    “react”: “^17.0.1”,
    “react-dom”: “^17.0.1”,
    “react-flexmonster”: “2.9.1-1”

Can you see if we missed something?
 
Again due to company restrictions we cannot install the flexmonster cli.
 
regards
Dan

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster June 24, 2021

Hello, Dan,
 
Thank you for your feedback.
 
Could you please clarify that the Toolbar customization is disabled entirely, and the issue remains? If the customization is partly disabled, please send us the customization function passed as a handler of the beforetoolbarcreated event. It would allow us to test the behavior locally.
 
If the customization is completely disabled, we suggest clearing the browser’s cache and performing the hard reload of the page. It is required to make sure all the latest Flexmonster files are used on the page.
 
Concerning the sample, do you think it would be possible to provide us with access to some isolated part of your environment so that we could test the behavior? You can use dummy data or leave the report empty if needed.
 
Finally, we would like to ask you for an illustration (for example, a screen record) of the behavior. Also, please check if any errors are displayed in the console when attempting to use the Toolbar.
 
Looking forward to your reply.
 
Best regards,
Illia

Public
dan June 25, 2021

Hi Illia
Yes all toolbar customization is disabled entirely, the issue remains.
Control-refreshed the page, the issue still remains.
Found some errors in console, doesn’t seem to be related? but here it is..
 
index.js:1 Warning: Failed prop type: The prop `alignContent` of `Grid` must be used on `container`.
at WithStyles(ForwardRef(Grid)) (http://localhost:3000/static/js/0.chunk.js:188184:31)
at Pivot (http://localhost:3000/static/js/main.chunk.js:17085:86)
 
index.js:1 Warning: Failed prop type: Invalid prop `fullWidth` of type `string` supplied to `ForwardRef(Dialog)`, expected `boolean`.
at Dialog (http://localhost:3000/static/js/0.chunk.js:8494:29)
at WithStyles(ForwardRef(Dialog)) (http://localhost:3000/static/js/0.chunk.js:188184:31)
at FormDialog (http://localhost:3000/static/js/main.chunk.js:1529:17)
at Pivot (http://localhost:3000/static/js/main.chunk.js:17085:86)
 
index.js:1 Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of PivotTable which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node
at div
at PivotTable (http://localhost:3000/static/js/main.chunk.js:6344:1)

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster June 25, 2021

Hello, Dan,
 
Thank you for the details.
 
We reproduced the behavior using an older version of the CSS file with the latest version of the component.
Please make sure the latest version of styles is used in your project. The required CSS file can be found in the “flexmonster” npm package. It is automatically updated along with the package itself. Please check if your imports point specifically to this file, e.g., import 'flexmonster/flexmonster.css';.
 
Looking forward to your feedback.
 
Regards,
Illia

Public
dan June 28, 2021

Hi Illia
Indeed we customize the flexmonster css to integrate with our UI. That was done by changing flexmonster.less and generate css. Do you know what are the changes in flexmonster.less?
 
regards
KL

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster June 29, 2021

Hello, Dan,
 
We suggest checking out our documentation dedicated to CSS customization: Сustomizing appearance (please see the “Further customization” section). This section describes the recommended approach of adding custom styles that would not cause any issues during updating.
 
Please let us know if it helps.
 
Kind regards,
Illia

Public
dan June 30, 2021

Hi Illia
Updating the less files fixed the issue. Thanks for your help.

Public
dan July 5, 2021

Hi Illia
We didn’t notice much of a performance change after upgrading. In this page it mentions Flexmonster now “styles 3 times faster”, specifically what does it mean?
Are there any changes we should be making to improve performance of 2.9 upgrade?
 

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster July 6, 2021

Hello,
 
Thank you for your question.
 
By saying “style 3 times as fast” we mean up to three times better performance when loading CSV and JSON data sets.
You do not need to make any additional changes after updating the component to receive the improved performance.
 
Feel free to contact us if other questions arise.
 
Kind regards,
Illia

Public
dan July 6, 2021

Hi Illia
We use streaming csv data sources but didn’t see much change in performance. Under what conditions are performances improved? (eg, csv of particular data types?)

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster July 7, 2021

Hello, Dan.
 
Performance is improved for some specific cases when using JSON or CSV data sources. For example, datasets containing many unique members can be analyzed much faster in the major 2.9 version of the component. The difference may not be so significant for average datasets with fewer unique members.
 
Feel free to contact us if other questions occur.
 
Best regards,
Illia

Please login or Register to Submit Answer