From 791ca5ff760aa320c596da0d2cdee16d198aeeb6 Mon Sep 17 00:00:00 2001
From: srichman333 <sarah_n_richman@brown.edu>
Date: Mon, 4 Dec 2023 18:49:31 -0500
Subject: dataviz as schema live updates

---
 src/client/views/nodes/DataVizBox/DataVizBox.tsx | 33 ++++++++++++++++++++++--
 1 file changed, 31 insertions(+), 2 deletions(-)

(limited to 'src/client/views/nodes/DataVizBox')

diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
index 32ed57861..7a2715667 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
@@ -2,7 +2,7 @@ import { Colors, Toggle, ToggleType, Type } from 'browndash-components';
 import { action, computed, observable, ObservableMap, runInAction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
-import { Doc, Field, Opt, StrListCast } from '../../../../fields/Doc';
+import { Doc, DocListCast, Field, Opt, StrListCast } from '../../../../fields/Doc';
 import { List } from '../../../../fields/List';
 import { Cast, CsvCast, DocCast, NumCast, StrCast } from '../../../../fields/Types';
 import { CsvField } from '../../../../fields/URLField';
@@ -30,6 +30,7 @@ import { CollectionFreeFormView } from '../../collections/collectionFreeForm';
 import { ContextMenu } from '../../ContextMenu';
 import { gptImageCall } from '../../../apis/gpt/GPT';
 import { Networking } from '../../../Network';
+import { listSpec } from '../../../../fields/Schema';
 
 export enum DataVizView {
     TABLE = 'table',
@@ -356,9 +357,37 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         }        
     }
 
+    @action
+    updateSchemaViz = () => {
+        if (this.layoutDoc.dataViz_asSchema && DocCast(this.layoutDoc.dataViz_asSchema)){
+  
+        const getFrom = DocCast(this.layoutDoc.dataViz_asSchema)
+        const keys = Cast(getFrom.schema_columnKeys, listSpec('string'))?.filter(key => key!="text");
+        if (!keys) return;
+        const children = DocListCast(getFrom[Doc.LayoutFieldKey(getFrom)]);
+
+        var current: {[key: string]: string}[] = []
+        for (let i=1; i<children.length; i++){
+            var row: {[key:string]: string} = {};
+            if (children[i]){
+                for (let j=0; j<keys.length; j++){
+                    var cell = children[i][keys[j]];
+                    if (cell && cell as string)  cell = cell.toString().replace(/\,/g, '');
+                    row[keys[j]] = StrCast(cell)
+                }
+            }
+            current.push(row)
+        }
+
+        DataVizBox.dataset.set(CsvCast(this.rootDoc[this.fieldKey]).url.href, current )
+    }
+}
+    
+
     render() {
-        const scale = this.props.NativeDimScaling?.() || 1;
+        this.updateSchemaViz();
 
+        const scale = this.props.NativeDimScaling?.() || 1;
         return !this.records.length ? (
             // displays how to get data into the DataVizBox if its empty
             <div className="start-message">To create a DataViz box, either import / drag a CSV file into your canvas or copy a data table and use the command 'ctrl + p' to bring the data table to your canvas.</div>
-- 
cgit v1.2.3-70-g09d2