Typing Crashes Streamlit App

[Welnic]

Hi!

I've been able to reproduce a rather unique bug, it seems like typing fast in text fields or even typing at normal speed in larger trees crashes the component and renders the entire tree empty.

My understanding is that Streamlit is rerunning code whenever a field receives input (every key) and that may be the culprit, potentially debouncing user input could fix it but I can't determine whether this is a Streamlit issue, a streamlit-condition-tree issue or the actual react library issue.

I've recorded a Jam showcasing this happening in the official demo page here.

[Welnic]

Hi @cedricvlt

I'm following up on the issue I opened regarding the bug in the Streamlit Condition Tree component. I've implemented some fixes that address the problems I encountered and would like to suggest these changes for inclusion in a new version of the library.

• Debounce Functionality: I've added debounce functionality to the component. This ensures that the setStreamlitValue function is not called too frequently when the user is rapidly inputting data. This improvement should enhance performance and reduce unnecessary updates, addressing the crash issues I reported when typing quickly in text fields or working with larger trees.

• Dynamic Height: I've implemented a dynamic height feature for the component. The initial height is set to 150 pixels and expands to a minimum height when the "add rule" or "add group" buttons are clicked. The component then resizes dynamically as content is added or removed. This change addresses the issue of excessive empty space when the component is placed in the middle of the page and not immediately interacted with.

These modifications have significantly improved the component's stability and user experience in my testing. You can find the implemented changes here: I would greatly appreciate it if you could review these changes and consider incorporating them into a new version of the library.