mixxorz / slippers

A UI component framework for Django. Built on top of Django Template Language.

Home Page:https://mitchel.me/slippers/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Feature request: Transparently pass request object to components if present

mixxorz opened this issue · comments

I'm considering passing the request object from the parent context to the component transparently if it's available. My reasoning is that a bunch of existing template tags require the request object to function.

Thoughts?

Yes please! And if possible add a flag in settings, that will allow passing all context from the parent component to the component? So people can choose if they want to have parent context passing or not.

Yes please! And if possible add a flag in settings, that will allow passing all context from the parent component to the component? So people can choose if they want to have parent context passing or not.

that would be nice, I'm passing long arguments in my components now and it becomes ugly.

example:
{% header_title_component object=event tab_name=agenda.name title=agenda.title date=agenda.date %}

I would love that, I'm grinding my brain to find a workaround on a related problem, as I'm running slippers with htmx for a couple months, we're now struggling on passing many parameters and using them.

Right now this is the the Button component we have (with lots of improvements like using the match to theme the button etc):

{% comment %}
    * Parameters *
    id
    hx-get
    hx-post
    hx-delete
    hx-put
    hx-target
    hx-swap
    hx-push-url
    hx-indicator
    hx-include
    class
    onclick
    disabled
    text: string
{% endcomment %}
{% var class=class|default:"flex justify-center w-full sm:w-fit inline-flex items-center px-3 py-1.5 border border-transparent text-sm leading-4 font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:bg-gray-200 disabled:text-gray-400" %}
<button {% attrs id hx-get hx-post hx-delete hx-put hx-target hx-swap hx-push-url hx-indicator hx-include disabled class onclick %} type="button">
    {{ text }}
</button>
# usage
{% Button
    text="Discard"
    onclick=toggle_discard_modal_fn
    hx-delete=discard_suggestion_url
    hx-swap="outerHTML swap:0.5s"
    hx-target="#"|concat:card_id
    hx-include="#"|concat:form_id
%}

I'm trying to find something like {% attrs **kwargs %} to kinda implement the {...props} destructing from react, any ideas?

Overall I like the idea behind #51 to pass along the children parameters and also in this case the request (maybe even extrapolate this to all available variables in that template - not sure the impact on Django' template variable resolution)

Yeah, we are also using it together with HTMX, it's indeed cumbersome

I opened a PR for this: #64
I am only passing the request if it's present, not the whole context, because I like that the context is sort of isolated at the component level. On the other hand, I find what @luanfonceca suggests for the {% attrs **kwargs %} quite useful, so I could look at that separately too.