Add Jinja support #199

ShaheedHaque · 2023-10-09T20:24:08Z

Description

WORK IN PROGRESS: DO NOT MERGE.

~~This is incomplete support for Jinja2-based templates. I could use some pointers to finish the missing part (see comments at the end of src/reactpy_django/templatetags/jinja.py).~~

(also missing, docs, packaging and tests)

To reproduce the results to date requires the following example changes on the Django side...

Configure template files ending in ".jinja" to be processed via Jinja:

    TEMPLATES = [
    {
        "BACKEND": "django_jinja.backend.Jinja2",  # Jinja backend
        'DIRS': [os.path.join(BASE_DIR, 'templates')],
        "APP_DIRS": True,
        "OPTIONS": {
            'context_processors': [
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
                ...
            ],
            "match_extension": (".jinja"),  # suffix for Jinja templates
            "app_dirname": "templates",

            # Can be set to "jinja2.Undefined" or any other subclass.
            "undefined": None,

            "newstyle_gettext": True,
            "tests": {
                # "mytest": "path.to.my.test",
            },
            "filters": {
                # "myfilter": "path.to.my.filter",
            },
            "globals": {
                # "myglobal": "path.to.my.globalfunc",
            },
            "constants": {
                # "foo": "bar",
            },
            "extensions": [
                "jinja2.ext.do",
                "jinja2.ext.loopcontrols",
                "jinja2.ext.i18n",
                "django_jinja.builtins.extensions.CsrfExtension",
                "django_jinja.builtins.extensions.CacheExtension",
                "django_jinja.builtins.extensions.TimezoneExtension",
                "django_jinja.builtins.extensions.UrlsExtension",
                "django_jinja.builtins.extensions.StaticFilesExtension",
                "django_jinja.builtins.extensions.DjangoFiltersExtension",
                "reactpy_django.templatetags.jinja.ReactPyExtension",    # new extension
            ],
            "bytecode_cache": {
                "name": "default",
                "backend": "django_jinja.cache.BytecodeCache",
                "enabled": False,
            },
            "autoescape": True,
            "auto_reload": DEBUG,
            "translation_engine": "django.utils.translation",
        },
    },
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates', # Django templates.

Add the new app:

INSTALLED_APPS = [
     ...
    "reactpy_django",
 ]

File of components in components.py:

from reactpy import component, html

@component
def hello_world(recipient: str):
    return html.h1(f"Hello {recipient}!")

Test view in views/react.py:

from django.shortcuts import render

def jinja_view(request):
    return render(request, "my-template.html.jinja")

Template for the view templates/my-template.html.jinja:

<!DOCTYPE html>
<html>
<body>
{{ component("paiyroll.components.hello_world", recipient="World") }}
</body>
</html>

project/asgi.py

from reactpy_django import REACTPY_WEBSOCKET_ROUTE

application = ProtocolTypeRouter({
  'http': get_asgi_application(),
  'websocket': AuthMiddlewareStack(
      URLRouter(
        ... + [REACTPY_WEBSOCKET_ROUTE]
     )

And finally project/urls.py:

from ...views import react

urlpatterns = [
     ...
     path("reactpy/", include("reactpy_django.http.urls")),
     path("react/", react.jinja_view),
 ]

Once Django is restarted, navigating to the view, you should see
Hello World!

Checklist:

Please update this checklist as you complete each item:

Tests have been developed for bug fixes or new functionality.
The changelog has been updated, if necessary.
Documentation has been updated, if necessary.
GitHub Issues closed by this PR have been linked.

_{By submitting this pull request you agree that all contributions comply with this project's open source license(s).}

ShaheedHaque · 2023-10-10T00:57:33Z

OK, this now render the "Hello World!" correctly.

Feedback requested before thinking about tests/docs etc.

Archmonger

A few comments since I took a early peak at the draft.

src/reactpy_django/templatetags/jinja.py

ShaheedHaque · 2023-11-26T20:45:38Z

Resolved last outstanding comment. And ran black.

If we are to proceed, I'd propose to squash the current commits before thinking about tests/packaging/docs etc. (FWIW, in that regard, I assume the appropriate packaging would be as something like "reactpy_django[jinja]"...but I'm not currently sure how to go about implementing that).

Archmonger · 2023-11-27T09:08:45Z

Optional dependencies can be defined within the package in setup.py. For example:

{
  "extras_require": {
    "encryption": ["cryptography", "pycryptodome"],
  },
  ...
}

src/reactpy_django/templatetags/jinja.py

ShaheedHaque · 2023-11-27T14:04:52Z

Optional dependencies can be defined within the package in setup.py. For example:
{
  "extras_require": {
    "encryption": ["cryptography", "pycryptodome"],
  },
  ...
}

Thanks, I'm more or less familiar with this bit. I was more thinking about the new file I have added (and any supporting test file), and whether that could/should be omitted unless "[jinja] was specified?

Archmonger · 2023-12-31T20:48:37Z

I have some changes in one of my PRs that will simplify test configuration
#190

TLDR: Our test suite can now run multiple different Django settings.py files.

And yes, from the user's perspective we should have all the jinja dependencies be optional via reactpy_django[jinja]

Archmonger · 2024-01-08T06:37:12Z

My PR has been merged. All settings_*.py files within the test app will now automatically run tests against them.

There shouldn't be anything blocking this PR anymore, so you'll need to do the following:

Add the needed dependencies to the test-env.txt
Add the needed dependencies to the optional extras using the [jinja] keyword.
Copy settings_single_db.py to create settings_jinja.py.
Write some conditional tests within the test folder.
- We don't want to run jinja tests in other testing environments, so we'll need a flag within settings.py to conditionally run these tests.
- This might extend to preventing all other tests to run within the Jinja environment. In a perfect world, we would have some way of magically re-using all our old tests within a Jinja test environment, not sure if that's feasible though. I'll let you figure that best solution to that.
Write a new page of documentation based on the current installation page.
- Probably will require changing the mkdocs.yml nav menu to look something like
- Get Started > Add ReactPy to your ... > Django Project
- Get Started > Add ReactPy to your ... > Django-Jinja Project

ShaheedHaque · 2024-01-11T02:17:59Z

Noted. I've a full plate right now but have this on my radar.

ShaheedHaque requested a review from a team as a code owner October 9, 2023 20:24

Archmonger marked this pull request as draft October 9, 2023 21:40

Archmonger linked an issue Oct 9, 2023 that may be closed by this pull request

Support Jinja2 templates #198

Open

ShaheedHaque force-pushed the srh_jinja_support branch from 54906cf to 1384632 Compare October 10, 2023 00:54

ShaheedHaque force-pushed the srh_jinja_support branch from 1384632 to 2d282e4 Compare October 10, 2023 01:12

WIP Jinja support.

7e97489

ShaheedHaque force-pushed the srh_jinja_support branch from 2d282e4 to 7e97489 Compare October 10, 2023 01:13

Archmonger reviewed Oct 11, 2023

View reviewed changes

src/reactpy_django/templatetags/jinja.py Outdated Show resolved Hide resolved

src/reactpy_django/templatetags/jinja.py Outdated Show resolved Hide resolved

src/reactpy_django/templatetags/jinja.py Outdated Show resolved Hide resolved

Archmonger reviewed Oct 11, 2023

View reviewed changes

Archmonger reviewed Oct 20, 2023

View reviewed changes

src/reactpy_django/templatetags/jinja.py Outdated Show resolved Hide resolved

Address second pass review comments.

d432639

ShaheedHaque force-pushed the srh_jinja_support branch from 1a8b8a7 to d432639 Compare November 10, 2023 20:47

Address lastoutstadnngcomment, and run black.

d888b4d

Archmonger reviewed Nov 27, 2023

View reviewed changes

src/reactpy_django/templatetags/jinja.py Outdated Show resolved Hide resolved

Archmonger reviewed Nov 27, 2023

View reviewed changes

src/reactpy_django/templatetags/jinja.py Outdated Show resolved Hide resolved

Address copyright, and use of constant to locate template.

3f56d4e

Archmonger changed the title ~~WIP Jinja support.~~ Add Jinja support Jan 29, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add Jinja support #199

Add Jinja support #199

ShaheedHaque commented Oct 9, 2023 •

edited by Archmonger

Loading

ShaheedHaque commented Oct 10, 2023

Archmonger left a comment •

edited

Loading

ShaheedHaque commented Nov 26, 2023

Archmonger commented Nov 27, 2023 •

edited

Loading

ShaheedHaque commented Nov 27, 2023

Archmonger commented Dec 31, 2023 •

edited

Loading

Archmonger commented Jan 8, 2024 •

edited

Loading

ShaheedHaque commented Jan 11, 2024

Add Jinja support #199

Are you sure you want to change the base?

Add Jinja support #199

Conversation

ShaheedHaque commented Oct 9, 2023 • edited by Archmonger Loading

Description

Checklist:

ShaheedHaque commented Oct 10, 2023

Archmonger left a comment • edited Loading

Choose a reason for hiding this comment

ShaheedHaque commented Nov 26, 2023

Archmonger commented Nov 27, 2023 • edited Loading

ShaheedHaque commented Nov 27, 2023

Archmonger commented Dec 31, 2023 • edited Loading

Archmonger commented Jan 8, 2024 • edited Loading

ShaheedHaque commented Jan 11, 2024

ShaheedHaque commented Oct 9, 2023 •

edited by Archmonger

Loading

Archmonger left a comment •

edited

Loading

Archmonger commented Nov 27, 2023 •

edited

Loading

Archmonger commented Dec 31, 2023 •

edited

Loading

Archmonger commented Jan 8, 2024 •

edited

Loading