ENH Add link to toast when moving block (#1400)

Add the new edit link for the block when moving a block to a new parent.
This makes it easy to go make sure it's in the right order etc.

Author: GuySartorelli

client/dist/js/bundle.js

@@ -15,6 +15,7 @@
     "ElementHeader.STATE_DRAFT": "Item has not been published yet",
     "ElementHeader.STATE_MODIFIED": "Item has unpublished changes",
     "ElementList.ADD_BLOCKS": "Add blocks to place your content",
+    "ElementMoveAction.EDIT_LINK": "Go to edit form for new block parent",
     "ElementMoveAction.FAILED": "Failed to move element",
     "ElementMoveAction.MODAL_TITLE": "Move block {title}",
     "ElementMoveAction.MOVE": "Move",

client/lang/src/en.json

@@ -26,7 +26,7 @@ const MoveAction = (MenuComponent) => (props) => {
     setModalIsOpen(true);
   };
 
-  const handleSuccess = (elementalAreaId) => {
+  const handleSuccess = ({ elementalAreaId, newEditLink }) => {
     setModalIsOpen(false);
     fetchElements();
     // If we have the ID of the new elemental area, we should refetch that as well.
@@ -37,10 +37,22 @@ const MoveAction = (MenuComponent) => (props) => {
       i18n._t('ElementHeader.NOTITLE', 'Untitled {type} block'),
       { type: props.type.title }
     );
-    actions.toasts.success(i18n.inject(
+    const successMessage = i18n.inject(
       i18n._t('ElementMoveAction.SUCCESS', 'Moved block "{title}" successfully'),
       { title: elementTitle }
-    ));
+    );
+    if (newEditLink) {
+      actions.toasts.display({
+        text: successMessage,
+        type: 'success',
+        actions: [{
+          label: i18n._t('ElementMoveAction.EDIT_LINK', 'Go to edit form for new block parent'),
+          href: newEditLink,
+        }],
+      });
+    } else {
+      actions.toasts.success(successMessage);
+    }
   };
 
   const disabled = formDirty;

client/src/components/ElementActions/MoveAction.js

@@ -44,10 +44,14 @@ const MoveModal = ({
       // Throw a toast here - but let our formbuilder stuff handle populating the form with the error messages.
       actions.toasts.error(i18n._t('Admin.VALIDATIONERROR', 'Validation Error'));
     } else {
-      // Pass the ElementalAreaID which is added through ElementalAreaController::moveElement().
-      // This is used to know which elemental area needs to be updated if moving the block between
+      // Pass the elementalAreaId and/or NewEditLink which are added through ElementalAreaController::moveElement().
+      // ElementalAreaID is used to know which elemental area needs to be updated if moving the block between
       // elemental areas on the same parent.
-      onSuccess(formSchema.state.fields.find((field) => field.name === 'ElementalAreaID')?.value);
+      // NewEditLink is used to add a link to the new edit form for the block when moving to a new parent.
+      onSuccess({
+        elementalAreaId: formSchema.state.fields.find((field) => field.name === 'ElementalAreaID')?.value,
+        newEditLink: formSchema.state.fields.find((field) => field.name === 'NewEditLink')?.value,
+      });
     }
     return Promise.resolve();
   };

client/src/components/MoveModal/MoveModal.js

@@ -443,14 +443,19 @@ public function moveElement(array $data, Form $form): HTTPResponse
             ));
         }
 
+        $oldParent = $element->getPage();
         $element->moveTo($elementalArea);
 
         // Add elemental area ID to form so it can be used in the response
         // but only if it belongs to the same parent record as the old one.
         // This allows us to reload the new elemental area so we can see the block there.
-        $oldParent = $element->getPage();
         if ($parentID === $oldParent->ID && is_a($oldParent, $parentClass)) {
             $form->Fields()->add(HiddenField::create('ElementalAreaID')->setValue($elementalArea->ID));
+        } else {
+            // If moved to a different parent record, add the edit URL to the form
+            // so it can be included in the response and added to the success toast.
+            $editLink = $newParent->getCMSEditLink();
+            $form->Fields()->add(HiddenField::create('NewEditLink')->setValue($editLink));
         }
         // Create and send FormSchema JSON response
         $schemaID = $form->FormAction();

src/Controllers/ElementalAreaController.php

@@ -363,6 +363,7 @@ public function moveTo(ElementalArea $elementalArea)
         $this->doUnpublish();
         $this->Sort = null;
         $this->ParentID = $elementalArea->ID;
