Unexpected rendering when passing props based on state
alberteddu opened this issue · comments
Describe the bug
Rendering arwes components where the props are defined based on stateful values is causing problems. To be precise, the elements seem to retain prop values that had at the time of rendering.
To reproduce
See this sandbox.
The component here defines a state called active which can be changed with the two buttons. As the "active" string changes, the disabled and active props of the two buttons is set.
Expected behavior
When clicking on the second button, the second button should get the background that "active" causes, while the first button should lose its background as the "active" props becomes false.
Screenshots
The first button seems to stay active no matter what, even when the prop is false.
Development environment
- Packages version: @arwes/core, version: ^1.0.0-alpha.19
- Node.js and NPM version: NodeJS: v17.4.0, NPM: 8.3.1
Testing environment
- OS: MacOS Monterey
- Browser: Chrome 97
Additional context
I would love to contribute a fix (if this is actually a bug) but at the moment I'm not quite sure what's the cause.
Hello @alberteddu !
Yes, it's a bug in the frame core component.
Since refactors will come, it is not ready for development and contribution.
Thank you for reporting it. Adding it to the backlog.
i am also facing the same issue
The frame UI components have been refactored. Now they don't provide out of the box styles but they need to be configured/setup according to the needs of the project from CSS/CSSinJS. So this task is not relevant anymore.
You can check out examples here: https://next.arwes.dev/play/?code=&type=predefined&sandbox=Components%7C%40arwes%2Freact-frames%7CFrameSVGUnderline%7Cassembling