Share dialog for drafts list

ibexa · Feb 13, 2025 · 61c5d99 · 61c5d99
1 parent f31eea8
commit 61c5d99
Show file tree

Hide file tree

Showing 4 changed files with 69 additions and 26 deletions.
diff --git a/src/bundle/Resources/public/scss/_modals.scss b/src/bundle/Resources/public/scss/_modals.scss
@@ -42,6 +42,18 @@
         @include modal-footer();
     }
 
+    &__spinner-container {
+        display: none;
+        width: 100%;
+        min-height: calculateRem(300px);
+        align-items: center;
+        justify-content: center; 
+    }
+
+    &__spinner {
+        @include spinner(calculateRem(24px), calculateRem(3px), $ibexa-color-primary);
+    }
+
     &--no-header {
         .close {
             @include close-button();
@@ -92,4 +104,20 @@
             }
         }
     }
+
+    &--processing {
+        .modal-dialog {
+            .modal-body {
+                display: none;
+            }
+
+            .modal-footer {
+                display: none;
+            }
+
+            .ibexa-modal__spinner-container {
+                display: flex;
+            }
+        }
+    }
 }
diff --git a/src/bundle/Resources/public/scss/_tables.scss b/src/bundle/Resources/public/scss/_tables.scss
@@ -255,7 +255,7 @@
         .ibexa-table__head-row {
             .ibexa-table__cell:last-of-type,
             .ibexa-table__header-cell:last-of-type {
-                position: sticky;
+                // position: sticky;
                 right: calculateRem(-1px);
             }
         }

diff --git a/src/bundle/Resources/views/themes/admin/content/draft/draft_list.html.twig b/src/bundle/Resources/views/themes/admin/content/draft/draft_list.html.twig
@@ -65,6 +65,14 @@
                     ]) %}
 
                     {% set col_raw %}
+                        {{ ibexa_render_component_group('content-drafts-list-actions', {
+                            'content_id': row.versionId.contentId,
+                            'version_no': row.versionId.versionNo,
+                            'language_id': 2, 
+                            'as_icon': true,
+                            'dynamic_users_list': true,
+                        }) }}
+
                         <button
                             class="btn ibexa-btn ibexa-btn--ghost ibexa-btn--no-text mx-2 ibexa-btn--content-draft-edit"
                             title="{{ 'drafts.list.action.edit'|trans|desc('Edit') }}"
@@ -86,6 +94,7 @@
                             </svg>
                         </button>
                     {% endset %}
+
                     {% set body_row_cols = body_row_cols|merge([{
                         has_action_btns: true,
                         content: col_raw,
@@ -116,32 +125,33 @@
                     'data-toggle-button-id': '#confirm-' ~ form_remove.remove.vars.id
                 }
             }) }}
-            {% include '@ibexadesign/ui/component/table/table.html.twig' with {
-                headline: custom_results_headline ?? results_headline(pager.getNbResults()),
-                head_cols: [
-                    { has_checkbox: true },
-                    { has_icon: true },
-                    { content: 'drafts.list.name'|trans|desc('Name') },
-                    { content: 'drafts.list.content_type'|trans|desc('Content type') },
-                    { content: 'drafts.list.modified_language'|trans|desc('Modified language') },
-                    { content: 'drafts.list.version'|trans|desc('Version') },
-                    { content: 'drafts.list.last_saved'|trans|desc('Modified') },
-                    { },
-                ],
-                body_rows,
-                actions: macros.table_header_tools(form_remove),
-                empty_table_info_text: 'drafts.list.empty'|trans|desc('You have no drafts yet. Your drafts will show up here.'),
-            } %}
-            {% if pager.haveToPaginate %}
-                {% include '@ibexadesign/ui/pagination.html.twig' with {
-                    'pager': pager,
+                {{ ibexa_render_component_group('content-drafts-list-before', {}) }}
+                {% include '@ibexadesign/ui/component/table/table.html.twig' with {
+                    headline: custom_results_headline ?? results_headline(pager.getNbResults()),
+                    head_cols: [
+                        { has_checkbox: true },
+                        { has_icon: true },
+                        { content: 'drafts.list.name'|trans|desc('Name') },
+                        { content: 'drafts.list.content_type'|trans|desc('Content type') },
+                        { content: 'drafts.list.modified_language'|trans|desc('Modified language') },
+                        { content: 'drafts.list.version'|trans|desc('Version') },
+                        { content: 'drafts.list.last_saved'|trans|desc('Modified') },
+                        { },
+                    ],
+                    body_rows,
+                    actions: macros.table_header_tools(form_remove),
+                    empty_table_info_text: 'drafts.list.empty'|trans|desc('You have no drafts yet. Your drafts will show up here.'),
                 } %}
-            {% endif %}
-            {{ form_widget(form_remove.remove, {
-                'attr': {
-                    'hidden': true
-                }
-            }) }}
+                {% if pager.haveToPaginate %}
+                    {% include '@ibexadesign/ui/pagination.html.twig' with {
+                        'pager': pager,
+                    } %}
+                {% endif %}
+                {{ form_widget(form_remove.remove, {
+                    'attr': {
+                        'hidden': true
+                    }
+                }) }}
             {{ form_end(form_remove) }}
         </section>
     </div>

diff --git a/src/bundle/Resources/views/themes/admin/ui/component/modal/modal.html.twig b/src/bundle/Resources/views/themes/admin/ui/component/modal/modal.html.twig
@@ -110,6 +110,11 @@
                             </div>
                         {% endif %}
                     {% endblock %}
+                    {% block loader %}
+                        <div class="ibexa-modal__spinner-container">
+                            <div class="ibexa-modal__spinner"></div>
+                        </div>
+                    {% endblock %}
                 </div>
             {% endblock %}
             {% block content_after %}{% endblock %}