From 86cfd3db2281dbe3db0508fadb03f0a93e84d162 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Wed, 25 Nov 2020 18:43:58 +0000 Subject: [PATCH] Fix charts not correctly using data context --- packages/client/src/components/Component.svelte | 4 ++-- packages/client/src/components/DataProvider.svelte | 4 ++-- packages/standard-components/src/Form.svelte | 6 +++--- packages/standard-components/src/List.svelte | 4 ++-- packages/standard-components/src/charts/BarChart.svelte | 3 ++- .../standard-components/src/charts/CandleStickChart.svelte | 3 ++- packages/standard-components/src/charts/LineChart.svelte | 3 ++- packages/standard-components/src/charts/PieChart.svelte | 3 ++- packages/standard-components/src/grid/Component.svelte | 3 ++- 9 files changed, 19 insertions(+), 14 deletions(-) diff --git a/packages/client/src/components/Component.svelte b/packages/client/src/components/Component.svelte index 30c7ad75b3..1d9308ca26 100644 --- a/packages/client/src/components/Component.svelte +++ b/packages/client/src/components/Component.svelte @@ -9,7 +9,7 @@ export let definition = {} // Get local data binding context - const dataStore = getContext("data") + const dataContext = getContext("data") // Create component context const componentStore = writable({}) @@ -19,7 +19,7 @@ $: constructor = getComponentConstructor(definition._component) $: children = definition._children $: id = definition._id - $: enrichedProps = enrichProps(definition, $dataStore, $bindingStore) + $: enrichedProps = enrichProps(definition, $dataContext, $bindingStore) // Update component context // ID is duplicated inside style so that the "styleable" helper can set diff --git a/packages/client/src/components/DataProvider.svelte b/packages/client/src/components/DataProvider.svelte index f33f01d425..0e926b4973 100644 --- a/packages/client/src/components/DataProvider.svelte +++ b/packages/client/src/components/DataProvider.svelte @@ -5,9 +5,9 @@ export let row // Clone and create new data context for this component tree - const data = getContext("data") + const dataContext = getContext("data") const component = getContext("component") - const newData = createDataStore($data) + const newData = createDataStore($dataContext) setContext("data", newData) $: newData.actions.addContext(row, $component.id) diff --git a/packages/standard-components/src/Form.svelte b/packages/standard-components/src/Form.svelte index 0a64eeb490..03b11307a1 100644 --- a/packages/standard-components/src/Form.svelte +++ b/packages/standard-components/src/Form.svelte @@ -7,7 +7,7 @@ const { styleable, API } = getContext("sdk") const component = getContext("component") - const data = getContext("data") + const dataContext = getContext("data") export let wide = false @@ -16,7 +16,7 @@ let fields = [] // Fetch info about the closest data context - $: getFormData($data[$data.closestComponentId]) + $: getFormData($dataContext[$dataContext.closestComponentId]) const getFormData = async context => { if (context) { @@ -25,7 +25,7 @@ fields = Object.keys(schema) // Use the draft version for editing - row = $data[`${$data.closestComponentId}_draft`] + row = $dataContext[`${$dataContext.closestComponentId}_draft`] } } diff --git a/packages/standard-components/src/List.svelte b/packages/standard-components/src/List.svelte index 226287490f..038269d4bd 100644 --- a/packages/standard-components/src/List.svelte +++ b/packages/standard-components/src/List.svelte @@ -4,7 +4,7 @@ const { API, styleable, DataProvider } = getContext("sdk") const component = getContext("component") - const data = getContext("data") + const dataContext = getContext("data") export let datasource = [] @@ -12,7 +12,7 @@ onMount(async () => { if (!isEmpty(datasource)) { - rows = await API.fetchDatasource(datasource, $data) + rows = await API.fetchDatasource(datasource, $dataContext) } }) diff --git a/packages/standard-components/src/charts/BarChart.svelte b/packages/standard-components/src/charts/BarChart.svelte index 872f7e624d..4bf01b9a21 100644 --- a/packages/standard-components/src/charts/BarChart.svelte +++ b/packages/standard-components/src/charts/BarChart.svelte @@ -5,6 +5,7 @@ import { isEmpty } from "lodash/fp" const { API } = getContext("sdk") + const dataContext = getContext("data") export let title export let datasource @@ -34,7 +35,7 @@ // Fetch, filter and sort data const schema = (await API.fetchTableDefinition(datasource.tableId)).schema - const result = await API.fetchDatasource(datasource) + const result = await API.fetchDatasource(datasource, $dataContext) const reducer = row => (valid, column) => valid && row[column] != null const hasAllColumns = row => allCols.reduce(reducer(row), true) const data = result diff --git a/packages/standard-components/src/charts/CandleStickChart.svelte b/packages/standard-components/src/charts/CandleStickChart.svelte index c5ca0ebd49..341b1d714f 100644 --- a/packages/standard-components/src/charts/CandleStickChart.svelte +++ b/packages/standard-components/src/charts/CandleStickChart.svelte @@ -5,6 +5,7 @@ import { isEmpty } from "lodash/fp" const { API } = getContext("sdk") + const dataContext = getContext("data") export let title export let datasource @@ -32,7 +33,7 @@ // Fetch, filter and sort data const schema = (await API.fetchTableDefinition(datasource.tableId)).schema - const result = await API.fetchDatasource(datasource) + const result = await API.fetchDatasource(datasource, $dataContext) const reducer = row => (valid, column) => valid && row[column] != null const hasAllColumns = row => allCols.reduce(reducer(row), true) const data = result diff --git a/packages/standard-components/src/charts/LineChart.svelte b/packages/standard-components/src/charts/LineChart.svelte index cdfb4f5fbf..6e7f7f65f0 100644 --- a/packages/standard-components/src/charts/LineChart.svelte +++ b/packages/standard-components/src/charts/LineChart.svelte @@ -5,6 +5,7 @@ import { isEmpty } from "lodash/fp" const { API } = getContext("sdk") + const dataContext = getContext("data") // Common props export let title @@ -40,7 +41,7 @@ // Fetch, filter and sort data const schema = (await API.fetchTableDefinition(datasource.tableId)).schema - const result = await API.fetchDatasource(datasource) + const result = await API.fetchDatasource(datasource, $dataContext) const reducer = row => (valid, column) => valid && row[column] != null const hasAllColumns = row => allCols.reduce(reducer(row), true) const data = result diff --git a/packages/standard-components/src/charts/PieChart.svelte b/packages/standard-components/src/charts/PieChart.svelte index 7b8df25b01..9a8db6b17a 100644 --- a/packages/standard-components/src/charts/PieChart.svelte +++ b/packages/standard-components/src/charts/PieChart.svelte @@ -5,6 +5,7 @@ import { isEmpty } from "lodash/fp" const { API } = getContext("sdk") + const dataContext = getContext("data") export let title export let datasource @@ -30,7 +31,7 @@ // Fetch, filter and sort data const schema = (await API.fetchTableDefinition(datasource.tableId)).schema - const result = await API.fetchDatasource(datasource) + const result = await API.fetchDatasource(datasource, $dataContext) const data = result .filter(row => row[labelColumn] != null && row[valueColumn] != null) .slice(0, 20) diff --git a/packages/standard-components/src/grid/Component.svelte b/packages/standard-components/src/grid/Component.svelte index d755b2dbb0..cb259fefb0 100644 --- a/packages/standard-components/src/grid/Component.svelte +++ b/packages/standard-components/src/grid/Component.svelte @@ -16,6 +16,7 @@ const setters = new Map([["number", number]]) const SDK = getContext("sdk") const component = getContext("component") + const dataContext = getContext("data") const { API, styleable } = SDK export let datasource = {} @@ -58,7 +59,7 @@ onMount(async () => { if (!isEmpty(datasource)) { - data = await API.fetchDatasource(datasource) + data = await API.fetchDatasource(datasource, $dataContext) let schema // Get schema for datasource