asked on June 24, 2021
Hi
We are testing 2.9 upgrade but found some issues with the toolbar
We upgrade by updating the react-flexmonster and flexmonster libraries to 2.9. Our project is a 'create react app' project.
⋅ 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
⋅ 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
⋅ 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
⋅ 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)
⋅ 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
⋅ 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
⋅ 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
⋅ June 30, 2021
Hi Illia
Updating the less files fixed the issue. Thanks for your help.
⋅ 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?
⋅ 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
⋅ 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?)
⋅ 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