+        $this->cacheData = [];
         // Invoke the hook before writing so extensions don't have to trigger a second write
         $this->extend('onAfterMoveTo', $elementalArea);
         // No validation, because if field values already stored in the block itself aren't valid

src/Models/BaseElement.php

@@ -9,6 +9,7 @@ Feature: Move elements in the CMS
     #       This allows us to validate that page subclasses get boiled down to just "Page" as the hierarchical base.
     Given a "SilverStripe\FrameworkTest\Elemental\Model\MultiElementalBehatTestObject" "Blocks Object1"
     And a "SilverStripe\FrameworkTest\Elemental\Model\MultiElementalBehatTestObject" "Blocks Object2"
+    And a "SilverStripe\FrameworkTest\Elemental\Model\ElementalBehatTestObject" "Blocks Object3"
     And a "Page" "Non-elemental page"
     And a "BasicElementalPage" "Blocks Page1" with a "Block A" content element with "Some content" content
     And the "BasicElementalPage" "Blocks Page1" has a "Block B" content element with "Some content II" content
@@ -64,8 +65,7 @@ Feature: Move elements in the CMS
     And I should not see a "ElementalAreaRelation" field
     And the "input[name=ElementalAreaRelation]" element "value" attribute should be "ElementalArea"
     When I press the "Move" button
-    Then I should see a "Moved block 'Block B' successfully" success toast
-
+    Then I should see a "Moved block 'Block B' successfully" success toast with these actions: Go to edit form for new block parent
     # Check the other page now shows the block
     Given I left click on "Blocks Page2" in the tree
     Then I should see "Block B"
@@ -110,7 +110,43 @@ Feature: Move elements in the CMS
 
     # Move the block and check it has visible moved
     When I press the "Move" button
-    Then I should see a "Moved block 'Lorem' successfully" success toast
+    # We shouldn't see the action, since we're staying on the same record.
+    Then I should see a "Moved block 'Lorem' successfully" success toast with no actions
     Then I should not see "Lorem" in the "#Form_ItemEditForm_ElementalArea1" element
     And I should see "Lorem" in the "#Form_ItemEditForm_ElementalArea2" element
     And I should see "Draft" in the "#Form_ItemEditForm_ElementalArea2 .element-editor__element .element-editor-header__info .badge" element
+
+  Scenario: I can move a block between different non-SiteTree DataObject parents
+    Given I go to "/admin/multi-elemental-behat-test-admin"
+    And I click "Blocks Object1" in the ".ss-gridfield-items" element
+    # Create elemental block first - can't use fixtures which rely on the relation named explicitly "ElementalArea"
+    And I click on the "#Form_ItemEditForm_ElementalArea1 .element-editor__toolbar button" element
+    And I click "Content" in the ".popover-option-set__button-container" element
+    And I click on the caret button for block 1
+    And I fill in "Lorem" for "Title" for block 1
+    And I press the "View actions" button for block 1
+    And I press the "Publish" button
+    Then I should see a "Published 'Lorem' successfully" success toast
+
+    # Open move modal, select the new parent class, and move the block
+    When I press the "View actions" button for block 1
+    And I press the "Move" button
+    And I select "SilverStripe\FrameworkTest\Elemental\Model\ElementalBehatTestObject" from "ParentClass"
+    # we can skip selecting the parent record itself because there's only one, so it's pre-selected
+    When I press the "Move" button
+    # The ElementalBehatTestObject class returns null for getCMSEditLink, so we shouldn't provide a link
+    And I should see a "Moved block 'Lorem' successfully" success toast with no actions
+
+    # Move the block back again
+    Given I go to "/admin/elemental-behat-test-admin"
+    And I click "Blocks Object3" in the ".ss-gridfield-items" element
+    When I click on the caret button for block 1
+    Then the "Title" field for block 1 should contain "Lorem"
+    When I press the "View actions" button for block 1
+    And I press the "Move" button
+    And I select "SilverStripe\FrameworkTest\Elemental\Model\MultiElementalBehatTestObject" from "ParentClass"
+    And I click on the "#Form_ElementForm_3_move_ParentID" element
+    And I click on the ".ss-searchable-dropdown-field__option:nth-of-type(2)" element
+    And I select "ElementalArea2" from "ElementalAreaRelation"
+    And I press the "Move" button
+    And I should see a "Moved block 'Lorem' successfully" success toast with these actions: Go to edit form for new block parent