Added additional edit buttons back into the view and edit form

Added additional buttons into the save buttons
OrtooApps · Jan 11, 2022 · 19322de · 19322de
1 parent 2d8ddc3
commit 19322de
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 2 deletions.
diff --git a/framework/default/ortoo-core/default/lwc/saveButtons/__tests__/saveButtons.test.js b/framework/default/ortoo-core/default/lwc/saveButtons/__tests__/saveButtons.test.js
@@ -55,6 +55,21 @@ describe('c-save-buttons', () => {
             });
     });
 
+    it( 'Has an additional-buttons slot', () => {
+
+        const element = createElement('c-save-buttons', {
+            is: SaveButtons
+        });
+
+        document.body.appendChild( element );
+
+        return Promise.resolve()
+            .then( () => {
+                const additionalButtonsSlot = element.shadowRoot.querySelector( 'slot[name="additional-buttons"]');
+                expect( additionalButtonsSlot ).not.toBeNull();
+            });
+    })
+
     it( 'Will use the passed prefix to define the element ids', () => {
 
         const element = createElement('c-modal', {

diff --git a/framework/default/ortoo-core/default/lwc/saveButtons/saveButtons.html b/framework/default/ortoo-core/default/lwc/saveButtons/saveButtons.html
@@ -1,6 +1,7 @@
 <template>
 
     <lightning-button
+        class="slds-p-around_xxx-small"
         data-ortoo-elem-id={cancelButtonId}
         variant="default"
         name="cancel"
@@ -9,7 +10,10 @@
         onclick={handleCancelClick}
     ></lightning-button>
 
+    <slot name="additional-buttons"></slot>
+
     <lightning-button
+        class="slds-p-around_xxx-small"
         data-ortoo-elem-id={saveButtonId}
         variant="brand"
         name="save"

diff --git a/framework/default/ortoo-core/default/lwc/viewAndEditForm/__tests__/viewAndEditForm.test.js b/framework/default/ortoo-core/default/lwc/viewAndEditForm/__tests__/viewAndEditForm.test.js
@@ -25,6 +25,9 @@ describe('c-view-and-edit-form', () => {
 
         const additionalViewButtons = element.shadowRoot.querySelector( 'slot[name="additional-view-buttons"' );
         expect( additionalViewButtons ).toBe( null );
+
+        const additionalEditButtons = element.shadowRoot.querySelector( 'slot[name="additional-edit-buttons"' );
+        expect( additionalEditButtons ).not.toBe( null );
     });
 
     it('When visible card and not inEditMode, has an edit button, but no  save or cancel', () => {
@@ -43,6 +46,9 @@ describe('c-view-and-edit-form', () => {
 
         const additionalViewButtons = element.shadowRoot.querySelector( 'slot[name="additional-view-buttons"' );
         expect( additionalViewButtons ).not.toBe( null );
+
+        const additionalEditButtons = element.shadowRoot.querySelector( 'slot[name="additional-edit-buttons"' );
+        expect( additionalEditButtons ).toBe( null );
     });
 
     it('When visible card and inEditMode, has an editForm slot but no viewForm slot', () => {
@@ -155,6 +161,9 @@ describe('c-view-and-edit-form', () => {
 
         const additionalViewButtons = element.shadowRoot.querySelector( 'slot[name="additional-view-buttons"' );
         expect( additionalViewButtons ).toBe( null );
+
+        const additionalEditButtons = element.shadowRoot.querySelector( 'slot[name="additional-edit-buttons"' );
+        expect( additionalEditButtons ).not.toBe( null );
     });
 
     it('When visible modal and not inEditMode, has an edit button, but no save or cancel', () => {
@@ -174,6 +183,9 @@ describe('c-view-and-edit-form', () => {
 
         const additionalViewButtons = element.shadowRoot.querySelector( 'slot[name="additional-view-buttons"' );
         expect( additionalViewButtons ).not.toBe( null );
+
+        const additionalEditButtons = element.shadowRoot.querySelector( 'slot[name="additional-edit-buttons"' );
+        expect( additionalEditButtons ).toBe( null );
     });
 
     it('When visible modal and inEditMode, has an editForm slot but no viewForm slot', () => {

diff --git a/framework/default/ortoo-core/default/lwc/viewAndEditForm/viewAndEditForm-card.html b/framework/default/ortoo-core/default/lwc/viewAndEditForm/viewAndEditForm-card.html
@@ -43,7 +43,11 @@
                 <c-save-buttons
                     onsave={handleSaveClick}
                     oncancel={handleCancelClick}
-                ></c-save-buttons>
+                >
+                    <span slot="additional-buttons">
+                        <slot name="additional-edit-buttons"></slot>
+                    </span>
+                </c-save-buttons>
 
             </div>
         </lightning-card>

diff --git a/framework/default/ortoo-core/default/lwc/viewAndEditForm/viewAndEditForm-modal.html b/framework/default/ortoo-core/default/lwc/viewAndEditForm/viewAndEditForm-modal.html
@@ -40,7 +40,11 @@
             <c-save-buttons
                 onsave={handleSaveClick}
                 oncancel={handleCancelClick}
-             ></c-save-buttons>
+            >
+                <span slot="additional-buttons">
+                    <slot name="additional-edit-buttons"></slot>
+                </span>
+            </c-save-buttons>
 
         </div>