dashbord updates properly

2 files changed, 30 insertions, 16 deletions

diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
index eaf5c1758..cef7f62b1 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
@@ -64,6 +64,7 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     @observable _savedAnnotations = new ObservableMap<number, HTMLDivElement[]>();
     @observable _specialHighlightedRow: number | undefined = undefined;
     @observable GPTSummary: ObservableMap<string, string> | undefined = undefined;
+    @observable colDescriptions: ObservableMap<string, string> = new ObservableMap();
     @observable fieldTypes: ObservableMap<string, string> = new ObservableMap();
     @observable _GPTLoading: boolean = false;
 
@@ -150,12 +151,20 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         this.fieldTypes?.set(field, type);
     }
 
+    @action setFieldDesc = (field: string, desc: string) => {
+        if (!desc) { 
+            this.colDescriptions.set(field, this.GPTSummary?.get(field) ?? '');
+        } else {
+            this.colDescriptions.set(field, desc);
+        }
+    }
+
     getFieldType = (field: string): string => {
         return this.fieldTypes?.get(field) ?? '';
     }
 
     getFieldDescription = (field: string): string => {
-        return this.GPTSummary?.get(field) ?? '';
+        return this.colDescriptions?.get(field) ?? '';
     }
 
     @action // pinned / linked anchor doc includes selected rows, graph titles, and graph colors
@@ -533,9 +542,9 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                 const descs: {[col: string]: string} = JSON.parse(res);
                 for (const [key, val] of Object.entries(descs)) {
                     this.GPTSummary.set(key, val);
+                    if (!this.colDescriptions.get(key)) this.colDescriptions.set(key, val);
                 }
 
-                console.log(res, descs);
             }
         } catch (err) {
             console.error(err);
@@ -549,7 +558,6 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             const colTitles: string[] = Object.keys(this.records[0]);
             for (let i = 0; i < colTitles.length; ++i){
                 if (colTitles[i] === title) {
-                    console.log(true); 
                     return true;
                 }
             }
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
index 50d6b7fe0..7df445b88 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
@@ -49,8 +49,8 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
 
     @observable _templateDocs: Doc[] = [];
     @observable _selectedTemplate: Doc | undefined = undefined;
-    @observable _fields: {title: string, type: string, id: number}[] = [];
-    @observable _selectedCols: {title: string, type: string, id: number}[] | undefined = [];
+    @observable _fields: {title: string, type: string, desc: string}[] = [];
+    @observable _selectedCols: {title: string, type: string, desc: string}[] | undefined = [];
 
     @observable _layout: {type: LayoutType, yMargin: number, xMargin: number, columns?: number, repeat: number} = {type: LayoutType.Grid, yMargin: 0, xMargin: 0, repeat: 0};
     @observable _layoutPreview: boolean = true;
@@ -133,8 +133,8 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
         return StrListCast(this._dataViz?.layoutDoc._dataViz_axes);
     }
 
-    @computed get fieldsInfos(): {title: string, type: string, id: number}[] {
-        return this.selectedFields.map(field => {return {title: field, type: this._dataViz?.getFieldType(field) ?? '', id: Math.random() * 100000}}).concat(this._fields);
+    @computed get fieldsInfos(): {title: string, type: string, desc: string}[] {
+        return this.selectedFields.map(field => {return {title: field, type: this._dataViz?.getFieldType(field) ?? '', desc: this._dataViz?.getFieldDescription(field) ?? ''}}).concat(this._fields);
     }
 
     @computed get canMakeDocs(){
@@ -197,7 +197,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
         this._disposers.gpt = reaction(() => this._GPTTemplates.slice(), (docs) => docs.map(this.getIcon));
         //this._disposers.columns = reaction(() => this._dataViz?.layoutDoc._dataViz_axes, () => {this.generateTemplates('')})
         this._disposers.lightbox = reaction(() => LightboxView.LightboxDoc(), doc => { doc ? this._shouldDisplay && this.closeMenu() : !this._shouldDisplay && this.openMenu()});
-        this._disposers.fields = reaction(() => this._dataViz?.axes, cols => this._selectedCols = cols?.map(col => { return {title: col, type: '', id: Math.random() * 100000}}))
+        //this._disposers.fields = reaction(() => this._dataViz?.axes, cols => this._selectedCols = cols?.map(col => { return {title: col, type: '', desc: ''}}))
     }
 
     componentWillUnmount() {
@@ -346,7 +346,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
         let prompt: string = `(#${origCount}) Please generate for the fields:`;
         this.selectedFields?.forEach(field => prompt += ` ${field},`)
         prompt += ` (-----NOT A FIELD-----) Additional prompt: ${inputText}`;
-        console.log(prompt)
 
         this._GPTLoading = true;
 
@@ -375,7 +374,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
                 const right: number = Number(field.brx) * tempWidth / 2;   const bottom: number = Number(field.bry) * tempHeight / 2; //prettier-ignore
                 const height = bottom - top; 
                 const width = right - left; 
-                console.log(field.title);
                 const doc = !field.title.includes('$$') ? Docs.Create.TextDocument('', { _height: height, _width: width, title: field.title, x: left, y: top, _text_fontSize: `${height/2}` }) : Docs.Create.ImageDocument('', { _height: height, _width: width, title: field.title.replace(/\$\$/g, ''), x: left, y: top });
                 return doc;
             });
