Allow logouts to re-render the component tree

Author: Archmonger

src/reactpy_django/auth/components.py

@@ -7,7 +7,7 @@
 from uuid import uuid4
 
 from django.urls import reverse
-from reactpy import component, hooks
+from reactpy import component, hooks, html
 
 from reactpy_django.javascript_components import HttpRequest
 from reactpy_django.models import SwitchSession
@@ -19,13 +19,15 @@
 
 
 @component
-def auth_manager():
-    """Component that can force the client to switch HTTP sessions to match the websocket session.
+def session_manager(child):
+    """This component can force the client (browser) to switch HTTP sessions,
+    making it match the websocket session.
 
     Used to force persistent authentication between Django's websocket and HTTP stack."""
     from reactpy_django import config
 
     switch_sessions, set_switch_sessions = hooks.use_state(False)
+    _, set_rerender = hooks.use_state(uuid4)
     uuid_ref = hooks.use_ref(str(uuid4()))
     uuid = uuid_ref.current
     scope = hooks.use_connection().scope
@@ -35,11 +37,13 @@ def setup_asgi_scope():
         """Store a trigger function in websocket scope so that ReactPy-Django's hooks can command a session synchronization."""
         scope.setdefault("reactpy", {})
         scope["reactpy"]["synchronize_session"] = synchronize_session
-        print("configure_asgi_scope")
+        scope["reactpy"]["rerender"] = rerender
 
     @hooks.use_effect(dependencies=[switch_sessions])
     async def synchronize_session_timeout():
-        """Ensure that the ASGI scope is available to this component."""
+        """Ensure that the ASGI scope is available to this component.
+        This effect will automatically be cancelled if the session is successfully
+        switched (via dependencies=[switch_sessions])."""
         if switch_sessions:
             await asyncio.sleep(config.REACTPY_AUTH_TIMEOUT + 0.1)
             await asyncio.to_thread(
@@ -52,43 +56,44 @@ async def synchronize_session():
         """Entrypoint where the server will command the client to switch HTTP sessions
         to match the websocket session. This function is stored in the websocket scope so that
         ReactPy-Django's hooks can access it."""
-        print("sync command")
         session: SessionBase | None = scope.get("session")
         if not session or not session.session_key:
-            print("sync error")
             return
 
         # Delete any sessions currently associated with this UUID
         with contextlib.suppress(SwitchSession.DoesNotExist):
             obj = await SwitchSession.objects.aget(uuid=uuid)
             await obj.adelete()
 
+        # Begin the process of synchronizing HTTP and websocket sessions
         obj = await SwitchSession.objects.acreate(uuid=uuid, session_key=session.session_key)
         await obj.asave()
-
         set_switch_sessions(True)
 
     async def synchronize_session_callback(status_code: int, response: str):
-        """This callback acts as a communication bridge between the client and server, notifying the server
-        of the client's response to the session switch command."""
-        print("callback")
+        """This callback acts as a communication bridge, allowing the client to notify the server
+        of the status of session switch command."""
         set_switch_sessions(False)
         if status_code >= 300 or status_code < 200:
             await asyncio.to_thread(
                 _logger.warning,
                 f"Client returned unexpected HTTP status code ({status_code}) while trying to sychronize sessions.",
             )
 
-    # If a session cookie was generated, send it to the client
-    print("render")
+    async def rerender():
+        """Force a rerender of the entire component tree."""
+        set_rerender(uuid4())
+
+    # Switch sessions using a client side HttpRequest component, if needed
+    http_request = None
     if switch_sessions:
-        print("Rendering HTTP request component with UUID ", uuid)
-        return HttpRequest(
+        http_request = HttpRequest(
             {
                 "method": "GET",
                 "url": reverse("reactpy:switch_session", args=[uuid]),
                 "body": None,
                 "callback": synchronize_session_callback,
             },
         )
-    return None
+
+    return html._(child, http_request)

src/reactpy_django/hooks.py

@@ -429,8 +429,10 @@ async def login(user: AbstractUser):
         await ensure_async(session_save_func)()
         await scope["reactpy"]["synchronize_session"]()
 
-    async def logout():
+    async def logout(rerender: bool = True):
         await channels_auth.logout(scope)
+        if rerender:
+            await scope["reactpy"]["rerender"]()
 
     return login, logout
 

src/reactpy_django/websocket/consumer.py

@@ -143,7 +143,7 @@ async def encode_json(cls, content):
     async def run_dispatcher(self):
         """Runs the main loop that performs component rendering tasks."""
         from reactpy_django import models
-        from reactpy_django.auth.components import auth_manager
+        from reactpy_django.auth.components import session_manager
         from reactpy_django.config import (
             REACTPY_REGISTERED_COMPONENTS,
             REACTPY_SESSION_MAX_AGE,
@@ -212,11 +212,7 @@ async def run_dispatcher(self):
         with contextlib.suppress(Exception):
             await serve_layout(
                 Layout(  # type: ignore
-                    ConnectionContext(
-                        root_component,
-                        auth_manager(),
-                        value=connection,
-                    )
+                    ConnectionContext(session_manager(root_component), value=connection)
                 ),
                 self.send_json,
                 self.recv_queue.get,