From 08ba1c8ccd0c2b45085fd60b2aaea5fa60907beb Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Thu, 27 Jul 2023 13:04:09 +0100
Subject: [PATCH 1/4] Added a simple histogram to the supported chart types

---
 .../new/_components/componentStructure.json   |  10 +-
 packages/client/manifest.json                 | 186 ++++++++++++++++++
 .../components/app/blocks/ChartBlock.svelte   |   4 +
 .../app/charts/HistogramChart.svelte          | 136 +++++++++++++
 .../client/src/components/app/charts/index.js |   1 +
 5 files changed, 336 insertions(+), 1 deletion(-)
 create mode 100644 packages/client/src/components/app/charts/HistogramChart.svelte

diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/componentStructure.json b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/componentStructure.json
index de0270f6be..ee0f99a074 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/componentStructure.json
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/componentStructure.json
@@ -75,6 +75,14 @@
   {
     "name": "Chart",
     "icon": "GraphBarVertical",
-    "children": ["bar", "line", "area", "candlestick", "pie", "donut"]
+    "children": [
+      "bar",
+      "line",
+      "area",
+      "candlestick",
+      "pie",
+      "donut",
+      "histogram"
+    ]
   }
 ]
diff --git a/packages/client/manifest.json b/packages/client/manifest.json
index 1e4c443f06..934df9dacb 100644
--- a/packages/client/manifest.json
+++ b/packages/client/manifest.json
@@ -2212,6 +2212,147 @@
       }
     ]
   },
+  "histogram": {
+    "name": "Histogram Chart",
+    "description": "Histogram chart",
+    "icon": "Histogram",
+    "size": {
+      "width": 600,
+      "height": 400
+    },
+    "requiredAncestors": ["dataprovider"],
+    "settings": [
+      {
+        "type": "text",
+        "label": "Title",
+        "key": "title"
+      },
+      {
+        "type": "dataProvider",
+        "label": "Provider",
+        "key": "dataProvider",
+        "required": true
+      },
+      {
+        "type": "field",
+        "label": "Data column",
+        "key": "valueColumn",
+        "dependsOn": "dataProvider",
+        "required": true
+      },
+      {
+        "type": "text",
+        "label": "Y axis label",
+        "key": "yAxisLabel",
+        "defaultValue": "Frequency"
+      },
+      {
+        "type": "text",
+        "label": "X axis label",
+        "key": "xAxisLabel"
+      },
+      {
+        "type": "number",
+        "label": "Bucket count",
+        "key": "bucketCount",
+        "defaultValue": 10,
+        "min": 2
+      },
+      {
+        "type": "boolean",
+        "label": "Data labels",
+        "key": "dataLabels",
+        "defaultValue": false
+      },
+      {
+        "type": "text",
+        "label": "Width",
+        "key": "width"
+      },
+      {
+        "type": "text",
+        "label": "Height",
+        "key": "height",
+        "defaultValue": "400"
+      },
+      {
+        "type": "select",
+        "label": "Colors",
+        "key": "palette",
+        "defaultValue": "Palette 1",
+        "options": [
+          "Custom",
+          "Palette 1",
+          "Palette 2",
+          "Palette 3",
+          "Palette 4",
+          "Palette 5",
+          "Palette 6",
+          "Palette 7",
+          "Palette 8",
+          "Palette 9",
+          "Palette 10"
+        ]
+      },
+      {
+        "type": "color",
+        "label": "C1",
+        "key": "c1",
+        "dependsOn": {
+          "setting": "palette",
+          "value": "Custom"
+        }
+      },
+      {
+        "type": "color",
+        "label": "C2",
+        "key": "c2",
+        "dependsOn": {
+          "setting": "palette",
+          "value": "Custom"
+        }
+      },
+      {
+        "type": "color",
+        "label": "C3",
+        "key": "c3",
+        "dependsOn": {
+          "setting": "palette",
+          "value": "Custom"
+        }
+      },
+      {
+        "type": "color",
+        "label": "C4",
+        "key": "c4",
+        "dependsOn": {
+          "setting": "palette",
+          "value": "Custom"
+        }
+      },
+      {
+        "type": "color",
+        "label": "C5",
+        "key": "c5",
+        "dependsOn": {
+          "setting": "palette",
+          "value": "Custom"
+        }
+      },
+      {
+        "type": "boolean",
+        "label": "Animate",
+        "key": "animate",
+        "defaultValue": true
+      },
+      {
+        "type": "boolean",
+        "label": "Horizontal",
+        "key": "horizontal",
+        "defaultValue": false
+      }
+    ]
+  },
   "form": {
     "name": "Form",
     "icon": "Form",
@@ -3965,6 +4106,10 @@
             "label": "Bar",
             "value": "bar"
           },