@@ -421,7 +419,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
         // const mainCollection = this._dataViz?.DocumentView?.().containerViewPath?.().lastElement()?.ComponentView as CollectionFreeFormView;
         // mainCollection.addDocument(doc);
         //this._dataViz?.getRandomSample();
-        console.log(this._dataViz?.GPTSummary?.get('IMG'))
     }
 
     get templatesPreviewContents(){
@@ -768,15 +765,15 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
     }
 
     @action addField = () => {
-        const newFields: {title: string, type: string, id: number}[] = this._fields.concat([{title: '', type: '', id: Math.random() * 100000}])
+        const newFields: {title: string, type: string, desc: string}[] = this._fields.concat([{title: '', type: '', desc: ''}])
         this._fields = newFields;
     }
 
-    @action removeField = (field: {title: string, type: string, id: number}) => {
+    @action removeField = (field: {title: string, type: string, desc: string}) => {
         if (this._dataViz?.axes.includes(field.title)) {
             this._dataViz.selectAxes(this._dataViz.axes.filter(col => col !== field.title));
         } else {
-            const toRemove = this._fields.filter(f => f.id === field.id);
+            const toRemove = this._fields.filter(f => f === field);
             if (!toRemove) return;
 
             if (toRemove.length > 1) {
@@ -795,7 +792,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
         }   
     }
 
-    setFieldType = (field: {title: string, type: string, id: number}, type: string) => {
+    setFieldType = (field: {title: string, type: string, desc: string}, type: string) => {
         if (this.selectedFields.includes(field.title)) {
             this._dataViz?.setFieldType(field.title, type);
         } else {
@@ -804,6 +801,15 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
         this.forceUpdate();
     }
 
+    setFieldDesc = (field: {title: string, type: string, desc: string}, desc: string) => {
+        if (this.selectedFields.includes(field.title)) {
+            this._dataViz?.setFieldDesc(field.title, desc);
+        } else {
+            field.desc = desc;
+        }
+        this.forceUpdate();
+    }
+
     get dashboardContents(){
         return (
         <div className='docCreatorMenu-dashboard-view'>
@@ -827,7 +833,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps & Co
                             </div>
                         </div>
                     </div>
-                    <textarea className='field-description-container' placeholder={this._dataViz?.GPTSummary?.get(field.title) ?? 'Add a description to help with template generation.'} /> 
+                    <textarea className='field-description-container' onChange={(e) => this._dataViz?.setFieldDesc(field.title, e.target.value)} defaultValue={field.desc === this._dataViz?.GPTSummary?.get(field.title) ? '' : field.desc } placeholder={this._dataViz?.GPTSummary?.get(field.title) ?? 'Add a description to help with template generation.'} /> 
                     <div>
                         <button className='docCreatorMenu-menu-button section-reveal-options top-right' onPointerDown={e => this.setUpButtonClick(e, () => this.removeField(field))}>
                             <FontAwesomeIcon icon='trash'/>