feature/mx-1889 prep reflex 0.7.3

CHANGELOG.md

@@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changes
 
 - run local test browser in headed mode with higher resolution
+- prepare reflex upgrade to 0.7.3
 
 ### Deprecated
 

mex/editor/components.py

@@ -1,3 +1,5 @@
+from typing import Any
+
 import reflex as rx
 
 from mex.editor.ingest.state import IngestState
@@ -10,11 +12,11 @@ def render_title(title: EditorValue) -> rx.Component:
     """Render one title in a container with hidden overflow."""
     return rx.box(
         render_value(title),
-        style={
-            "fontWeight": "var(--font-weight-bold)",
-            "overflow": "hidden",
-            "whiteSpace": "nowrap",
-        },
+        style=rx.Style(
+            fontWeight="var(--font-weight-bold)",
+            overflow="hidden",
+            whiteSpace="nowrap",
+        ),
     )
 
 
@@ -24,7 +26,10 @@ def render_additional_titles(titles: list[EditorValue]) -> rx.Component:
         titles,
         rx.hover_card.root(
             rx.hover_card.trigger(
-                rx.badge("+ additional titles", style=rx.Style(margin="auto 0")),
+                rx.badge(
+                    "+ additional titles",
+                    style=rx.Style(margin="auto 0"),
+                ),
                 custom_attrs={"data-testid": "tooltip-additional-titles-trigger"},
             ),
             rx.hover_card.content(
@@ -42,14 +47,14 @@ def render_search_preview(values: list[EditorValue]) -> rx.Component:
             values,
             render_value,
         ),
-        style={
-            "color": "var(--gray-12)",
-            "fontWeight": "var(--font-weight-light)",
-            "whiteSpace": "nowrap",
-            "overflow": "hidden",
-            "textOverflow": "ellipsis",
-            "maxWidth": "100%",
-        },
+        style=rx.Style(
+            color="var(--gray-12)",
+            fontWeight="var(--font-weight-light)",
+            whiteSpace="nowrap",
+            overflow="hidden",
+            textOverflow="ellipsis",
+            maxWidth="100%",
+        ),
     )
 
 
@@ -62,7 +67,7 @@ def render_identifier(value: EditorValue) -> rx.Component:
                 value.text,
                 "Loading ...",
             ),
-            on_click=State.navigate(value.href),
+            on_click=State.navigate(value.href),  # type: ignore[misc]
             high_contrast=True,
             role="link",
             class_name="truncate",
@@ -85,7 +90,7 @@ def render_external_link(value: EditorValue) -> rx.Component:
             value.text,
             value.href,
         ),
-        href=f"{value.href}",
+        href=value.href,
         high_contrast=True,
         is_external=True,
         title=value.text,
@@ -136,7 +141,7 @@ def render_badge(text: str | None) -> rx.Component:
         radius="large",
         variant="soft",
         color_scheme="gray",
-        style={"margin": "auto 0"},
+        style=rx.Style(margin="auto 0"),
     )
 
 
@@ -170,7 +175,7 @@ def pagination(state: type[IngestState | SearchState]) -> rx.Component:
             disabled=state.disable_previous_page,
             variant="surface",
             custom_attrs={"data-testid": "pagination-previous-button"},
-            style={"minWidth": "10%"},
+            style=rx.Style(minWidth="10%"),
         ),
         rx.select(
             state.page_selection,
@@ -195,36 +200,73 @@ def pagination(state: type[IngestState | SearchState]) -> rx.Component:
             disabled=state.disable_next_page,
             variant="surface",
             custom_attrs={"data-testid": "pagination-next-button"},
-            style={"minWidth": "10%"},
+            style=rx.Style(minWidth="10%"),
         ),
         spacing="4",
-        style={"width": "100%"},
+        style=rx.Style(width="100%"),
     )
 
 
 def icon_by_stem_type(
-    stem_type: str | None,
-    **props: int | str | rx.Color,
-) -> rx.Component:
+    stem_type: str | None = None,
+    size: int | None = None,
+    style: rx.Style | None = None,
+) -> rx.Component | rx.Var[Any]:
     """Render an icon for the given stem type."""
     # Sigh, https://reflex.dev/docs/library/data-display/icon#using-dynamic-icon-tags
