From 3073fcfc63a9611d24571e5a9d5e95b5883c7018 Mon Sep 17 00:00:00 2001
From: melohagan <101575380+melohagan@users.noreply.github.com>
Date: Thu, 20 Apr 2023 10:36:43 +0100
Subject: [PATCH] Add empty text property to all blocks (#10332)

* Add noRowsMessage for Table

* CardsBlock noRowsMessage setting

* RowExplorer noRowsMessage setting

* Add noRowsMessage setting for FormBlock

* Fix default noRowsMessage
---
 packages/client/manifest.json                 | 35 +++++++++++++++++++
 .../components/app/blocks/CardsBlock.svelte   |  3 +-
 .../components/app/blocks/RowExplorer.svelte  |  4 ++-
 .../components/app/blocks/TableBlock.svelte   |  2 ++
 .../app/blocks/form/FormBlock.svelte          |  3 +-
 .../src/components/app/table/Table.svelte     |  2 ++
 6 files changed, 46 insertions(+), 3 deletions(-)

diff --git a/packages/client/manifest.json b/packages/client/manifest.json
index 42f26661e0..c4408b9202 100644
--- a/packages/client/manifest.json
+++ b/packages/client/manifest.json
@@ -3661,6 +3661,12 @@
         "defaultValue": false,
         "info": "Row selection is only compatible with internal or SQL tables"
       },
+      {
+        "type": "text",
+        "label": "Empty text",
+        "key": "noRowsMessage",
+        "defaultValue": "No rows found"
+      },
       {
         "section": true,
         "name": "On Row Click",
@@ -4375,6 +4381,12 @@
             "key": "filter",
             "nested": true
           },
+          {
+            "type": "text",
+            "label": "Empty text",
+            "key": "noRowsMessage",
+            "defaultValue": "No rows found"
+          },
           {
             "type": "searchfield",
             "label": "Search fields",
@@ -4532,6 +4544,12 @@
         "label": "Paginate",
         "key": "paginate"
       },
+      {
+        "type": "text",
+        "label": "Empty text",
+        "key": "noRowsMessage",
+        "defaultValue": "No rows found"
+      },
       {
         "section": true,
         "name": "Cards",
@@ -4945,6 +4963,17 @@
         ],
         "defaultValue": "spectrum--medium"
       },
+      {
+        "type": "text",
+        "label": "Empty text",
+        "key": "noRowsMessage",
+        "defaultValue": "We couldn't find a row to display",
+        "dependsOn": {
+          "setting": "actionType",
+          "value": "Create",
+          "invert": true
+        }
+      },
       {
         "section": true,
         "name": "Fields",
@@ -5064,6 +5093,12 @@
         "key": "height",
         "defaultValue": "426px"
       },
+      {
+        "type": "text",
+        "label": "Empty text",
+        "key": "noRowsMessage",
+        "defaultValue": "No data"
+      },
       {
         "section": true,
         "name": "Cards",
diff --git a/packages/client/src/components/app/blocks/CardsBlock.svelte b/packages/client/src/components/app/blocks/CardsBlock.svelte
index 3f42375f0b..bbe54867ee 100644
--- a/packages/client/src/components/app/blocks/CardsBlock.svelte
+++ b/packages/client/src/components/app/blocks/CardsBlock.svelte
@@ -29,6 +29,7 @@
   export let cardButtonText
   export let cardButtonOnClick
   export let linkColumn
+  export let noRowsMessage
 
   const { fetchDatasourceSchema } = getContext("sdk")
 
@@ -180,7 +181,7 @@
             hAlign: "stretch",
             vAlign: "top",
             gap: "M",
-            noRowsMessage: "No rows found",
+            noRowsMessage: noRowsMessage || "No rows found",
           }}
           styles={{
             custom: `display: grid;\ngrid-template-columns: repeat(auto-fill, minmax(min(${cardWidth}px, 100%), 1fr));`,
diff --git a/packages/client/src/components/app/blocks/RowExplorer.svelte b/packages/client/src/components/app/blocks/RowExplorer.svelte
index 59e4f8601c..8fadcb5006 100644
--- a/packages/client/src/components/app/blocks/RowExplorer.svelte
+++ b/packages/client/src/components/app/blocks/RowExplorer.svelte
@@ -16,6 +16,8 @@
   export let detailFields
   export let detailTitle
 
+  export let noRowsMessage
+
   const stateKey = generate()
 
   let listDataProviderId
@@ -105,7 +107,7 @@
           dataProvider: `{{ literal ${safe(listDataProviderId)} }}`,
           direction: "column",
           gap: "S",
-          noRowsMessage: "No data",
+          noRowsMessage: noRowsMessage || "No data",
         }}
       >
         <BlockComponent
diff --git a/packages/client/src/components/app/blocks/TableBlock.svelte b/packages/client/src/components/app/blocks/TableBlock.svelte
index 509ad49663..26e44922dd 100644
--- a/packages/client/src/components/app/blocks/TableBlock.svelte
+++ b/packages/client/src/components/app/blocks/TableBlock.svelte
@@ -25,6 +25,7 @@
   export let titleButtonText
   export let titleButtonClickBehaviour
   export let onClickTitleButton
+  export let noRowsMessage
 
   const { fetchDatasourceSchema, API } = getContext("sdk")
   const stateKey = `ID_${generate()}`
@@ -221,6 +222,7 @@
             allowSelectRows,
             size,
             onClick: rowClickActions,
+            noRowsMessage: noRowsMessage || "No rows found",
           }}
         />
       </BlockComponent>
diff --git a/packages/client/src/components/app/blocks/form/FormBlock.svelte b/packages/client/src/components/app/blocks/form/FormBlock.svelte
index 8964475673..a05a7e141c 100644
--- a/packages/client/src/components/app/blocks/form/FormBlock.svelte
+++ b/packages/client/src/components/app/blocks/form/FormBlock.svelte
@@ -16,6 +16,7 @@
   export let showDeleteButton
   export let rowId
   export let actionUrl
+  export let noRowsMessage
 
   const { fetchDatasourceSchema } = getContext("sdk")
 
@@ -89,7 +90,7 @@
         bind:id={repeaterId}
         props={{
           dataProvider,
-          noRowsMessage: "We couldn't find a row to display",
+          noRowsMessage: noRowsMessage || "We couldn't find a row to display",
           direction: "column",
           hAlign: "center",
         }}
diff --git a/packages/client/src/components/app/table/Table.svelte b/packages/client/src/components/app/table/Table.svelte
index 07b64b4107..248151a7a2 100644
--- a/packages/client/src/components/app/table/Table.svelte
+++ b/packages/client/src/components/app/table/Table.svelte
@@ -13,6 +13,7 @@
   export let allowSelectRows
   export let compact
   export let onClick
+  export let noRowsMessage
 
   const component = getContext("component")
   const { styleable, getAction, ActionTypes, rowSelectionStore } =
@@ -144,6 +145,7 @@
     autoSortColumns={!columns?.length}
     on:sort={onSort}
     on:click={handleClick}
+    placeholderText={noRowsMessage || "No rows found"}
   >
     <slot />
   </Table>