Use adhoc Component() less

2026-06-09 18:00:57 +02:00
parent 0179363684
commit 32eb882a98
9 changed files with 247 additions and 242 deletions
@@ -6,6 +6,7 @@ from django.http import HttpResponse
 from django.utils.safestring import SafeText, mark_safe

 from common.components import Component, CsrfInput, Div, Input
+from common.components.primitives import Td, Tr
 from common.layout import render_page


@@ -15,12 +16,10 @@ def _login_content(form, request) -> SafeText:
        children=[
            CsrfInput(request),
            mark_safe(str(form.as_table())),
-            Component(
-                tag_name="tr",
+            Tr(
                children=[
-                    Component(tag_name="td"),
-                    Component(
-                        tag_name="td",
+                    Td(),
+                    Td(
                        children=[
                            Input(type="submit", attributes=[("value", "Login")])
                        ],
@@ -2,15 +2,16 @@ from typing import Any

 from django.contrib.auth.decorators import login_required
 from django.core.paginator import Paginator
-from django.middleware.csrf import get_token
 from django.db.models import Q
 from django.http import HttpRequest, HttpResponse, HttpResponseRedirect
+from django.middleware.csrf import get_token
 from django.shortcuts import get_object_or_404, redirect
 from django.template.defaultfilters import date as date_filter
 from django.urls import reverse
 from django.utils.safestring import SafeText, mark_safe

 from common.components import (
+    H1,
    A,
    AddForm,
    Button,
@@ -21,9 +22,7 @@ from common.components import (
    FilterBar,
    GameStatus,
    GameStatusSelector,
-    H1,
    Icon,
-    SearchField,
    LinkedPurchase,
    Modal,
    ModuleScript,
@@ -31,9 +30,12 @@ from common.components import (
    Popover,
    PopoverTruncated,
    PurchasePrice,
+    SearchField,
    SimpleTable,
+    Ul,
    paginated_table_content,
 )
+from common.components.primitives import Li, Span, Strong
 from common.icons import get_icon
 from common.layout import render_page
 from common.time import (
@@ -193,19 +195,13 @@ def _delete_game_confirmation_modal(
 ) -> SafeText:
    data_items = []
    if session_count:
-        data_items.append(
-            Component(tag_name="li", children=[f"{session_count} session(s)"])
-        )
+        data_items.append(Li(children=[f"{session_count} session(s)"]))
    if purchase_count:
-        data_items.append(
-            Component(tag_name="li", children=[f"{purchase_count} purchase(s)"])
-        )
+        data_items.append(Li(children=[f"{purchase_count} purchase(s)"]))
    if playevent_count:
-        data_items.append(
-            Component(tag_name="li", children=[f"{playevent_count} play event(s)"])
-        )
+        data_items.append(Li(children=[f"{playevent_count} play event(s)"]))
    if not (session_count or purchase_count or playevent_count):
-        data_items.append(Component(tag_name="li", children=["No associated data"]))
+        data_items.append(Li(children=["No associated data"]))

    form = Component(
        tag_name="form",
@@ -218,8 +214,7 @@ def _delete_game_confirmation_modal(
        ],
        children=[
            CsrfInput(request),
-            Component(
-                tag_name="p",
+            P(
                attributes=[
                    (
                        "class",
@@ -231,8 +226,7 @@ def _delete_game_confirmation_modal(
                    "This will permanently delete this game and all associated data:"
                ],
            ),
-            Component(
-                tag_name="ul",
+            Ul(
                attributes=[
                    (
                        "class",
@@ -242,8 +236,7 @@ def _delete_game_confirmation_modal(
                ],
                children=data_items,
            ),
-            Component(
-                tag_name="p",
+            P(
                attributes=[
                    (
                        "class",
@@ -279,8 +272,7 @@ def _delete_game_confirmation_modal(
    return Modal(
        "delete-game-confirmation-modal",
        children=[
-            Component(
-                tag_name="h1",
+            P(
                attributes=[
                    (
                        "class",
@@ -289,12 +281,11 @@ def _delete_game_confirmation_modal(
                ],
                children=["Delete Game"],
            ),
-            Component(
-                tag_name="p",
+            P(
                attributes=[("class", "dark:text-white text-center mt-5")],
                children=[
                    "Are you sure you want to delete ",
-                    Component(tag_name="strong", children=[game.name]),
+                    Strong(children=[game.name]),
                    "?",
                ],
            ),
@@ -427,9 +418,7 @@ def _meta_row(
    label: str, value: SafeText | str, extra: SafeText | str = ""
 ) -> SafeText:
    children: list[SafeText | str] = [
-        Component(
-            tag_name="span", attributes=[("class", "uppercase")], children=[label]
-        ),
+        Span(attributes=[("class", "uppercase")], children=[label]),
        value,
    ]
    if extra:
@@ -452,9 +441,8 @@ def _game_action_buttons(game: Game) -> SafeText:
        "dark:text-white dark:hover:text-white dark:hover:bg-red-700 "
        "dark:focus:ring-blue-500 dark:focus:text-white hover:cursor-pointer"
    )
-    edit_link = Component(
-        tag_name="a",
-        attributes=[("href", reverse("games:edit_game", args=[game.id]))],
+    edit_link = A(
+        href=reverse("games:edit_game", args=[game.id]),
        children=[
            Component(
                tag_name="button",
@@ -463,10 +451,9 @@ def _game_action_buttons(game: Game) -> SafeText:
            )
        ],
    )
-    delete_link = Component(
-        tag_name="a",
+    delete_link = A(
+        href="#",
        attributes=[
-            ("href", "#"),
            ("hx-get", reverse("games:delete_game_confirmation", args=[game.id])),
            ("hx-target", "#global-modal-container"),
        ],
@@ -499,21 +486,16 @@ def _game_history(statuschanges) -> SafeText:
            status=change.new_status,
            children=[change.get_new_status_display()],
        )
-        edit = Component(
-            tag_name="a",
-            attributes=[("href", reverse("games:edit_statuschange", args=[change.id]))],
+        edit = A(
+            href=reverse("games:edit_statuschange", args=[change.id]),
            children=["Edit"],
        )
-        delete = Component(
-            tag_name="a",
-            attributes=[
-                ("href", reverse("games:delete_statuschange", args=[change.id]))
-            ],
+        delete = A(
+            href=reverse("games:delete_statuschange", args=[change.id]),
            children=["Delete"],
        )
        items.append(
-            Component(
-                tag_name="li",
+            Li(
                attributes=[("class", "text-slate-500")],
                children=[
                    f"{prefix} status from ",
@@ -528,8 +510,7 @@ def _game_history(statuschanges) -> SafeText:
                ],
            )
        )
-    return Component(
-        tag_name="ul",
+    return Ul(
        attributes=[("class", "list-disc list-inside")],
        children=items,
    )
@@ -576,12 +557,10 @@ def _game_overview_metrics(game: Game) -> dict[str, Any]:

 def _game_header(game: Game, request: HttpRequest, metrics: dict[str, Any]) -> SafeText:
    grey_value_class = "text-black dark:text-slate-300"
-    title_span = Component(
-        tag_name="span",
+    title_span = Span(
        attributes=[("class", "text-balance max-w-120 text-4xl")],
        children=[
-            Component(
-                tag_name="span",
+            Span(
                attributes=[("class", "font-bold font-serif")],
                children=[game.name],
            ),
@@ -634,8 +613,7 @@ def _game_header(game: Game, request: HttpRequest, metrics: dict[str, Any]) -> S
        [
            _meta_row(
                "Original year",
-                Component(
-                    tag_name="span",
+                Span(
                    attributes=[("class", grey_value_class)],
                    children=[str(game.original_year_released)],
                ),
@@ -648,8 +626,7 @@ def _game_header(game: Game, request: HttpRequest, metrics: dict[str, Any]) -> S
            _played_row(game, request),
            _meta_row(
                "Platform",
-                Component(
-                    tag_name="span",
+                Span(
                    attributes=[("class", grey_value_class)],
                    children=[str(game.platform)],
                ),
@@ -6,13 +6,12 @@ from django.http import (
    HttpResponseRedirect,
 )
 from django.shortcuts import get_object_or_404, redirect
-from django.urls import reverse
-from django.utils import timezone
-from django.views.decorators.http import require_POST
-
 from django.template.defaultfilters import date as date_filter
 from django.template.defaultfilters import floatformat
+from django.urls import reverse
+from django.utils import timezone
 from django.utils.safestring import SafeText, mark_safe
+from django.views.decorators.http import require_POST

 from common.components import (
    A,
@@ -32,6 +31,7 @@ from common.components import (
    TableRow,
    paginated_table_content,
 )
+from common.components.primitives import Li, P, Td, Tr, Ul
 from common.layout import render_page
 from common.time import dateformat
 from common.utils import paginate
@@ -129,7 +129,7 @@ def list_purchases(request: HttpRequest) -> HttpResponse:
        elided_page_range=elided_page_range,
        request=request,
    )
-    from common.components import PurchaseFilterBar, ModuleScript
+    from common.components import ModuleScript, PurchaseFilterBar

    filter_bar = PurchaseFilterBar(
        filter_json=filter_json,
@@ -149,12 +149,10 @@ def list_purchases(request: HttpRequest) -> HttpResponse:

 def _purchase_additional_row() -> SafeText:
    """The 'Submit & Create Session' row shown below the main Submit button."""
-    return Component(
-        tag_name="tr",
+    return Tr(
        children=[
-            Component(tag_name="td"),
-            Component(
-                tag_name="td",
+            Td(),
+            Td(
                children=[
                    Button(
                        [],
@@ -262,8 +260,7 @@ def _view_purchase_content(purchase: Purchase) -> SafeText:
            Div(
                [("class", row_class)],
                [
-                    Component(
-                        tag_name="p",
+                    P(
                        children=[
                            "Price per game: ",
                            PriceConverted([floatformat(purchase.price_per_game, 0)]),
@@ -273,10 +270,9 @@ def _view_purchase_content(purchase: Purchase) -> SafeText:
                ],
            ),
            Div([("class", row_class)], ["Games included in this purchase:"]),
-            Component(
-                tag_name="ul",
+            Ul(
                children=[
-                    Component(tag_name="li", children=[GameLink(game.id, game.name)])
+                    Li(children=[GameLink(game.id, game.name)])
                    for game in purchase.games.all()
                ],
            ),
@@ -317,8 +313,7 @@ def _refund_confirmation_modal(purchase_id: int, request: HttpRequest) -> SafeTe
        ],
        children=[
            CsrfInput(request),
-            Component(
-                tag_name="p",
+            P(
                attributes=[("class", "dark:text-white text-center mt-3 text-sm")],
                children=["Games will be marked as abandoned."],
            ),
@@ -356,8 +351,7 @@ def _refund_confirmation_modal(purchase_id: int, request: HttpRequest) -> SafeTe
                ],
                children=["Confirm Refund"],
            ),
-            Component(
-                tag_name="p",
+            P(
                attributes=[("class", "dark:text-white text-center mt-5")],
                children=["Are you sure you want to mark this purchase as refunded?"],
            ),
@@ -408,8 +402,10 @@ def related_purchase_by_game(request: HttpRequest) -> HttpResponse:
        from games.forms import related_purchase_queryset

        form = PurchaseForm()
-        qs = related_purchase_queryset().filter(games__in=games).order_by(
-            "games__sort_name"
+        qs = (
+            related_purchase_queryset()
+            .filter(games__in=games)
+            .order_by("games__sort_name")
        )

        form.fields["related_purchase"].queryset = qs
@@ -15,7 +15,6 @@ from common.components import (
    AddForm,
    Button,
    ButtonGroup,
-    Component,
    Div,
    Icon,
    ModuleScript,
@@ -25,6 +24,7 @@ from common.components import (
    SessionDeviceSelector,
    paginated_table_content,
 )
+from common.components.primitives import Span, Td, Tr
 from common.layout import render_page
 from common.time import (
    dateformat,
@@ -208,8 +208,7 @@ def _session_fields(form) -> SafeText:
            this_side = "start" if field.name == "timestamp_start" else "end"
            other_side = "end" if field.name == "timestamp_start" else "start"
            children.append(
-                Component(
-                    tag_name="span",
+                Span(
                    attributes=[
                        (
                            "class",
@@ -292,8 +291,8 @@ def edit_session(request: HttpRequest, session_id: int) -> HttpResponse:
 def _session_row_fragment(session: Session) -> SafeText:
    """A single session <tr> (the old list_sessions.html#session-row partial),
    returned by the inline end/clone-session HTMX endpoints."""
-    name_link = Component(
-        tag_name="a",
+    name_link = A(
+        href=reverse("games:view_game", args=[session.game.id]),
        attributes=[
            (
                "class",
@@ -305,12 +304,10 @@ def _session_row_fragment(session: Session) -> SafeText:
                "group-hover:outline-purple-400 group-hover:outline-4 "
                "group-hover:decoration-purple-900 group-hover:text-purple-100",
            ),
-            ("href", reverse("games:view_game", args=[session.game.id])),
        ],
        children=[session.game.name],
    )
-    name_td = Component(
-        tag_name="td",
+    name_td = Td(
        attributes=[
            (
                "class",
@@ -319,15 +316,13 @@ def _session_row_fragment(session: Session) -> SafeText:
            )
        ],
        children=[
-            Component(
-                tag_name="span",
+            Span(
                attributes=[("class", "inline-block relative")],
                children=[name_link],
            )
        ],
    )
-    start_td = Component(
-        tag_name="td",
+    start_td = Td(
        attributes=[
            ("class", "px-2 sm:px-4 md:px-6 md:py-2 font-mono hidden sm:table-cell")
        ],
@@ -336,10 +331,9 @@ def _session_row_fragment(session: Session) -> SafeText:

    if not session.timestamp_end:
        end_url = reverse("games:list_sessions_end_session", args=[session.id])
-        end_inner: SafeText | str = Component(
-            tag_name="a",
+        end_inner: SafeText | str = A(
+            href=end_url,
            attributes=[
-                ("href", end_url),
                ("hx-get", end_url),
                ("hx-target", "closest tr"),
                ("hx-swap", "outerHTML"),
@@ -351,8 +345,7 @@ def _session_row_fragment(session: Session) -> SafeText:
                ),
            ],
            children=[
-                Component(
-                    tag_name="span",
+                Span(
                    attributes=[("class", "text-yellow-300")],
                    children=["Finish now?"],
                )
@@ -362,19 +355,17 @@ def _session_row_fragment(session: Session) -> SafeText:
        end_inner = "--"
    else:
        end_inner = date_filter(session.timestamp_end, "d/m/Y H:i")
-    end_td = Component(
-        tag_name="td",
+    end_td = Td(
        attributes=[
            ("class", "px-2 sm:px-4 md:px-6 md:py-2 font-mono hidden lg:table-cell")
        ],
        children=[end_inner],
    )
-    duration_td = Component(
-        tag_name="td",
+    duration_td = Td(
        attributes=[("class", "px-2 sm:px-4 md:px-6 md:py-2 font-mono")],
        children=[session.duration_formatted()],
    )
-    return Component(tag_name="tr", children=[name_td, start_td, end_td, duration_td])
+    return Tr(children=[name_td, start_td, end_td, duration_td])


 def clone_session_by_id(session_id: int) -> Session:
@@ -13,6 +13,7 @@ from common.components import (
    Div,
    paginated_table_content,
 )
+from common.components.primitives import P
 from common.layout import render_page
 from common.time import dateformat, local_strftime
 from common.utils import paginate
@@ -75,8 +76,7 @@ def _delete_statuschange_content(statuschange, request: HttpRequest) -> SafeText
    inner = Div(
        [],
        [
-            Component(
-                tag_name="p",
+            P(
                children=["Are you sure you want to delete this status change?"],
            ),
            Button(