-    return rx.box(
-        rx.match(
-            stem_type,
-            ("AccessPlatform", rx.icon("app_window", **props)),
-            ("Activity", rx.icon("circle_gauge", **props)),
-            ("BibliographicResource", rx.icon("book_marked", **props)),
-            ("Consent", rx.icon("badge_check", **props)),
-            ("ContactPoint", rx.icon("inbox", **props)),
-            ("Distribution", rx.icon("container", **props)),
-            ("Organization", rx.icon("building", **props)),
-            ("OrganizationalUnit", rx.icon("door_open", **props)),
-            ("Person", rx.icon("circle_user_round", **props)),
-            ("PrimarySource", rx.icon("hard_drive", **props)),
-            ("Resource", rx.icon("archive", **props)),
-            ("Variable", rx.icon("box", **props)),
-            ("VariableGroup", rx.icon("boxes", **props)),
-            rx.icon("file_question", **props),
-        ),
-        title=stem_type,
+    return rx.match(
+        stem_type,
+        (
+            "AccessPlatform",
+            rx.icon("app_window", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Activity",
+            rx.icon("circle_gauge", size=size, style=style, title=stem_type),
+        ),
+        (
+            "BibliographicResource",
+            rx.icon("book_marked", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Consent",
+            rx.icon("badge_check", size=size, style=style, title=stem_type),
+        ),
+        (
+            "ContactPoint",
+            rx.icon("inbox", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Distribution",
+            rx.icon("container", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Organization",
+            rx.icon("building", size=size, style=style, title=stem_type),
+        ),
+        (
+            "OrganizationalUnit",
+            rx.icon("door_open", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Person",
+            rx.icon("circle_user_round", size=size, style=style, title=stem_type),
+        ),
+        (
+            "PrimarySource",
+            rx.icon("hard_drive", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Resource",
+            rx.icon("archive", size=size, style=style, title=stem_type),
+        ),
+        (
+            "Variable",
+            rx.icon("box", size=size, style=style, title=stem_type),
+        ),
+        (
+            "VariableGroup",
+            rx.icon("boxes", size=size, style=style, title=stem_type),
+        ),
+        rx.icon("file_question", size=size, style=style),
     )

mex/editor/consent/state.py

@@ -1,3 +1,5 @@
+from collections.abc import Generator
+
 import reflex as rx
 from reflex.event import EventSpec
 
@@ -11,12 +13,12 @@ class ConsentState(State):
     display_name: str | None = None
 
     @rx.event
-    def load_user(self) -> EventSpec | None:
+    def load_user(self) -> Generator[EventSpec, None, None]:
         """Set the stem type to a default."""
         connector = LDAPConnector.get()
         if not self.user_ldap:
             self.target_path_after_login = self.router.page.raw_path
-            return rx.redirect("/login-ldap")
-        person = connector.get_person(sam_account_name=self.user_ldap.name)
-        self.display_name = person.displayName
-        return None
+            yield rx.redirect("/login-ldap")
+        else:
+            person = connector.get_person(sam_account_name=self.user_ldap.name)
+            self.display_name = person.displayName

mex/editor/create/main.py

@@ -26,15 +26,15 @@ def editor_field(
                         field.name,
                         primary_source,
                     ),
-                    style={"width": "100%"},
+                    style=rx.Style(width="100%"),
                 ),
             ),
-            style={"width": "100%"},
+            style=rx.Style(width="100%"),
+        ),
+        style=rx.Style(
+            width="100%",
+            margin="var(--space-3) 0",
         ),
-        style={
-            "width": "100%",
-            "margin": "var(--space-3) 0",
-        },
         custom_attrs={"data-testid": f"field-{field.name}"},
         role="row",
     )
@@ -45,7 +45,7 @@ def create_title() -> rx.Component:
     return rx.hstack(
         rx.heading(
             "Create new",
-            style={"userSelect": "none"},
+            style=rx.Style(userSelect="none"),
         ),
         rx.select(
             CreateState.available_stem_types,
@@ -72,9 +72,9 @@ def index() -> rx.Component:
                 editor_field,
             ),
             validation_errors(),
-            style={
-                "width": "100%",
-                "marginTop": "calc(2 * var(--space-6))",
-            },
+            style=rx.Style(
+                width="100%",
+                marginTop="calc(2 * var(--space-6))",
+            ),
         ),
     )

mex/editor/edit/main.py

@@ -19,10 +19,9 @@ def edit_title() -> rx.Component:
                 EditState.item_title,
                 render_value,
             ),
-            as_child=True,
         ),
         custom_attrs={"data-testid": "edit-heading"},
-        style={"userSelect": "none"},
+        style=rx.Style(userSelect="none"),
     )
 
 
@@ -42,7 +41,7 @@ def deactivate_all_switch() -> rx.Component:
             color_scheme="jade",
             custom_attrs={"data-testid": "deactivate-all-switch"},
         ),
-        style={"width": "100%"},
+        style=rx.Style(width="100%"),
     )
 
 
@@ -59,9 +58,9 @@ def index() -> rx.Component:
                 editor_field,
             ),
             validation_errors(),
-            style={
-                "width": "100%",
-                "marginTop": "calc(2 * var(--space-6))",
-            },
+            style=rx.Style(
+                width="100%",
+                marginTop="calc(2 * var(--space-6))",
+            ),
         ),
     )

mex/editor/edit/state.py

@@ -14,10 +14,11 @@ class EditState(RuleState):
     def show_submit_success_toast_on_redirect(self) -> Generator[EventSpec, None, None]:
         """Show a success toast when the saved param is set."""
         if "saved" in self.router.page.params:
-            yield self.show_submit_success_toast()
+            yield EditState.show_submit_success_toast
             params = self.router.page.params.copy()
             params.pop("saved")
-            yield self.push_url_params(params)
+            if event := self.push_url_params(params):
+                yield event
 
     @rx.var
     def any_primary_source_or_editor_value_enabled(self) -> bool:
@@ -40,4 +41,4 @@ def disable_all_primary_source_and_editor_values(self) -> EventSpec:
                 ps.enabled = False
                 for value in ps.editor_values:
                     value.enabled = False
-        return State.set_current_page_has_changes(True)
+        return State.set_current_page_has_changes(True)  # type: ignore[misc]