[lichess] We can now log in and log out from Lichess in the UI

Still super basic and ugly at the moment, but that's a good start :-)

Author: olivierphi

pyproject.toml

@@ -48,6 +48,7 @@ test = [
     "pytest-django==4.*",
     "pytest-cov==4.*",
     "time-machine==2.*",
+    "pytest-blockage==0.2.*",
 ]
 load-testing = [
     "locust==2.*",
@@ -109,6 +110,7 @@ exclude = [
 ]
 [[tool.mypy.overrides]]
 module = [
+    "authlib.*",
     "django.*",
     "dominate.*",
     "import_export.*",
@@ -125,6 +127,7 @@ testpaths = [
 python_files = ["test_*.py"]
 addopts = "--reuse-db"
 DJANGO_SETTINGS_MODULE = "project.settings.test"
+blockage = true # https://github.com/rob-b/pytest-blockage
 
 [tool.coverage.run]
 # @link https://coverage.readthedocs.io/en/latest/excluding.html

src/apps/daily_challenge/components/misc_ui/daily_challenge_bar.py

@@ -9,9 +9,9 @@
 from dominate.util import raw
 
 from apps.chess.components.svg_icons import ICON_SVG_CANCEL, ICON_SVG_CONFIRM
+from apps.webui.components import common_styles
 
 from ...models import PlayerGameOverState
-from .common_styles import BUTTON_CANCEL_CLASSES, BUTTON_CLASSES, BUTTON_CONFIRM_CLASSES
 from .svg_icons import (
     ICON_SVG_COG,
     ICON_SVG_LIGHT_BULB,
@@ -163,14 +163,14 @@ def _confirmation_dialog(
                 "Confirm",
                 " ",
                 ICON_SVG_CONFIRM,
-                cls=BUTTON_CONFIRM_CLASSES,
+                cls=common_styles.BUTTON_CONFIRM_CLASSES,
                 **htmx_attributes_confirm,
             ),
             button(
                 "Cancel",
                 " ",
                 ICON_SVG_CANCEL,
-                cls=BUTTON_CANCEL_CLASSES,
+                cls=common_styles.BUTTON_CANCEL_CLASSES,
                 **htmx_attributes_cancel,
             ),
             cls="text-center",
@@ -362,7 +362,7 @@ def _user_prefs_button(board_id: str) -> "dom_tag":
 def _button_classes(*, full_width: bool = True, disabled: bool = False) -> str:
     return " ".join(
         (
-            BUTTON_CLASSES,
+            common_styles.BUTTON_CLASSES,
             ("w-full" if full_width else ""),
             (" opacity-50 cursor-not-allowed" if disabled else ""),
         )

src/apps/daily_challenge/components/misc_ui/help.py

@@ -9,15 +9,12 @@
 from apps.chess.components.chess_board import SQUARE_COLOR_TAILWIND_CLASSES
 from apps.chess.components.chess_helpers import chess_unit_symbol_class
 from apps.chess.consts import PIECE_TYPE_TO_NAME
-from apps.daily_challenge.components.misc_ui.common_styles import (
-    BUTTON_BASE_HOVER_TEXT_COLOR,
-    BUTTON_CLASSES,
-)
 from apps.daily_challenge.components.misc_ui.svg_icons import (
     ICON_SVG_COG,
     ICON_SVG_LIGHT_BULB,
     ICON_SVG_RESTART,
 )
+from apps.webui.components import common_styles
 
 if TYPE_CHECKING:
     from dominate.tags import dom_tag
@@ -96,7 +93,7 @@ def help_content(
                 span(
                     "Retry",
                     ICON_SVG_RESTART,
-                    cls=f"{BUTTON_CLASSES.replace(BUTTON_BASE_HOVER_TEXT_COLOR, '')} !mx-0",
+                    cls=f"{common_styles.BUTTON_CLASSES.replace(common_styles.BUTTON_BASE_HOVER_TEXT_COLOR, '')} !mx-0",
                 ),
                 " button.",
                 cls=f"{spacing}",
@@ -107,7 +104,7 @@ def help_content(
                 span(
                     "See solution",
                     ICON_SVG_LIGHT_BULB,
-                    cls=f"{BUTTON_CLASSES} !inline-block !mx-0",
+                    cls=f"{common_styles.BUTTON_CLASSES} !inline-block !mx-0",
                 ),
                 " button.",
                 cls=f"{spacing}",
@@ -118,7 +115,7 @@ def help_content(
                 span(
                     "Options",
                     ICON_SVG_COG,
-                    cls=f"{BUTTON_CLASSES} !inline-block !mx-0",
+                    cls=f"{common_styles.BUTTON_CLASSES} !inline-block !mx-0",
                 ),
                 " button.",
                 cls=f"{spacing}",

src/apps/daily_challenge/components/misc_ui/status_bar.py

@@ -15,8 +15,7 @@
     help_content,
     unit_display_container,
 )
-
-from .common_styles import BUTTON_CLASSES
+from apps.webui.components import common_styles
 
 if TYPE_CHECKING:
     from dominate.tags import dom_tag
@@ -47,7 +46,7 @@ def status_bar(
             div(
                 button(
                     "⇧ Scroll up to the board",
-                    cls=BUTTON_CLASSES,
+                    cls=common_styles.BUTTON_CLASSES,
                     onclick="""window.scrollTo({ top: 0, behavior: "smooth" })""",
                 ),
                 cls="w-full flex justify-center",

src/apps/daily_challenge/components/misc_ui/user_prefs_modal.py

@@ -6,8 +6,8 @@
 from apps.chess.components.misc_ui import modal_container
 from apps.chess.components.svg_icons import ICON_SVG_CONFIRM
 from apps.chess.models import UserPrefsBoardTextureChoices, UserPrefsGameSpeedChoices
+from apps.webui.components import common_styles
 
-from .common_styles import BUTTON_CONFIRM_CLASSES
 from .svg_icons import ICON_SVG_COG
 
 if TYPE_CHECKING:
@@ -69,7 +69,7 @@ def _user_prefs_form(user_prefs: "UserPrefs") -> "dom_tag":
             "Save preferences",
             " ",
             ICON_SVG_CONFIRM,
-            cls=BUTTON_CONFIRM_CLASSES,
+            cls=common_styles.BUTTON_CONFIRM_CLASSES,
         ),
     )
 

src/apps/daily_challenge/cookie_helpers.py

@@ -15,8 +15,10 @@
 
 
 _PLAYER_CONTENT_SESSION_KEY = "pc"
-_USER_PREFS_COOKIE_NAME = "uprefs"
-_USER_PREFS_COOKIE_MAX_AGE = 3600 * 24 * 30 * 6  # approximately 6 months
+_USER_PREFS_COOKIE = {
+    "name": "uprefs",
+    "max-age": 3600 * 24 * 30 * 6,  # approximately 6 months
+}
 
 _logger = logging.getLogger(__name__)
 
@@ -98,7 +100,7 @@ def get_user_prefs_from_request(request: "HttpRequest") -> UserPrefs:
     def new_content():
         return UserPrefs()
 
-    cookie_content: str | None = request.COOKIES.get(_USER_PREFS_COOKIE_NAME)
+    cookie_content: str | None = request.COOKIES.get(_USER_PREFS_COOKIE["name"])
     if cookie_content is None or len(cookie_content) < 5:
         return new_content()
 
@@ -125,10 +127,11 @@ def save_daily_challenge_state_in_session(
 
 def save_user_prefs(*, user_prefs: "UserPrefs", response: "HttpResponse") -> None:
     response.set_cookie(
-        _USER_PREFS_COOKIE_NAME,
+        _USER_PREFS_COOKIE["name"],
         user_prefs.to_cookie_content(),
-        max_age=_USER_PREFS_COOKIE_MAX_AGE,
+        max_age=_USER_PREFS_COOKIE["max-age"],
         httponly=True,
+        samesite="Lax",
     )
 
 

src/apps/daily_challenge/view_helpers.py

@@ -1,11 +1,8 @@
 import dataclasses
 from typing import TYPE_CHECKING, cast
 
+from . import cookie_helpers
 from .business_logic import manage_new_daily_challenge_stats_logic
-from .cookie_helpers import (
-    get_or_create_daily_challenge_state_for_player,
-    get_user_prefs_from_request,
-)
 
 if TYPE_CHECKING:
     from django.http import HttpRequest
@@ -38,10 +35,12 @@ class GameContext:
     def create_from_request(cls, request: "HttpRequest") -> "GameContext":
         is_staff_user: bool = request.user.is_staff
         challenge, is_preview = get_current_daily_challenge_or_admin_preview(request)
-        game_state, stats, created = get_or_create_daily_challenge_state_for_player(
-            request=request, challenge=challenge
+        game_state, stats, created = (
+            cookie_helpers.get_or_create_daily_challenge_state_for_player(
+                request=request, challenge=challenge
+            )
         )
-        user_prefs = get_user_prefs_from_request(request)
+        user_prefs = cookie_helpers.get_user_prefs_from_request(request)
         # TODO: validate the "board_id" data?
         board_id = cast(str, request.GET.get("board_id", "main"))
 

src/apps/lichess_bridge/authentication.py

@@ -20,6 +20,8 @@
 if TYPE_CHECKING:
     from typing import Self
 
+    from .models import LichessAccessToken
+
 LICHESS_OAUTH2_SCOPES = ("board:play",)
 
 
@@ -91,7 +93,7 @@ def create_afresh(
 
 class LichessToken(msgspec.Struct):
     token_type: Literal["Bearer"]
-    access_token: str
+    access_token: "LichessAccessToken"
     expires_in: int  # number of seconds
     expires_at: int  # a Unix timestamp
 

src/apps/lichess_bridge/components/misc_ui.py

@@ -0,0 +1,26 @@
+from typing import TYPE_CHECKING
+
+from django.urls import reverse
+from dominate.tags import button, form
+
+from apps.webui.components import common_styles
+from apps.webui.components.forms_common import csrf_hidden_input
+
+from .svg_icons import ICON_SVG_LOG_OUT
+
+if TYPE_CHECKING:
+    from django.http import HttpRequest
+
+
+def detach_lichess_account_form(request: "HttpRequest") -> form:
+    return form(
+        csrf_hidden_input(request),
+        button(
+            "Log out from Lichess",
+            " ",
+            ICON_SVG_LOG_OUT,
+            cls=common_styles.BUTTON_CLASSES,
+        ),
+        action=reverse("lichess_bridge:detach_lichess_account"),
+        method="POST",
+    )

src/apps/lichess_bridge/components/pages/lichess.py

@@ -1,35 +1,68 @@
 from typing import TYPE_CHECKING
 
-from dominate.tags import section
-from dominate.util import raw
+from django.urls import reverse
+from dominate.tags import button, div, form, p, section
 
-from apps.lichess_bridge.authentication import (
-    get_lichess_token_retrieval_via_oauth2_process_starting_url,
-)
+from apps.webui.components import common_styles
+from apps.webui.components.forms_common import csrf_hidden_input
 from apps.webui.components.layout import page
 
+from ...lichess_api import get_lichess_api_client
+from ..misc_ui import detach_lichess_account_form
+from ..svg_icons import ICON_SVG_LOG_IN
+
 if TYPE_CHECKING:
     from django.http import HttpRequest
 
-    from apps.lichess_bridge.authentication import (
-        LichessTokenRetrievalProcessContext,
-    )
+    from ...models import LichessAccessToken
 
 
 def lichess_no_account_linked_page(
     *,
     request: "HttpRequest",
-    lichess_oauth2_process_context: "LichessTokenRetrievalProcessContext",
 ) -> str:
-    target_url = get_lichess_token_retrieval_via_oauth2_process_starting_url(
-        context=lichess_oauth2_process_context
-    )
-
     return page(
         section(
-            raw(f"""Click here: <a href="{target_url}">{target_url}</a>"""),
+            form(
+                csrf_hidden_input(request),
+                p("Click here to log in to Lichess"),
+                button(
+                    "Log in via Lichess",
+                    " ",
+                    ICON_SVG_LOG_IN,
+                    type="submit",
+                    cls=common_styles.BUTTON_CLASSES,
+                ),
+                action=reverse("lichess_bridge:oauth2_start_flow"),
+                method="POST",
+            ),
             cls="text-slate-50",
         ),
         request=request,
         title="Lichess - no account linked",
     )
+
+
+def lichess_account_linked_homepage(
+    *,
+    request: "HttpRequest",
+    access_token: "LichessAccessToken",
+) -> str:
+    me = get_lichess_api_client(access_token).account.get()
+
+    return page(
+        div(
+            section(
+                f'Hello {me["username"]}!',
+                cls="text-slate-50",
+            ),
+            div(
+                detach_lichess_account_form(request),
+                cls="mt-4",
+            ),
+            cls="w-full mx-auto bg-slate-900 min-h-48 "
+            "md:max-w-3xl xl:max-w-7xl xl:border xl:rounded-md xl:border-neutral-800",
+        ),
+        request=request,
+        title="Lichess - account linked",
+    )