From 385c475a347af9d310cf95f32044955ba35b1cdf Mon Sep 17 00:00:00 2001
From: slaveeks <chernyshev2001@icloud.com>
Date: Mon, 1 Aug 2022 16:53:53 +0300
Subject: [PATCH] Changed navigator component by passing objects, removed
 navigator wrapper

---
 src/backend/views/components/navigator.twig   | 47 ++++++++++++-------
 src/backend/views/pages/page.twig             |  3 +-
 src/frontend/styles/components/navigator.pcss |  1 -
 3 files changed, 32 insertions(+), 19 deletions(-)

diff --git a/src/backend/views/components/navigator.twig b/src/backend/views/components/navigator.twig
index 7fa17e5..e7f8cda 100644
--- a/src/backend/views/components/navigator.twig
+++ b/src/backend/views/components/navigator.twig
@@ -1,13 +1,12 @@
 {#
 Reusable navigaor component.
 Available props:
-  - label
-  - direction: previous, next
-  - url: navigation link
-  - class: additional class for the button
+  - previousPage
+  - nextPage
+  - class: additional class for the navigator
 
 Usage example:
-  {% include 'components/navigator.twig' with {label: 'Previous page', direction: 'previous'} %}
+  {% include 'components/navigator.twig' with {previousPage: previousPage, nextPage: nextPage} %}
 #}
 
 {% set mainClass = 'navigator' %}
@@ -15,23 +14,39 @@ Usage example:
 
 {% set tag = 'div' %}
 
-{% if url is not empty %}
-  {% set tag = 'a' %}
-{% endif %}
+{% set tag = 'a' %}
 
-<div class="navigator--wrapper">
-  {% if label and url %}
+<div>
+  {% if previousPage %}
     <{{ tag }}
       {{ name is not empty ? 'name="' ~ name ~ '"': '' }}
-        class="{{ mainClass }} {{ mainClass }}--{{ direction|default('previous') }} {{ class ?? '' }}"
-      {{ url is not empty ? 'href="' ~ url ~ '"' : '' }}
+        class="{{ mainClass }} {{ mainClass }}--previous {{ class ?? '' }}"
+      href="/{{ previousPage.uri }}"
       >
-      <div class="{{ mainClass }}__direction">
-       {{ direction }}
+      <div class="{{ mainClass }}-direction">
+       previous
       </div>
-      <div class="{{ mainClass }}__label">
-       {{ label }}
+      <div class="{{ mainClass }}-label">
+       {{ previousPage.title }}
       </div>
     </{{ tag }}>
   {% endif %}
 </div>
+
+<div>
+  {% if nextPage %}
+    <{{ tag }}
+      {{ name is not empty ? 'name="' ~ name ~ '"': '' }}
+         class="{{ mainClass }} {{ mainClass }}--next {{ class ?? '' }}"
+      href="/{{ nextPage.uri }}"
+      >
+      <div class="{{ mainClass }}-direction">
+        next
+      </div>
+      <div class="{{ mainClass }}-label">
+       {{ nextPage.title }}
+      </div>
+    </{{ tag }}>
+  {% endif %}
+</div>
+
diff --git a/src/backend/views/pages/page.twig b/src/backend/views/pages/page.twig
index 3244bed..e3f0bdc 100644
--- a/src/backend/views/pages/page.twig
+++ b/src/backend/views/pages/page.twig
@@ -40,8 +40,7 @@
       {%  endfor %}
     </section>
     <footer class="page__footer">
-        {% include 'components/navigator.twig' with {label:  previousPage.title, direction: 'previous', url: '/' ~ previousPage.uri} %}
-        {% include 'components/navigator.twig' with {label:  nextPage.title, direction: 'next', url: '/' ~ nextPage.uri} %}
+        {% include 'components/navigator.twig' with {previousPage:  previousPage, nextPage: nextPage} %}
     </footer>
   </article>
 
diff --git a/src/frontend/styles/components/navigator.pcss b/src/frontend/styles/components/navigator.pcss
index d41ae30..a6f52f6 100644
--- a/src/frontend/styles/components/navigator.pcss
+++ b/src/frontend/styles/components/navigator.pcss
@@ -34,4 +34,3 @@
 }
 
 
-