From 103bfdfac1ba3a74e122a0886dc404bf84685b6b Mon Sep 17 00:00:00 2001
From: Robert Baillie <robert.baillie@ortooapps.com>
Date: Tue, 25 Jan 2022 13:37:43 +0000
Subject: [PATCH] Enhancements to the filter and results

Added ability to disable the search button
Split slots for the action buttons - not supposed to have 2 slots with the same name
Added ability to specify a search type - for future expansion
---
 .../__tests__/filterAndResults.test.js        | 27 ++++++++++++++++++-
 .../filterAndResults/filterAndResults.html    |  5 ++--
 .../lwc/filterAndResults/filterAndResults.js  |  4 +++
 3 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/framework/default/ortoo-core/default/lwc/filterAndResults/__tests__/filterAndResults.test.js b/framework/default/ortoo-core/default/lwc/filterAndResults/__tests__/filterAndResults.test.js
index 201063ae3f6..bb7a2a11e7e 100644
--- a/framework/default/ortoo-core/default/lwc/filterAndResults/__tests__/filterAndResults.test.js
+++ b/framework/default/ortoo-core/default/lwc/filterAndResults/__tests__/filterAndResults.test.js
@@ -33,7 +33,8 @@ describe( 'c-filter-and-results', () => {
         .then( () => {
             expect( element.shadowRoot.querySelector( 'slot[name="info"]' ) ).not.toBeNull();
             expect( element.shadowRoot.querySelector( 'slot[name="form"]' ) ).not.toBeNull();
-            expect( element.shadowRoot.querySelector( 'slot[name="action-buttons"]' ) ).not.toBeNull();
+            expect( element.shadowRoot.querySelector( 'slot[name="action-buttons-top"]' ) ).not.toBeNull();
+            expect( element.shadowRoot.querySelector( 'slot[name="action-buttons-bottom"]' ) ).not.toBeNull();
             expect( element.shadowRoot.querySelector( 'slot[name="data"]' ) ).not.toBeNull();
         })
     });
@@ -62,6 +63,30 @@ describe( 'c-filter-and-results', () => {
         })
     });
 
+    it( 'when disableSearchButton is set to true, will disable the search button', () => {
+
+        const element = document.body.querySelector( 'c-filter-and-result' );
+
+        element.disableSearchButton = true;
+
+        return Promise.resolve()
+        .then( () => {
+            expect( element.shadowRoot.querySelector( SEARCH_BUTTON_SELECTOR ).disabled ).toBe( true );
+        });
+    });
+
+    it( 'when disableSearchButton is set to false, will enable the search button', () => {
+
+        const element = document.body.querySelector( 'c-filter-and-result' );
+
+        element.disableSearchButton = false;
+
+        return Promise.resolve()
+        .then( () => {
+            expect( element.shadowRoot.querySelector( SEARCH_BUTTON_SELECTOR ).disabled ).toBe( false );
+        });
+    });
+
     it( 'when showPaginationControls flag is set to true will show pagination controls above and below the data', () => {
 
         const element = document.body.querySelector( 'c-filter-and-result' );
diff --git a/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.html b/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.html
index 4076ef9de05..8d970fa078d 100644
--- a/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.html
+++ b/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.html
@@ -25,6 +25,7 @@
                             variant="brand"
                             label={labels.searchButton}
                             title={labels.searchButtonTitle}
+                            disabled={disableSearchButton}
                             onclick={handleSearchClicked}
                         ></lightning-button>
 
@@ -40,7 +41,7 @@
                 <lightning-layout class="slds-p-bottom_small">
 
                     <lightning-layout-item>
-                        <slot name="action-buttons"></slot>
+                        <slot name="action-buttons-top"></slot>
                     </lightning-layout-item>
 
                     <lightning-layout-item flexibility="grow"></lightning-layout-item>
@@ -63,7 +64,7 @@
                 <lightning-layout class="slds-p-top_small">
 
                     <lightning-layout-item>
-                        <slot name="action-buttons"></slot>
+                        <slot name="action-buttons-bottom"></slot>
                     </lightning-layout-item>
 
                     <lightning-layout-item flexibility="grow"></lightning-layout-item>
diff --git a/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.js b/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.js
index 3d8d1c7c545..8b0ee997680 100644
--- a/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.js
+++ b/framework/default/ortoo-core/default/lwc/filterAndResults/filterAndResults.js
@@ -24,11 +24,15 @@ export default class FilterAndResults extends LightningElement {
 
     @api title;
     @api loading;
+    @api disableSearchButton;
     @api showPaginationControls;
     @api numberOfRecords;
     @api offset;
     @api recordsWindowSize;
 
+    @api searchType;
+
+
     connectedCallback() {
         configureElementIdGenerator( this );
     }