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

Update disabled backend component #4747

Merged
merged 3 commits into from
Feb 5, 2025
Merged

Update disabled backend component #4747

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6b635ed
Update disabled backend component
carlosabadia Feb 4, 2025
b0685c1
fix test message
adhami3310 Feb 4, 2025
8a7116a
it's ruff out there
adhami3310 Feb 4, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
114 changes: 95 additions & 19 deletions reflex/components/core/banner.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
from reflex import constants
from reflex.components.component import Component
from reflex.components.core.cond import cond
from reflex.components.datadisplay.logo import svg_logo
from reflex.components.el.elements.typography import Div
from reflex.components.lucide.icon import Icon
from reflex.components.radix.themes.components.dialog import (
Expand Down Expand Up @@ -330,36 +329,113 @@ def create(cls, **props) -> Component:
rx.cond(
is_backend_disabled,
rx.box(
rx.el.link(
rel="preconnect",
href="https://fonts.googleapis.com",
),
rx.el.link(
rel="preconnect",
href="https://fonts.gstatic.com",
crossorigin="",
),
rx.el.link(
href="https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,500;0,600&display=swap",
rel="stylesheet",
),
rx.box(
rx.card(
rx.vstack(
svg_logo(),
rx.text(
"You ran out of compute credits.",
rx.vstack(
rx.text(
"This app is paused",
font_size="1.5rem",
font_weight="600",
line_height="1.25rem",
letter_spacing="-0.0375rem",
),
rx.hstack(
rx.el.svg(
rx.el.svg.path(
d="M6.90816 1.34341C7.61776 1.10786 8.38256 1.10786 9.09216 1.34341C9.7989 1.57799 10.3538 2.13435 10.9112 2.91605C11.4668 3.69515 12.0807 4.78145 12.872 6.18175L12.9031 6.23672C13.6946 7.63721 14.3085 8.72348 14.6911 9.60441C15.0755 10.4896 15.267 11.2539 15.1142 11.9881C14.9604 12.7275 14.5811 13.3997 14.0287 13.9079C13.4776 14.4147 12.7273 14.6286 11.7826 14.7313C10.8432 14.8334 9.6143 14.8334 8.0327 14.8334H7.9677C6.38604 14.8334 5.15719 14.8334 4.21778 14.7313C3.27301 14.6286 2.52269 14.4147 1.97164 13.9079C1.41924 13.3997 1.03995 12.7275 0.88613 11.9881C0.733363 11.2539 0.92483 10.4896 1.30926 9.60441C1.69184 8.72348 2.30573 7.63721 3.09722 6.23671L3.12828 6.18175C3.91964 4.78146 4.53355 3.69515 5.08914 2.91605C5.64658 2.13435 6.20146 1.57799 6.90816 1.34341ZM7.3335 11.3334C7.3335 10.9652 7.63063 10.6667 7.99716 10.6667H8.00316C8.3697 10.6667 8.66683 10.9652 8.66683 11.3334C8.66683 11.7016 8.3697 12.0001 8.00316 12.0001H7.99716C7.63063 12.0001 7.3335 11.7016 7.3335 11.3334ZM7.3335 8.66675C7.3335 9.03495 7.63196 9.33341 8.00016 9.33341C8.36836 9.33341 8.66683 9.03495 8.66683 8.66675V6.00008C8.66683 5.63189 8.36836 5.33341 8.00016 5.33341C7.63196 5.33341 7.3335 5.63189 7.3335 6.00008V8.66675Z",
fill_rule="evenodd",
clip_rule="evenodd",
fill=rx.color("amber", 11),
),
width="16",
height="16",
viewBox="0 0 16 16",
fill="none",
xmlns="http://www.w3.org/2000/svg",
margin_top="0.125rem",
flex_shrink="0",
),
rx.callout(
rx.fragment(
"Please upgrade your plan or raise your compute credits at ",
rx.link(
"Reflex Cloud.",
href="https://cloud.reflex.dev/",
),
rx.text(
"If you are the owner of this app, visit ",
rx.link(
"Reflex Cloud",
color=rx.color("amber", 11),
underline="always",
_hover={
"color": rx.color("amber", 11),
"text_decoration_color": rx.color(
"amber", 11
),
},
text_decoration_color=rx.color("amber", 10),
href="https://cloud.reflex.dev/",
font_weight="600",
is_external=True,
),
" for more information on how to resume your app.",
font_size="0.875rem",
font_weight="500",
line_height="1.25rem",
letter_spacing="-0.01094rem",
color=rx.color("amber", 11),
),
align="start",
gap="0.625rem",
border_radius="0.75rem",
border_width="1px",
border_color=rx.color("amber", 5),
background_color=rx.color("amber", 3),
padding="0.625rem",
),
rx.link(
rx.el.button(
"Resume app",
color="rgba(252, 252, 253, 1)",
font_size="0.875rem",
font_weight="600",
line_height="1.25rem",
letter_spacing="-0.01094rem",
height="2.5rem",
padding="0rem 0.75rem",
width="100%",
icon="info",
variant="surface",
border_radius="0.75rem",
background=f"linear-gradient(180deg, {rx.color('violet', 9)} 0%, {rx.color('violet', 10)} 100%)",
_hover={
"background": f"linear-gradient(180deg, {rx.color('violet', 10)} 0%, {rx.color('violet', 10)} 100%)",
},
),
width="100%",
underline="none",
href="https://cloud.reflex.dev/",
is_external=True,
),
font_size="20px",
font_family='"Inter", "Helvetica", "Arial", sans-serif',
variant="classic",
gap="1rem",
),
font_family='"Instrument Sans", "Helvetica", "Arial", sans-serif',
position="fixed",
top="50%",
left="50%",
transform="translate(-50%, -50%)",
width="40ch",
width="60ch",
max_width="90vw",
border_radius="0.75rem",
border_width="1px",
border_color=rx.color("slate", 4),
padding="1.5rem",
background_color=rx.color("slate", 1),
box_shadow="0px 2px 5px 0px light-dark(rgba(28, 32, 36, 0.03), rgba(0, 0, 0, 0.00))",
),
position="fixed",
z_index=9999,
Expand Down
4 changes: 1 addition & 3 deletions tests/integration/test_connection_banner.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,9 +119,7 @@ def has_cloud_banner(driver: WebDriver) -> bool:
True if the banner is displayed, False otherwise.
"""
try:
driver.find_element(
By.XPATH, "//*[ contains(text(), 'You ran out of compute credits.') ]"
)
driver.find_element(By.XPATH, "//*[ contains(text(), 'This app is paused') ]")
except NoSuchElementException:
return False
else:
Expand Down