+          {
+            "label": "Histogram",
+            "value": "histogram"
+          },
           {
             "label": "Line",
             "value": "line"
@@ -4215,6 +4360,47 @@
           }
         ]
       },
+      {
+        "section": true,
+        "name": "Histogram Chart",
+        "icon": "Histogram",
+        "dependsOn": {
+          "setting": "chartType",
+          "value": "histogram"
+        },
+        "settings": [
+          {
+            "type": "field",
+            "label": "Value column",
+            "key": "valueColumn",
+            "dependsOn": "dataSource",
+            "required": true
+          },
+          {
+            "type": "text",
+            "label": "Y axis label",
+            "key": "yAxisLabel"
+          },
+          {
+            "type": "text",
+            "label": "X axis label",
+            "key": "xAxisLabel"
+          },
+          {
+            "type": "boolean",
+            "label": "Horizontal",
+            "key": "horizontal",
+            "defaultValue": false
+          },
+          {
+            "type": "number",
+            "label": "Bucket count",
+            "key": "bucketCount",
+            "defaultValue": 10,
+            "min": 2
+          }
+        ]
+      },
       {
         "section": true,
         "name": "Line Chart",
diff --git a/packages/client/src/components/app/blocks/ChartBlock.svelte b/packages/client/src/components/app/blocks/ChartBlock.svelte
index 92151ad9c0..1bbc69ce63 100644
--- a/packages/client/src/components/app/blocks/ChartBlock.svelte
+++ b/packages/client/src/components/app/blocks/ChartBlock.svelte
@@ -46,6 +46,9 @@
   export let lowColumn
   export let dateColumn
 
+  // Histogram
+  export let bucketCount
+
   let dataProviderId
 
   $: colors = c1 && c2 && c3 && c4 && c5 ? [c1, c2, c3, c4, c5] : null
@@ -92,6 +95,7 @@
           highColumn,
           lowColumn,
           dateColumn,
+          bucketCount,
         }}
       />
     {/if}
diff --git a/packages/client/src/components/app/charts/HistogramChart.svelte b/packages/client/src/components/app/charts/HistogramChart.svelte
new file mode 100644
index 0000000000..26b9028550
--- /dev/null
+++ b/packages/client/src/components/app/charts/HistogramChart.svelte
@@ -0,0 +1,136 @@
+<script>
+  import { ApexOptionsBuilder } from "./ApexOptionsBuilder"
+  import ApexChart from "./ApexChart.svelte"
+
+  export let title
+  export let dataProvider
+  export let valueColumn
+  export let xAxisLabel
+  export let yAxisLabel
+  export let height
+  export let width
+  export let dataLabels
+  export let animate
+  export let palette
+  export let c1, c2, c3, c4, c5
+  export let horizontal
+  export let bucketCount = 10
+
+  $: options = setUpChart(
+    title,
+    dataProvider,
+    valueColumn,
+    xAxisLabel || valueColumn,
+    yAxisLabel,
+    height,
+    width,
+    dataLabels,
+    animate,
+    palette,
+    horizontal,
+    c1 && c2 && c3 && c4 && c5 ? [c1, c2, c3, c4, c5] : null,
+    customColor,
+    bucketCount
+  )
+
+  $: customColor = palette === "Custom"
+
+  const setUpChart = (
+    title,
+    dataProvider,
+    valueColumn,
+    xAxisLabel, //freqAxisLabel
+    yAxisLabel, //valueAxisLabel
+    height,
+    width,
+    dataLabels,
+    animate,
+    palette,
+    horizontal,
+    colors,
+    customColor,
+    bucketCount
+  ) => {
+    const allCols = [valueColumn]
+    if (
+      !dataProvider ||
+      !dataProvider.rows?.length ||
+      allCols.find(x => x == null)
+    ) {
+      return null
+    }
+
+    // Fetch data
+    const { schema, rows } = dataProvider
+    const reducer = row => (valid, column) => valid && row[column] != null
+    const hasAllColumns = row => allCols.reduce(reducer(row), true)
+    const data = rows.filter(row => hasAllColumns(row)).slice(0, 100)
+    if (!schema || !data.length) {
+      return null
+    }
+
+    // Initialise default chart
+    let builder = new ApexOptionsBuilder()
+      .type("bar")
+      .title(title)
+      .width(width)
+      .height(height)
+      .xLabel(horizontal ? yAxisLabel : xAxisLabel)
+      .yLabel(horizontal ? xAxisLabel : yAxisLabel)
+      .dataLabels(dataLabels)
+      .animate(animate)
+      .palette(palette)
+      .horizontal(horizontal)
+      .colors(customColor ? colors : null)
+
+    if (horizontal) {
+      builder = builder.setOption(["plotOptions", "bar", "barHeight"], "90%")
+    } else {
+      builder = builder.setOption(["plotOptions", "bar", "columnWidth"], "99%")
+    }
+
+    // Pull occurences of the value.
+    let flatlist = data.map(row => {
+      return row[valueColumn]
+    })
+
+    // Build range buckets
+    let interval = Math.max(...flatlist) / bucketCount
+    let counts = Array(bucketCount).fill(0)
+
+    // Assign row data to a bucket
+    let buckets = flatlist.reduce((acc, val) => {
+      let dest = Math.min(Math.floor(val / interval), bucketCount - 1)
+      acc[dest] = acc[dest] + 1
+      return acc
+    }, counts)
+
+    const rangeLabel = bucketIdx => {
+      return `${Math.floor(interval * bucketIdx)} - ${Math.floor(
+        interval * (bucketIdx + 1)
+      )}`
+    }
+
+    const series = [
+      {
+        name: yAxisLabel,
+        data: Array.from({ length: buckets.length }, (_, i) => ({
+          x: rangeLabel(i),
+          y: buckets[i],
+        })),
+      },
+    ]
+
+    builder = builder.setOption(["xaxis", "labels"], {
+      formatter: x => {
+        return x + ""
+      },
+    })
+
+    builder = builder.series(series)
+
+    return builder.getOptions()
+  }
+</script>
+
+<ApexChart {options} />
diff --git a/packages/client/src/components/app/charts/index.js b/packages/client/src/components/app/charts/index.js
index b1fea9ef0d..e428b4eecf 100644
--- a/packages/client/src/components/app/charts/index.js
+++ b/packages/client/src/components/app/charts/index.js
@@ -4,3 +4,4 @@ export { default as pie } from "./PieChart.svelte"
 export { default as donut } from "./DonutChart.svelte"
 export { default as area } from "./AreaChart.svelte"
 export { default as candlestick } from "./CandleStickChart.svelte"
