[BUGFIX] Make setup wizard compatible with v12

Classes/Controller/BackendController.php

@@ -17,6 +17,7 @@
 use T3G\AgencyPack\Blog\Service\CacheService;
 use T3G\AgencyPack\Blog\Service\SetupService;
 use TYPO3\CMS\Backend\Template\ModuleTemplateFactory;
+use TYPO3\CMS\Core\Http\RedirectResponse;
 use TYPO3\CMS\Core\Messaging\FlashMessage;
 use TYPO3\CMS\Core\Page\PageRenderer;
 use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;
@@ -157,13 +158,14 @@ public function updateCommentStatusAction(string $status, string $filter = null,
         $this->redirect('comments', null, null, ['filter' => $filter, 'blogSetup' => $blogSetup]);
     }
 
-    public function createBlogAction(array $data = null): void
+    public function createBlogAction(array $data = null): ResponseInterface
     {
         if ($data !== null && $this->setupService->createBlogSetup($data)) {
             $this->addFlashMessage('Your blog setup has been created.', 'Congratulation');
         } else {
             $this->addFlashMessage('Sorry, your blog setup could not be created.', 'An error occurred', FlashMessage::ERROR);
         }
-        $this->redirect('setupWizard');
+
+        return new RedirectResponse($this->uriBuilder->reset()->uriFor('setupWizard'));
     }
 }

Resources/Private/JavaScript/backend/SetupWizard.js

@@ -1,42 +1,54 @@
 /**
  * Module: TYPO3/CMS/Blog/SetupWizard
  */
-import $ from "jquery";
 import Modal from "TYPO3/CMS/Backend/Modal";
 import Severity from "TYPO3/CMS/Backend/Severity";
 
-var SetupWizard = {
+const SetupWizard = {
     triggerSelector: '.t3js-setup-wizard-trigger',
     modalContentSelector: '.t3js-setup-wizard-step1 .step-content'
 };
 
 SetupWizard.initialize = function() {
-    $(document).on('click', SetupWizard.triggerSelector, function(e) {
-        e.preventDefault();
-        var $element = $(this);
-        var $content = $(SetupWizard.modalContentSelector).clone();
+    const triggerSelector = document.querySelector(SetupWizard.triggerSelector);
+    triggerSelector.addEventListener('click', (event) => {
+        event.preventDefault();
+        const element = event.target;
+        var content = document.querySelector(SetupWizard.modalContentSelector).cloneNode(true);
         var buttons = [
             {
-                text: $element.data('button-close-text') || 'Close',
+                text: element.dataset.buttonCloseText || 'Close',
                 active: true,
                 btnClass: 'btn-default',
-                trigger: function() {
-                    Modal.currentModal.trigger('modal-dismiss');
+                trigger: (event, modal) => {
+                    if (modal !== undefined) {
+                        modal.hideModal();
+                    } else {
+                        Modal.currentModal.trigger('modal-dismiss');
+                    }
                 }
             },
             {
-                text: $element.data('button-ok-text') || 'OK',
+                text: element.dataset.buttonOkText || 'OK',
                 btnClass: 'btn-primary',
-                trigger: function(evt) {
-                    self.location.href = $element.attr('href')
-                        .replace('%40title', Modal.currentModal.find('input[name="title"]').val())
-                        .replace('%40template', Modal.currentModal.find('input[name="template"]:checked').length)
-                        .replace('%40install', Modal.currentModal.find('input[name="install"]:checked').length);
-                    Modal.currentModal.trigger('modal-dismiss');
+                trigger: (event, modal) => {
+                    if (modal !== undefined) {
+                        self.location.href = element.getAttribute('href')
+                            .replace('@title', modal.querySelector('input[name="title"]').value)
+                            .replace('@template', modal.querySelectorAll('input[name="template"]:checked').length)
+                            .replace('@install', modal.querySelectorAll('input[name="install"]:checked').length)
+                        modal.hideModal();
+                    } else {
+                        self.location.href = element.getAttribute('href')
+                            .replace('%40title', Modal.currentModal.find('input[name="title"]').val())
+                            .replace('%40template', Modal.currentModal.find('input[name="template"]:checked').length)
+                            .replace('%40install', Modal.currentModal.find('input[name="install"]:checked').length);
+                        Modal.currentModal.trigger('modal-dismiss');
+                    }
                 }
             }
         ];
-        Modal.show('Blog Setup Wizard', $content, Severity.notice, buttons);
+        Modal.show('Blog Setup Wizard', content, Severity.notice, buttons);
     });
 };
 

Resources/Private/Partials/Backend/CreateWizard.html

@@ -5,8 +5,8 @@
         <p><f:translate key="wizard.description" /></p>
         <div class="options" style="background-color: #eeeeee;padding: 10px;border: 1px solid #bbbbbb;">
             <h4><f:translate key="wizard.headline.settings" /></h4>
-            <div class="form-group">
-                <label><f:translate key="wizard.label.title" /></label>
+            <div class="form-group mb-0">
+                <label class="form-label"><f:translate key="wizard.label.title" /></label>
                 <f:form.textfield name="title" class="form-control" placeholder="{f:translate(key: 'wizard.placeholder.title')}"/>
             </div>
         </div>

Resources/Private/Partials/Backend/UrlSetup.html

@@ -1,5 +1,7 @@
+<div class="mt-3">
 <f:be.infobox title="URL Setup">
 <p>The extension provides a frontend route enhancer configuration that you can include it in your site configuration.</p>
 <pre><code>imports:
     - { resource: "EXT:blog/Configuration/Routes/Default.yaml" }</code></pre>
 </f:be.infobox>
+</div>