Added ability to hide the footer on the modal

OrtooApps · Dec 14, 2021 · 9c285b0 · 9c285b0
1 parent 521a494
commit 9c285b0
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 3 deletions.
diff --git a/framework/default/ortoo-core/default/lwc/modal/__tests__/modal.test.js b/framework/default/ortoo-core/default/lwc/modal/__tests__/modal.test.js
@@ -9,8 +9,6 @@ describe('c-modal', () => {
         }
     });
 
-    // TODO: test the cancel event
-
     it( 'Component is set to visible, the title, contents and footer slots are shown', () => {
         const element = createElement('c-modal', {
             is: Modal
@@ -64,6 +62,25 @@ describe('c-modal', () => {
         expect( footerDiv ).toBe( null );
     });
 
+    it( 'Component is set to visible, and hideFooter is true, the title, contents are show, but the footer slot is not', () => {
+        const element = createElement('c-modal', {
+            is: Modal
+        });
+        element.visible = true;
+        element.hideFooter = true;
+
+        document.body.appendChild( element );
+
+        const titleDiv = element.shadowRoot.querySelector( 'slot[name="title"]' );
+        expect( titleDiv ).not.toBe( null );
+
+        const contentsDiv = element.shadowRoot.querySelector( 'slot[name="contents"]' );
+        expect( contentsDiv ).not.toBe( null );
+
+        const footerDiv = element.shadowRoot.querySelector( 'slot[name="footer"]' );
+        expect( footerDiv ).toBe( null );
+    });
+
     it( 'Will issue a cancel event when "escape" is pressed', () => {
 
         const element = createElement('c-modal', {

diff --git a/framework/default/ortoo-core/default/lwc/modal/modal.html b/framework/default/ortoo-core/default/lwc/modal/modal.html
@@ -35,7 +35,7 @@ <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">
                         <slot name="contents"></slot>
                     </div>
 
-                    <footer class="slds-modal__footer">
+                    <footer class="slds-modal__footer" if:false={hideFooter}>
                         <div class="slds-align_absolute-center">
                             <slot name="footer"></slot>
                         </div>

diff --git a/framework/default/ortoo-core/default/lwc/modal/modal.js b/framework/default/ortoo-core/default/lwc/modal/modal.js
@@ -3,6 +3,7 @@ import CLOSE_LABEL from '@salesforce/label/c.ortoo_core_close';
 
 export default class Modal extends LightningElement {
     @api visible;
+    @api hideFooter = false;
 
     labels = {
         close: CLOSE_LABEL