+export { default as histogram } from "./HistogramChart.svelte"

From 45c35c5c452fd36c7bb89494ed6e1bf8cc75b3d1 Mon Sep 17 00:00:00 2001
From: Budibase Staging Release Bot <>
Date: Mon, 31 Jul 2023 09:56:30 +0000
Subject: [PATCH 2/4] Bump version to 2.8.29-alpha.4

---
 lerna.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lerna.json b/lerna.json
index fb1b966db4..54141fa843 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
 {
-  "version": "2.8.29-alpha.3",
+  "version": "2.8.29-alpha.4",
   "npmClient": "yarn",
   "packages": [
     "packages/*"

From c0c5a57a993d0a9ece3616d4be0dd7e38bf6669e Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Mon, 31 Jul 2023 11:50:42 +0100
Subject: [PATCH 3/4] Supress notification from form block delete row action if
 configured

---
 packages/client/manifest.json                               | 6 +-----
 .../src/components/app/blocks/form/InnerFormBlock.svelte    | 1 +
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/packages/client/manifest.json b/packages/client/manifest.json
index 934df9dacb..b6a231917c 100644
--- a/packages/client/manifest.json
+++ b/packages/client/manifest.json
@@ -5420,11 +5420,7 @@
             "type": "boolean",
             "label": "Hide notifications",
             "key": "notificationOverride",
-            "defaultValue": false,
-            "dependsOn": {
-              "setting": "showSaveButton",
-              "value": true
-            }
+            "defaultValue": false
           }
         ]
       }
diff --git a/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte b/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte
index 5e4a156949..c638d58737 100644
--- a/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte
+++ b/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte
@@ -83,6 +83,7 @@
         tableId: dataSource?.tableId,
         rowId: `{{ ${safe(repeaterId)}.${safe("_id")} }}`,
         revId: `{{ ${safe(repeaterId)}.${safe("_rev")} }}`,
+        notificationOverride,
       },
     },
     {

From 9314a85220c9d309f860826550d6a6e8b25f257f Mon Sep 17 00:00:00 2001
From: Budibase Staging Release Bot <>
Date: Mon, 31 Jul 2023 10:51:05 +0000
Subject: [PATCH 4/4] Bump version to 2.8.29-alpha.5

---
 lerna.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lerna.json b/lerna.json
index 54141fa843..ea9e35877b 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
 {
-  "version": "2.8.29-alpha.4",
+  "version": "2.8.29-alpha.5",
   "npmClient": "yarn",
   "packages": [
     "packages/*"