update connection banner and connection modal to use Radix component instead of chakra (#2593)

This commit is contained in:
Thomas Brandého 2024-02-13 21:05:59 +01:00 committed by GitHub
parent fda6785d56
commit 5328f624d4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 21 additions and 10 deletions

View File

@ -1,14 +1,19 @@
"""Banner components."""
from __future__ import annotations
from typing import Optional
from reflex.components.base.bare import Bare
from reflex.components.chakra.layout import Box
from reflex.components.chakra.overlay.modal import Modal
from reflex.components.chakra.typography import Text
from reflex.components.component import Component
from reflex.components.core.cond import cond
from reflex.components.radix.themes.components.dialog import (
DialogContent,
DialogRoot,
DialogTitle,
)
from reflex.components.radix.themes.layout import Box
from reflex.components.radix.themes.typography.text import Text
from reflex.constants import Dirs, Hooks, Imports
from reflex.utils import imports
from reflex.vars import Var, VarData
@ -105,9 +110,11 @@ class ConnectionModal(Component):
comp = Text.create(*default_connection_error())
return cond(
has_connection_error,
Modal.create(
header="Connection Error",
body=comp,
is_open=has_connection_error,
DialogRoot.create(
DialogContent.create(
DialogTitle.create("Connection Error"),
comp,
),
open=has_connection_error,
),
)

View File

@ -9,11 +9,15 @@ from reflex.event import EventChain, EventHandler, EventSpec
from reflex.style import Style
from typing import Optional
from reflex.components.base.bare import Bare
from reflex.components.chakra.layout import Box
from reflex.components.chakra.overlay.modal import Modal
from reflex.components.chakra.typography import Text
from reflex.components.component import Component
from reflex.components.core.cond import cond
from reflex.components.radix.themes.components.dialog import (
DialogContent,
DialogRoot,
DialogTitle,
)
from reflex.components.radix.themes.layout import Box
from reflex.components.radix.themes.typography.text import Text
from reflex.constants import Dirs, Hooks, Imports
from reflex.utils import imports
from reflex.vars import Var, VarData