implement the updatesQueryString partially

Author: Andres Vargas

TODO.md

@@ -1 +1,4 @@
+* unittest
 * ask for how wire:model="parent.message" works ?
+* Updating The Query String
+*

app/urls.py

@@ -10,8 +10,10 @@
     path('counter', TV.as_view(template_name="counter.html"), name="counter"),
     path('helloworld', TV.as_view(template_name="helloworld.html"),
          name="helloworld"),
-    path('posts', posts , name='posts'),
+    path('posts', posts, name='posts'),
     path('search-posts', TV.as_view(template_name="search_post.html"),
          name="search_post"),
+    path('show-posts/', TV.as_view(template_name="show_post.html"),
+         name="show_post"),
     path('', TV.as_view(template_name="index.html"), name="index"),
 ] + staticfiles_urlpatterns()

core/templates/show_post.html

@@ -0,0 +1,13 @@
+{% extends "base.html" %}
+{% load livewire_tags %}
+{% block content %}
+
+<h2 class="subtitle">
+Show post
+</h2>
+<hr>
+    {% with post_id=1  %}
+        {% livewire "show_post" post_id=post_id %}
+    {% endwith %}
+
+{% endblock content %}

core/templates/show_post.livewire.html

@@ -0,0 +1,14 @@
+<div>
+    
+    <h1 class="title">{{post.title}}</h1>
+
+    <p class="content">
+        {{post.content}}
+    </p>
+
+    <div>
+        <button class="button is-danger" wire:click="delete_post">Delete</button>
+
+    </div>
+
+</div>

core/views.py

@@ -43,16 +43,30 @@ class HelloworldDatabindLivewire(LivewireComponent):
 
 class SearchPostsLivewire(LivewireComponent):
     search = ""
-
+    updates_query_string = ("search", )
+    # TODO must recive the request
     def mount(self, **kwargs):
         posts = Post.objects.all()
         if self.search:
-            print("search:" + self.search)
-            posts = posts.filter(Q(title__icontains=self.search) | \
-	    		         Q(content__icontains=self.search))
-            print("c: {}".format(posts.count()))
+            param = Q(title__icontains=self.search) | Q(content__icontains=self.search)
+            posts = posts.filter(param)
+        return {
+            'posts': list(posts.values("id", "title", "content")),
+            'search': self.search  # TODO: before mount we must put the new value of the search for updates_query_string works and work on the url
+        }
+
+
+class ShowPostLivewire(LivewireComponent):
+    post_id = None
 
+
+    def mount(self, **kwargs):
+        post_id = kwargs.get("post_id")
+        post = Post.objects.get(id=post_id)
+        self.post_id = post_id
         return {
-            'posts': list(posts.values("id", "title", "content"))
+            'post': {'title': post.title, 'content': post.content}
         }
 
+
+

livewire/templatetags/livewire_tags.py

@@ -7,7 +7,7 @@
 def livewire_scripts(context):
     return context
 
-@register.simple_tag
-def livewire(component,**kwargs):
+@register.simple_tag(takes_context=True)
+def livewire(context, component,**kwargs):
     livewire_component = instance_class(component, **kwargs)
     return livewire_component.render_initial()

livewire/views.py

@@ -15,23 +15,23 @@
 
 log = logging.getLogger(__name__)
 
+
 def livewire_message(request, component_name):
     inst = instance_class(component_name)
     if request.method == "POST":
-        body = json.loads(request.body)
-        inst.parser_payload(body)
-    return JsonResponse(inst.render(), safe=False)
+        inst.parser_payload(request)
+    return JsonResponse(inst.render(request), safe=False)
 
 
 class LivewireComponent(object):
     __id = None
-
+    __request = None
 
     def __init__(self, **kwargs):
         self.__kwargs = kwargs
 
     def get_component_name(self):
-        name = self.__class__.__name__.replace("Livewire","")
+        name = self.__class__.__name__.replace("Livewire", "")
         name = snakecase(name)
         return name
 
@@ -40,7 +40,9 @@ def get_dom(self):
         log.debug(context)
         return self._render_component(context)
 
-    def fill(self, context):  # Livewire Compatility https://laravel-livewire.com/docs/properties
+    def fill(
+        self, context
+    ):  # Livewire Compatility https://laravel-livewire.com/docs/properties
         self.update_context(context)
 
     def get_context(self):
@@ -49,26 +51,29 @@ def get_context(self):
         params = get_vars(self)
         for property in params:
             mount_result[property] = getattr(self, property)
-        if hasattr(self, "mount") and callable(self.mount):   # Livewire Compatility
+        if hasattr(self, "mount") and callable(self.mount):  # Livewire Compatility
             mount_result = self.mount(**kwargs)
         return mount_result
 
-    def get_response(self):
+    def get_response(self):  # TODO: chnge to use render method on component view
         dom = self.get_dom()
-        return {
-            'id': self.__id,
-            'name': self.get_component_name(),
-            'dom': dom,
-            'fromPrefetch': '',
-            'redirectTo': '',
-            'children': [],
-            'dirtyInputs': [],
-            'data': self.get_context(),
-            'eventQueue': [],
-            'dispatchQueue': [],
-            'events': [],
-            'checksum': "c24"
+        json_response = {
+            "id": self.__id,
+            "name": self.get_component_name(),
+            "dom": dom,
+            "fromPrefetch": "",
+            "redirectTo": "",
+            "children": [],
+            "dirtyInputs": [],
+            "data": self.get_context(),
+            "eventQueue": [],
+            "dispatchQueue": [],
+            "events": [],
+            "checksum": "c24",
         }
+        if hasattr(self, "updates_query_string"):
+            json_response.update({'updatesQueryString': self.updates_query_string})
+        return json_response
 
     def update_context(self, data_context):
         context = self.get_context()
@@ -78,7 +83,9 @@ def update_context(self, data_context):
             setattr(self, key, value)
         return context
 
-    def parser_payload(self, payload):
+    def parser_payload(self, request):
+        self.__request = request
+        payload = json.loads(request.body)
         self.__id = payload.get("id")
         action_queue = payload.get("actionQueue", [])
         for action in action_queue:
@@ -101,16 +108,18 @@ def parser_payload(self, payload):
                 data[action_payload["name"]] = action_payload["value"]
                 self.update_context(data)
 
-    def render(self):
+    # TODO: chnge to use render method on component view
+    def render(self, request):
         response = self.get_response()
         return response
 
     def _render_component(self, context, initial_data={}):
         component_name = self.get_component_name()
-        component_render = render_to_string(f'{component_name}.livewire.html',
-                                            context=context)
+        component_render = render_to_string(
+            f"{component_name}.livewire.html", context=context
+        )
         root = htmlement.fromstring(component_render).find("div")
-        root.set('wire:id', self.__id)
+        root.set("wire:id", self.__id)
         if initial_data:
             root.set("wire:initial-data", json.dumps(initial_data))
         res = ET.tostring(root)
@@ -121,15 +130,14 @@ def render_initial(self):
         component = self.get_component_name()
         context = self.get_context()
         initial_data = {
-            'id': self.__id,
-            'name': component,
-            'redirectTo': False,
+            "id": self.__id,
+            "name": component,
+            "redirectTo": False,
             "events": [],
             "eventQueue": [],
             "dispatchQueue": [],
             "data": context,
             "children": {},
-            "checksum": "9e4c194bb6aabf5f1"  # TODO: checksum
+            "checksum": "9e4c194bb6aabf5f1",  # TODO: checksum
         }
         return self._render_component(context, initial_data=initial_data)
-