+ +We provide a version of [`reactpy-router`](https://github.com/reactive-python/reactpy-router) that is compatible with Django, and uses Django's URL routing syntax. + +
+ +--- + +## Django Router + +... diff --git a/mkdocs.yml b/mkdocs.yml index 5c308d00..d2f6bc4a 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -7,6 +7,7 @@ nav: - Reference: - Components: reference/components.md - Hooks: reference/hooks.md + - Router: reference/router.md - Decorators: reference/decorators.md - Utilities: reference/utils.md - Template Tag: reference/template-tag.md From 3b3ec51198268c11218e17de8dadff71a3a9ee7d Mon Sep 17 00:00:00 2001 From: Archmonger <16909269+Archmonger@users.noreply.github.com> Date: Sun, 31 Dec 2023 23:46:24 -0800 Subject: [PATCH 11/18] exprot django router --- src/reactpy_django/router/__init__.py | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/reactpy_django/router/__init__.py b/src/reactpy_django/router/__init__.py index e69de29b..ea3e1d3b 100644 --- a/src/reactpy_django/router/__init__.py +++ b/src/reactpy_django/router/__init__.py @@ -0,0 +1,3 @@ +from reactpy_django.router.components import django_router + +__all__ = ["django_router"] From b58e668aca1efb4add7b609b027a6c715da4ab6e Mon Sep 17 00:00:00 2001 From: Archmonger <16909269+Archmonger@users.noreply.github.com> Date: Sun, 31 Dec 2023 23:46:34 -0800 Subject: [PATCH 12/18] add another test scenario --- tests/test_app/router/components.py | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/tests/test_app/router/components.py b/tests/test_app/router/components.py index 09e53ce5..13982490 100644 --- a/tests/test_app/router/components.py +++ b/tests/test_app/router/components.py @@ -35,4 +35,8 @@ def main(): route("/router/string/-We provide a version of [`reactpy-router`](https://github.com/reactive-python/reactpy-router) that is compatible with Django, and uses Django's URL routing syntax. +A variant of [`reactpy-router`](https://github.com/reactive-python/reactpy-router) that utilizes Django conventions.
+!!! abstract "Note" + + Looking for more details on URL routing? + + This package only contains Django specific URL routing features. Standard features can be found within [`reactive-python/reactpy-router`](https://reactive-python.github.io/reactpy-router/). + --- -## Django Router +## `#!python django_router(*routes)` + +=== "components.py" + + ```python + {% include "../../python/django-router.py" %} + ``` + +??? example "See Interface" + + **Parameters** + + | Name | Type | Description | Default | + | --- | --- | --- | --- | + | `#!python *routes` | `#!python Route` | An object from `reactpy-router` containing a `#!python path`, `#!python element`, and child `#!python *routes`. | N/A | + + **Returns** + + | Type | Description | + | --- | --- | + | `#!python VdomDict | None` | The matched component/path after it has been fully rendered. | + +??? question "How is this different from `#!python reactpy_router.simple.router`?" -... + This component utilizes `reactpy-router` under the hood, but provides a more Django-like URL routing syntax. diff --git a/mkdocs.yml b/mkdocs.yml index 12bf352f..2eff331d 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -7,7 +7,7 @@ nav: - Reference: - Components: reference/components.md - Hooks: reference/hooks.md - - Router: reference/router.md + - URL Router: reference/router.md - Decorators: reference/decorators.md - Utilities: reference/utils.md - Template Tag: reference/template-tag.md diff --git a/src/reactpy_django/__init__.py b/src/reactpy_django/__init__.py index 3985fcf4..fb9ed61d 100644 --- a/src/reactpy_django/__init__.py +++ b/src/reactpy_django/__init__.py @@ -2,7 +2,7 @@ import nest_asyncio -from reactpy_django import checks, components, decorators, hooks, types, utils +from reactpy_django import checks, components, decorators, hooks, router, types, utils from reactpy_django.websocket.paths import ( REACTPY_WEBSOCKET_PATH, REACTPY_WEBSOCKET_ROUTE, @@ -18,6 +18,7 @@ "types", "utils", "checks", + "router", ] # Fixes bugs with REACTPY_BACKHAUL_THREAD + built-in asyncio event loops. From 49de6de7970131123c7da79ceb193ada4b65910b Mon Sep 17 00:00:00 2001 From: Archmonger <16909269+Archmonger@users.noreply.github.com> Date: Wed, 10 Jan 2024 01:33:54 -0800 Subject: [PATCH 17/18] add changelog entry --- CHANGELOG.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 70a36624..a5dc50df 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -36,6 +36,8 @@ Using the following categories, list your changes in this order: ### Added +- Built-in Single Page Application (SPA) support! + - `reactpy_django.router.django_router` can be used to render your Django application as a SPA. - SEO compatible rendering! - `settings.py:REACTPY_PRERENDER` can be set to `True` to make components pre-render by default. - Or, you can enable it on individual components via the template tag: `{% component "..." prerender="True" %}`. From ba1283149cc1aee6dbd916907ba7a997f3f35f6d Mon Sep 17 00:00:00 2001 From: Archmonger <16909269+Archmonger@users.noreply.github.com> Date: Wed, 10 Jan 2024 02:15:43 -0800 Subject: [PATCH 18/18] add tests --- tests/test_app/router/components.py | 4 +-- tests/test_app/tests/test_components.py | 47 +++++++++++++++++++++++++ 2 files changed, 49 insertions(+), 2 deletions(-) diff --git a/tests/test_app/router/components.py b/tests/test_app/router/components.py index 13982490..8f020990 100644 --- a/tests/test_app/router/components.py +++ b/tests/test_app/router/components.py @@ -1,5 +1,5 @@ from reactpy import component, html, use_location -from reactpy_django.router.components import django_router +from reactpy_django.router import django_router from reactpy_router import route, use_params, use_query @@ -19,7 +19,7 @@ def main(): route_info = html._( html.div( - {"class_name": "router-path", "data-path": location.pathname}, + {"id": "router-path", "data-path": location.pathname}, f"Path Name: {location.pathname}", ), html.div(f"Query String: {location.search}"), diff --git a/tests/test_app/tests/test_components.py b/tests/test_app/tests/test_components.py index af936955..ca35cf50 100644 --- a/tests/test_app/tests/test_components.py +++ b/tests/test_app/tests/test_components.py @@ -553,3 +553,50 @@ def test_use_user_data_with_default(self): "Data: {'default1': 'value', 'default2': 'value2', 'default3': 'value3'}", user_data_div.text_content(), ) + + def test_url_router(self): + new_page = self.browser.new_page() + try: + new_page.goto(f"{self.live_server_url}/router/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/", path.get_attribute("data-path")) + + new_page.goto(f"{self.live_server_url}/router/any/123/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/any/123/", path.get_attribute("data-path")) + + new_page.goto(f"{self.live_server_url}/router/integer/123/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/integer/123/", path.get_attribute("data-path")) + + new_page.goto(f"{self.live_server_url}/router/path/abc/123/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/path/abc/123/", path.get_attribute("data-path")) + + new_page.goto(f"{self.live_server_url}/router/slug/abc-123/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/slug/abc-123/", path.get_attribute("data-path")) + + new_page.goto(f"{self.live_server_url}/router/string/abc/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/string/abc/", path.get_attribute("data-path")) + + new_page.goto( + f"{self.live_server_url}/router/uuid/123e4567-e89b-12d3-a456-426614174000/" + ) + path = new_page.wait_for_selector("#router-path") + self.assertIn( + "/router/uuid/123e4567-e89b-12d3-a456-426614174000/", + path.get_attribute("data-path"), + ) + + new_page.goto(f"{self.live_server_url}/router/abc/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/abc/", path.get_attribute("data-path")) + + new_page.goto(f"{self.live_server_url}/router/two/123/abc/") + path = new_page.wait_for_selector("#router-path") + self.assertIn("/router/two/123/abc/", path.get_attribute("data-path")) + + finally: + new_page.close()