Home Explore Help
Sign In
CityApper
/
wagtail
mirror of https://github.com/wagtail/wagtail
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

Migrate workflow and workflow tasks enable action to a Stimulus controller (#9844)

Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
Lovelyfin00 2 years ago
parent
1e9f580b8c
commit
004faac53c
10 changed files with 110 additions and 29 deletions
Split View Show Diff Stats
  1. 1 0
      CHANGELOG.txt
  2. 10 0
      client/src/components/Draftail/decorators/__snapshots__/TooltipEntity.test.js.snap
  3. 32 0
      client/src/controllers/ActionController.test.js
  4. 46 0
      client/src/controllers/ActionController.ts
  5. 4 0
      client/src/controllers/index.ts
  6. 4 0
      client/tests/stubs.js
  7. 1 0
      docs/releases/4.2.md
  8. 6 2
      wagtail/admin/templates/wagtailadmin/workflows/edit.html
  9. 6 2
      wagtail/admin/templates/wagtailadmin/workflows/edit_task.html
  10. 0 25
      wagtail/admin/templates/wagtailadmin/workflows/includes/_edit_js.html

+ 1 - 0
CHANGELOG.txt
View File 

@@ -113,6 +113,7 @@ Changelog
 
  * Maintenance: Refactor userbar styles to use the same stylesheet as other components (Thibaud Colas)
 
  * Maintenance: Add deprecation warnings for `wagtail.core` and other imports deprecated in Wagtail 3.0 (Matt Westcott)
 
  * Maintenance: Migrate admin upgrade notification message implementation to a Stimulus controller (Loveth Omokaro)
 
+ * Maintenance: Migrate workflow and workflow tasks enable action to a Stimulus controller (Loveth Omokaro)
 
 
 
 4.1.2 (xx.xx.xxxx) - IN DEVELOPMENT

+ 10 - 0
client/src/components/Draftail/decorators/__snapshots__/TooltipEntity.test.js.snap
View File 

@@ -21,6 +21,11 @@ exports[`TooltipEntity #openTooltip 1`] = `
 
       <body
 
         data-draftail-editor-wrapper="true"
 
       >
 
+        <script
 
+          id="wagtail-config"
 
+        >
 
+          {"CSRF_TOKEN":"potato"}
 
+        </script>
 
         <div
 
           data-draftail-trigger="true"
 
         />
 
@@ -35,6 +40,11 @@ exports[`TooltipEntity #openTooltip 1`] = `
 
           "container": <body
 
             data-draftail-editor-wrapper="true"
 
           >
 
+            <script
 
+              id="wagtail-config"
 
+            >
 
+              {"CSRF_TOKEN":"potato"}
 
+            </script>
 
             <div
 
               data-draftail-trigger="true"
 
             />

+ 32 - 0
client/src/controllers/ActionController.test.js
View File 

@@ -0,0 +1,32 @@
 
+import { Application } from '@hotwired/stimulus';
 
+import { ActionController } from './ActionController';
 
+
 
+describe('ActionController', () => {
 
+  beforeEach(() => {
 
+    document.body.innerHTML = `
 
+    <button
 
+      class="button no"
 
+      data-controller="w-action"
 
+      data-action="w-action#post"
 
+      data-w-action-url-value="https://www.github.com"
 
+    >
 
+      Enable
 
+    </button>
 
+    `;
 
+    Application.start().register('w-action', ActionController);
 
+  });
 
+
 
+  it('it should enable the workflow on click', () => {
 
+    const btn = document.querySelector('[data-controller="w-action"]');
 
+    const submitMock = jest.fn();
 
+    window.HTMLFormElement.prototype.submit = submitMock;
 
+
 
+    btn.click();
 
+
 
+    const form = document.querySelector('form');
 
+
 
+    expect(submitMock).toHaveBeenCalled();
 
+    expect(form.action).toBe('https://www.github.com/');
 
+    expect(new FormData(form).get('csrfmiddlewaretoken')).toBe('potato');
 
+  });
 
+});

+ 46 - 0
client/src/controllers/ActionController.ts
View File 

@@ -0,0 +1,46 @@
 
+import { Controller } from '@hotwired/stimulus';
 
+import { WAGTAIL_CONFIG } from '../config/wagtailConfig';
 
+
 
+/**
 
+ * <button type="submit" class="button no"
 
+ * data-controller="w-action"
 
+ * data-action="click->w-action#post"
 
+ * data-w-action-redirect-value="true"
 
+ * data-w-action-url-value = '{{ view.get_enable_url }}'>Enable</button>
 
+ */
 
+export class ActionController extends Controller {
 
+  static values = {
 
+    redirect: String,
 
+    url: String,
 
+  };
 
+
 
+  urlValue: string;
 
+  redirectValue: any;
 
+
 
+  post(event: Event) {
 
+    event.preventDefault();
 
+    event.stopPropagation();
 
+
 
+    const formElement = document.createElement('form');
 
+
 
+    formElement.action = this.urlValue;
 
+    formElement.method = 'POST';
 
+
 
+    const csrftokenElement = document.createElement('input');
 
+    csrftokenElement.type = 'hidden';
 
+    csrftokenElement.name = 'csrfmiddlewaretoken';
 
+    csrftokenElement.value = WAGTAIL_CONFIG.CSRF_TOKEN;
 
+    formElement.appendChild(csrftokenElement);
 
+
 
+    if (this.redirectValue) {
 
+      const nextElement = document.createElement('input');
 
+      nextElement.type = 'hidden';
 
+      nextElement.name = 'next';
 
+      nextElement.value = window.location.href;
 
+      formElement.appendChild(nextElement);
 
+    }
 
+
 
+    document.body.appendChild(formElement);
 
+    formElement.submit();
 
+  }
 
+}

+ 4 - 0
client/src/controllers/index.ts
View File 

@@ -1,5 +1,7 @@
 
 import type { Definition } from '@hotwired/stimulus';
 
 
+// Order controller imports alphabetically.
 
+import { ActionController } from './ActionController';
 
 import { AutoFieldController } from './AutoFieldController';
 
 import { SkipLinkController } from './SkipLinkController';
 
 import { UpgradeController } from './UpgradeController';
 
@@ -8,6 +10,8 @@ import { UpgradeController } from './UpgradeController';
 
  * Important: Only add default core controllers that should load with the base admin JS bundle.
 
  */
 
 export const coreControllerDefinitions: Definition[] = [
 
+  // Keep this list alphabetized.
 
+  { controllerConstructor: ActionController, identifier: 'w-action' },
 
   { controllerConstructor: AutoFieldController, identifier: 'w-auto-field' },
 
   { controllerConstructor: SkipLinkController, identifier: 'w-skip-link' },
 
   { controllerConstructor: UpgradeController, identifier: 'w-upgrade' },

+ 4 - 0
client/tests/stubs.js
View File 

@@ -32,6 +32,10 @@ global.wagtailConfig = {
 
   ACTIVE_LOCALE: 'en',
 
 };
 
 
+document.body.innerHTML = `<script id="wagtail-config">${JSON.stringify({
 
+  CSRF_TOKEN: 'potato',
 
+})}</script>`;
 
+
 
 global.wagtailVersion = '1.6a1';
 
 
 global.wagtail = {};

+ 1 - 0
docs/releases/4.2.md
View File 

@@ -144,6 +144,7 @@ This feature was developed by Jake Howard.
 
  * Refactor userbar styles to use the same stylesheet as other components (Thibaud Colas)
 
  * Add deprecation warnings for `wagtail.core` and other imports deprecated in Wagtail 3.0 (Matt Westcott)
 
  * Migrate admin upgrade notification message implementation to a Stimulus controller (Loveth Omokaro)
 
+ * Migrate workflow and workflow tasks enable action to a Stimulus controller (Loveth Omokaro)
 
 
 ## Upgrade considerations

+ 6 - 2
wagtail/admin/templates/wagtailadmin/workflows/edit.html
View File 

@@ -12,7 +12,6 @@
 
     {{ block.super }}
 
     {% include "wagtailadmin/pages/_editor_js.html" %}
 
     {{ media.js }}
 
-    {% include "wagtailadmin/workflows/includes/_edit_js.html" %}
 
 {% endblock %}
 
 
 {% block content %}
 
@@ -59,7 +58,12 @@
 
                                 <ul>
 
                                     {% if can_enable %}
 
                                         <li>
 
-                                            <button type="submit" class="button no" data-enable-action>{{ view.enable_item_label }}</button>
 
+                                            <button class="button no"
 
+                                                data-action="w-action#post"
 
+                                                data-controller="w-action"
 
+                                                data-w-action-url-value="{{ view.get_enable_url }}"
 
+                                                type="submit">{{ view.enable_item_label }}
 
+                                            </button>
 
                                         </li>
 
                                     {% elif can_disable %}
 
                                         <li>

+ 6 - 2
wagtail/admin/templates/wagtailadmin/workflows/edit_task.html
View File 

@@ -6,7 +6,6 @@
 
 {% block extra_js %}
 
     {{ block.super }}
 
     {% include "wagtailadmin/pages/_editor_js.html" %}
 
-    {% include "wagtailadmin/workflows/includes/_edit_js.html" %}
 
 {% endblock %}
 
 
 {% block content %}
 
@@ -50,7 +49,12 @@
 
                                 <ul>
 
                                     {% if can_enable %}
 
                                         <li>
 
-                                            <button type="submit" class="button no" data-enable-action>{{ view.enable_item_label }}</button>
 
+                                            <button class="button no"
 
+                                                data-action="w-action#post"
 
+                                                data-controller="w-action"
 
+                                                data-w-action-url-value="{{ view.get_enable_url }}"
 
+                                                type="submit">{{ view.enable_item_label }}
 
+                                            </button>
 
                                         </li>
 
                                     {% elif can_disable %}
 
                                         <li>

+ 0 - 25
wagtail/admin/templates/wagtailadmin/workflows/includes/_edit_js.html
View File 

@@ -1,25 +0,0 @@
 
-<script>
 
-    document.addEventListener('DOMContentLoaded', function() {
 
-        document.querySelectorAll('[data-enable-action]').forEach(function (buttonElement) {
 
-            buttonElement.addEventListener('click', function (e) {
 
-                // Stop the button from submitting the form
 
-                e.preventDefault();
 
-                e.stopPropagation();
 
-
 
-                var formElement = document.createElement('form');
 
-
 
-                formElement.action = '{{ view.get_enable_url }}';
 
-                formElement.method = 'POST';
 
-
 
-                var csrftokenElement = document.createElement('input');
 
-                csrftokenElement.type = 'hidden';
 
-                csrftokenElement.name = 'csrfmiddlewaretoken';
 
-                csrftokenElement.value = '{{ csrf_token|escapejs }}';
 
-                formElement.appendChild(csrftokenElement);
 
-
 
-                document.body.appendChild(formElement);
 
-                formElement.submit();
 
-            }, {capture: true});
 
-        })
 
-    });
 
-</script>