Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[REF-1994] rx.theme(appearance='dark') freezes whole app #2650

Closed
vhunyad opened this issue Feb 17, 2024 · 5 comments · Fixed by #2799
Closed

[REF-1994] rx.theme(appearance='dark') freezes whole app #2650

vhunyad opened this issue Feb 17, 2024 · 5 comments · Fixed by #2799
Assignees
@masenf
Labels
bug Something isn't working linear Created by Linear-GitHub Sync
Milestone
v.24

Comments

@vhunyad
Copy link

vhunyad commented Feb 17, 2024 •
edited by masenf

#2654

Describe the bug
In case of dark, without any styles, app freezes, automatically opening themepanel is not responding.

To Reproduce

app = rx.App(
    theme=rx.theme(appearance='dark'),
    )

Expected behavior

Screenshots

Specifics (please complete the following information):

  • Python Version: 3.9.2
  • Reflex Version: 0.4.0
  • OS: debian 11
  • Browser (Optional):

Additional context

From SyncLinear.com | REF-1994
@vhunyad
Copy link
Author

vhunyad commented Feb 17, 2024

If I keep it on 'light', it starts and I also can change to dark on ThemePanel. Only default dark produces this.

@masenf masenf added bug Something isn't working linear Created by Linear-GitHub Sync labels Feb 17, 2024
@masenf masenf changed the title rx.theme(appearance='dark') freezes whole app [REF-1994] rx.theme(appearance='dark') freezes whole app Feb 17, 2024
@masenf
Copy link
Collaborator

masenf commented Feb 17, 2024

Yes this is a bug, something internally seems to be fighting to change it light mode when appearance="dark" and its locking up the app.

Thanks for reporting.

@masenf masenf mentioned this issue Feb 18, 2024
Merged
@kevinkoech357
Copy link

Experienced the same issue too. Debian 12, Chrome Browser, Python version=3.11.2, Reflex=0.4.0.

@masenf masenf added this to the 0.4.0 Bugs milestone Feb 19, 2024
@masenf masenf self-assigned this Feb 19, 2024
@masenf masenf modified the milestones: 0.4.0 Bugs, v.22 Feb 20, 2024
@ericfeunekes
Copy link

To add another version of the bug when running Reflex 0.4.1: when I set appearance=dark it just stays in light mode. But when I add a theme_panel in the app it starts up in dark mode but freezes the page.

@masenf masenf closed this as completed Feb 22, 2024
@masenf masenf reopened this Mar 6, 2024
@masenf masenf added this to the v.24 milestone Mar 6, 2024
@masenf
Copy link
Collaborator

masenf commented Mar 6, 2024

This got closed accidentally when a related bug was fixed 😔

masenf added a commit that referenced this issue Mar 6, 2024
@masenf
[REF-1994] ThemePanel: clear chakra-ui-color-mode key when using them…
9926758 
…e panel

The ThemePanel fights with the ThemeProvider when the user color preference key differs from the `appearance` prop specified in the theme. To avoid issues when using the ThemePanel (in development), clear out the user color preference before loading the page and before unloading the page (to ensure it does not freeze on reload).

Clearing the user preference isn't ideal production behavior, but typically the
ThemePanel is only used during development for trying out different styles, and
having it not freeze the app is better dev behavior.

Fix #2650
@masenf masenf mentioned this issue Mar 6, 2024
Merged
masenf added a commit that referenced this issue Mar 6, 2024
@masenf
[REF-1994] ThemePanel: clear chakra-ui-color-mode key when using them…
77d551f 
…e panel (#2799)

The ThemePanel fights with the ThemeProvider when the user color preference key differs from the `appearance` prop specified in the theme. To avoid issues when using the ThemePanel (in development), clear out the user color preference before loading the page and before unloading the page (to ensure it does not freeze on reload).

Clearing the user preference isn't ideal production behavior, but typically the
ThemePanel is only used during development for trying out different styles, and
having it not freeze the app is better dev behavior.

Fix #2650
mahrz24 pushed a commit to mahrz24/reflex that referenced this issue Mar 12, 2024
@masenf
[REF-1994] ThemePanel: clear chakra-ui-color-mode key when using them…
0f49bd7 
…e panel (reflex-dev#2799)

The ThemePanel fights with the ThemeProvider when the user color preference key differs from the `appearance` prop specified in the theme. To avoid issues when using the ThemePanel (in development), clear out the user color preference before loading the page and before unloading the page (to ensure it does not freeze on reload).

Clearing the user preference isn't ideal production behavior, but typically the
ThemePanel is only used during development for trying out different styles, and
having it not freeze the app is better dev behavior.

Fix reflex-dev#2650
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@masenf masenf

Labels
bug Something isn't working linear Created by Linear-GitHub Sync
Projects
None yet
Milestone
v.24
Development

Successfully merging a pull request may close this issue.

[REF-1994] ThemePanel: clear chakra-ui-color-mode key when using theme panel reflex-dev/reflex
4 participants
@masenf @ericfeunekes @vhunyad @kevinkoech357