IBX-7671: Fixed inconsistent behavior for create from context menu (#…

…1154)

For more details see https://issues.ibexa.co/browse/IBX-7671 and #1154

Key changes:

* Fixed inconsistent content tree behavior for create from context menu and from action main button

src/bundle/Resources/public/js/scripts/sidebar/btn/location.create.js

@@ -1,11 +1,6 @@
 (function (global, doc) {
     const createActions = doc.querySelectorAll('.ibexa-extra-actions--create');
-
-    if (!createActions.length) {
-        return;
-    }
-
-    createActions.forEach((container) => {
+    const bindCreateActionsEvents = (container) => {
         const radioInputs = container.querySelectorAll('.form-check [type="radio"]');
         const submitBtn = container.querySelector('.ibexa-extra-actions__btn--confirm');
 
@@ -24,5 +19,17 @@
                 false,
             ),
         );
+    };
+
+    doc.body.addEventListener('ibexa-instant-filters:add-group', (event) => {
+        const createActionsContainer = event.detail.container.closest('.ibexa-extra-actions--create');
+
+        bindCreateActionsEvents(createActionsContainer);
     });
+
+    if (!createActions.length) {
+        return;
+    }
+
+    createActions.forEach(bindCreateActionsEvents);
 })(window, window.document);

src/bundle/Resources/public/js/scripts/sidebar/instant.filter.js

@@ -50,5 +50,11 @@
         );
     };
 
+    doc.body.addEventListener('ibexa-instant-filters:add-group', (event) => {
+        const filterContainer = event.detail.container.closest('.ibexa-instant-filter');
+
+        initFilter(filterContainer);
+    });
+
     filters.forEach(initFilter);
 })(window, window.document);

src/bundle/Resources/views/themes/admin/content/widget/content_create.html.twig

@@ -39,7 +39,10 @@
                     <div class="ibexa-instant-filter__desc">
                         {{ ('content.create.filters.desc'|trans|desc('Select a content type from list')) }}
                     </div>
-                    <div class="ibexa-instant-filter__items">
+                    <div
+                        class="ibexa-instant-filter__items"
+                        data-group-template="{{ include("@ibexadesign/content/widget/instant_filter_group_template.html.twig")|e('html_attr') }}"
+                    >
                         {{ form_widget(form.content_type) }}
                     </div>
                 </div>

src/bundle/Resources/views/themes/admin/content/widget/instant_filter_group_template.html.twig

@@ -0,0 +1,7 @@
+<div class="ibexa-instant-filter__group">
+    <div class="ibexa-instant-filter__group-name">
+        {{ group_name|default('{{ group_name }}') }}
+    </div>
+
+    {{ group_options|default('{{ group_options }}') }}
+</div>

src/bundle/Resources/views/themes/admin/ui/form_fields.html.twig

@@ -58,7 +58,7 @@
                 {{- block('content_type_choice_widget_options') -}}
             </div>
         {%- else -%}
-            <div class="ibexa-instant-filter__group-item">
+            <div class="ibexa-instant-filter__group-item" data-identifier="{{ option.value }}">
                 <label class="ibexa-instant-filter__group-item-label-icon" for="{{ form[key].vars.id }}">
                     <svg class="ibexa-icon ibexa-icon--small">
                         <use xlink:href="{{ ibexa_content_type_icon(option.value) }}"></use>

src/bundle/ui-dev/src/modules/universal-discovery/hooks/useFindLocationsByParentLocationIdFetch.js

@@ -52,6 +52,8 @@ export const useFindLocationsByParentLocationIdFetch = (locationData, { sortClau
                 {
                     ...restInfo,
                     parentLocationId: locationData.parentLocationId,
+                    limit,
+                    offset,
                 },
                 resolve,
             );

src/bundle/ui-dev/src/modules/universal-discovery/services/universal.discovery.service.js

@@ -14,6 +14,7 @@ const ENDPOINT_ACCORDION = '/api/ibexa/v2/module/universal-discovery/accordion';
 const ENDPOINT_LOCATION_LIST = '/api/ibexa/v2/module/universal-discovery/locations';
 
 export const QUERY_LIMIT = 50;
+export const AGGREGATIONS_LIMIT = 4;
 
 const showErrorNotificationAbortWrapper = (error) => {
     if (error?.name === 'AbortError') {
@@ -483,20 +484,24 @@ export const fetchAdminConfig = async ({ token, siteaccess, accessToken, instanc
     return adminUiConfig.ApplicationConfig;
 };
 
-export const findSuggestions = ({ siteaccess, token, parentLocationId }, callback) => {
+export const findSuggestions = (
+    { siteaccess, token, parentLocationId, accessToken, instanceUrl = DEFAULT_INSTANCE_URL, limit = QUERY_LIMIT, offset = 0 },
+    callback,
+) => {
     const body = JSON.stringify({
         ViewInput: {
             identifier: 'view_with_aggregation',
             LocationQuery: {
-                limit: '10',
-                offset: '0',
+                limit,
+                offset,
                 Filter: {
                     ParentLocationIdCriterion: parentLocationId,
                 },
                 Aggregations: [
                     {
                         ContentTypeTermAggregation: {
                             name: 'suggestions',
+                            limit: AGGREGATIONS_LIMIT,
                         },
                     },
                 ],
@@ -506,9 +511,16 @@ export const findSuggestions = ({ siteaccess, token, parentLocationId }, callbac
 
     const request = new Request(ENDPOINT_CREATE_VIEW, {
         method: 'POST',
-        headers: { ...HEADERS_CREATE_VIEW, 'X-Siteaccess': siteaccess, 'X-CSRF-Token': token },
+        headers: getRequestHeaders({
+            token,
+            siteaccess,
+            accessToken,
+            extraHeaders: {
+                ...HEADERS_CREATE_VIEW,
+            },
+        }),
         body,
-        mode: 'same-origin',
+        mode: getRequestMode({ instanceUrl }),
         credentials: 'same-origin',
     });