FFWEB-2125: Hide category filter on category page

Author: a.laurowski

.gitignore

@@ -1,2 +1,3 @@
 composer.lock
 /vendor
+.idea

CHANGELOG.md

@@ -1,9 +1,14 @@
 # Changelog
-## [Unreleased]
+## UNRELEASED
 ### Add 
  - Export
   - Added new field provider `Omikron\FactFinder\Shopware6\Export\Field\Layout` applicable to CMS Export
 
+### Change
+ - Category
+  - hide `<ff-asn-group>` responsible for rendering category filters as this breaks the Web Components navigation mode.
+   User should navigate between categories using shop main navigation
+ 
 ## [v3.0.1] - 2022.03.10
 ### Fix
  - `Omikron\FactFinder\Shopware6\Subscriber\CategoryView`

src/Resources/views/storefront/components/factfinder/asn-group.html.twig

@@ -0,0 +1,21 @@
+{% block component_factfinder_asn_group_single %}
+{{ groupName }}
+<ff-asn-group for-group="{{ groupName}}" class="filter-panel-item dropdown {% if vertical %}  ffw-asn-group-vertical btn-block {% endif %} {{ cssClass }}"
+              disable-auto-expand>
+  <div slot="groupCaption" class="filter-panel-item-toggle btn {% if vertical %} btn-block {% endif %}">
+    {{ '{{group.name}}' }}
+    {% sw_icon 'arrow-medium-down' style { 'pack': 'solid', 'size': 'xs', 'class': 'filter-panel-item-toggle' } %}
+  </div>
+  <ff-asn-group-element class="filter-multi-select-list-item" {% if vertical %}
+                        ffw-asn-group-element-vertical {% endif %}">
+  <div slot="selected" class="custom-control custom-checkbox">
+    <input type="checkbox" class="custom-control-input filter-multi-select-checkbox" checked/>
+    <span class="filter-multi-select-item-label custom-control-label">{{ '{{element.name}}' }}</span>
+  </div>
+  <div slot="unselected" class="custom-control custom-checkbox">
+    <input type="checkbox" class="custom-control-input filter-multi-select-checkbox"/>
+    <span class="filter-multi-select-item-label custom-control-label">{{ '{{element.name}}' }}</span>
+  </div>
+  </ff-asn-group-element>
+</ff-asn-group>
+{% endblock %}

src/Resources/views/storefront/components/factfinder/asn.html.twig

@@ -16,6 +16,16 @@
       unresolved
       subscribe="{{ subscribe ? 'true' : 'false' }}"
       topic="{{ topic|default('asn') }}">
+
+      {% block component_factfinder_asn_group_custom %}
+        {% for group in customGroups %}
+          {% sw_include group.template ignore missing with {
+            cssClass: group.cssClass,
+            groupName: group.groupName
+          } %}
+        {% endfor %}
+      {% endblock %}
+
       {% block component_factfinder_asn_group %}
         <ff-asn-group class="filter-panel-item dropdown {% if vertical %} ffw-asn-group-vertical btn-block {% endif %}"
                       disable-auto-expand>

src/Resources/views/storefront/element/cms-element-asn.html.twig

@@ -2,10 +2,16 @@
   {% set config = element.config %}
   {% set id = config.id.value|default(element.id) %}
   {% set topic = config.topic.value|default('asn') %}
-
   {% sw_include '@Parent/storefront/components/factfinder/asn.html.twig' with {
     vertical: config.vertical.value,
     subscribe: config.subscribe.value,
+    customGroups: [
+      {
+        groupName : page.extensions.factfinder.categoryPathFieldName,
+        cssClass: 'd-none',
+        template: '@Parent/storefront/components/factfinder/asn-group.html.twig'
+      }
+    ],
     filterCloud: config.filterCloud.value,
     filterCloudBlacklist: config.filterCloudBlacklist.value,
     filterCloudWhitelist: config.filterCloudWhitelist.value,

src/Subscriber/CategoryPageSubscriber.php

@@ -63,7 +63,12 @@ public function onPageLoaded(NavigationPageLoadedEvent $event): void
                 'add-params'       => implode(',', array_map(fn (string $key, string $value): string => sprintf('%s=%s', $key, $value), array_keys($mergedAddParams), array_values($mergedAddParams))),
             ] + ($searchImmediate ? ['category-page' => $this->prepareCategoryPath($category)] : []);
 
-        $event->getPage()->getExtension('factfinder')->assign(['communication' => $communication]);
+        $event->getPage()->getExtension('factfinder')->assign(
+            [
+                'communication'         => $communication,
+                'categoryPathFieldName' => "{$this->fieldName}ROOT",
+            ]
+        );
     }
 
     private function prepareCategoryPath(CategoryEntity $categoryEntity): string