From 8a64d6cac98a561cdce3da467d825ccea813b524 Mon Sep 17 00:00:00 2001
From: Nathan-SR <144961007+Nathan-SR@users.noreply.github.com>
Date: Thu, 7 Nov 2024 22:01:13 -0500
Subject: fields set properly

---
 .../DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx   | 37 ++++++++++++----------
 1 file changed, 21 insertions(+), 16 deletions(-)

(limited to 'src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx')

diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
index ea38430ca..fe91254f8 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
@@ -56,6 +56,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
     @observable _fullyRenderedDocs: Doc[] = [];
     @observable _renderedDocCollectionPreview: Doc | undefined = undefined;
     @observable _renderedDocCollection: Doc | undefined = undefined;
+    @observable _docsRendering: boolean = false;
 
     @observable _userTemplates: {template: Template, doc: Doc}[] = []; //!!! used to keep track of all templates, should be refactored to work with actual templates and not docs
     @observable _selectedTemplate: Template | undefined = undefined;
@@ -109,21 +110,20 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
         this._dataViz = dataViz;
     };
     @action addUserTemplate = (template: Template) => {
-        this._userTemplates.push({template: template, doc: template.mainField.renderedDoc()});
+        this._userTemplates.push({template: template, doc: template.getRenderedDoc()});
     };
     @action removeUserTemplate = (template: Template) => {
         this._userTemplates = this._userTemplates.filter(info => info.template !== template);
     }
     @action updateTemplatePreview = (template: Template) => {
         template.renderUpdates();
-        const preview = {template: template, doc: template.mainField.renderedDoc()};
-        const doc = template.mainField.renderedDoc();
-        this._suggestedTemplatePreviews.map(t => { return t.template === preview.template ? {doc: doc, template: template} : t }); //prettier-ignore
-        this._userTemplates = this._userTemplates.map(t => { return t.template === preview.template ? {doc: doc, template: template} : t }); //prettier-ignore
+        const preview = {template: template, doc: template.getRenderedDoc()};
+        this._suggestedTemplatePreviews.map(t => { return t.template === preview.template ? preview : t }); //prettier-ignore
+        this._userTemplates = this._userTemplates.map(t => { return t.template === preview.template ? preview : t }); //prettier-ignore
     };
     @action setSuggestedTemplates = (templates: Template[]) => {
         this._suggestedTemplates = templates;
-        this._suggestedTemplatePreviews = templates.map(template => {return {template: template, doc: template.mainField.renderedDoc()}}); //prettier-ignore
+        this._suggestedTemplatePreviews = templates.map(template => {return {template: template, doc: template.getRenderedDoc()}}); //prettier-ignore
     };
 
     @computed get docsToRender() {
@@ -682,6 +682,9 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
     createDocsFromTemplate = async (template: Template) => {
         const dv = this._dataViz;
         if (!dv) return;
+
+        this._docsRendering = true;
+
         const fields: string[] = Array.from(Object.keys(dv.records[0]));  
         const selectedRows = NumListCast(dv.layoutDoc.dataViz_selectedRows);
     
@@ -696,12 +699,9 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
     
         const processContent = async (content: {[title: string]: string}) => {
             const templateCopy = template.cloneBase(); 
-    
-            console.log('rows: ', content, '---------------- fields: ', fields)
 
             fields.filter(title => title).forEach(title => {
                 const field = templateCopy.getFieldByTitle(title);
-                console.log('field: ', field);
                 if (field === undefined) { return };
                 field.setContent(content[title]);
             });
@@ -717,14 +717,15 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
     
             await Promise.all(gptPromises);
     
-            console.log(templateCopy);
-            return templateCopy.mainField.renderedDoc();
+            return templateCopy.getRenderedDoc();
         };
     
         const promises = rowContents.map(content => processContent(content));
     
         const renderedDocs = await Promise.all(promises);
 
+        this._docsRendering = false;
+
         return renderedDocs;
     }
     
@@ -831,7 +832,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
                                                     className="option-button left"
                                                     onPointerDown={e =>
                                                         this.setUpButtonClick(e, () => {
-                                                            this.setExpandedView(template.mainField.renderedDoc());
+                                                            this.setExpandedView(template.getRenderedDoc());
                                                         })
                                                     }>
                                                     <FontAwesomeIcon icon="magnifying-glass" color="white" />
@@ -900,7 +901,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
                                                 className="option-button left"
                                                 onPointerDown={e =>
                                                     this.setUpButtonClick(e, () => {
-                                                        this.setExpandedView(template.mainField.renderedDoc());
+                                                        this.setExpandedView(template.getRenderedDoc());
                                                     })
                                                 }>
                                                 <FontAwesomeIcon icon="magnifying-glass" color="white" />
@@ -1105,7 +1106,11 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
         const doc: Doc | undefined = altLayout ? altLayout.template : this._fullyRenderedDocs[0]; //!!! might cause a slow down
         if (!doc) return;
 
-        return !this._renderedDocCollection? null : (
+        return this._docsRendering ? (
+            <div className="loading-spinner">
+                <ReactLoading type="spin" color={StrCast(Doc.UserDoc().userVariantColor)} height={30} width={30} />
+            </div> 
+            ) : !this._renderedDocCollection? null : (
             <div className="docCreatorMenu-layout-preview-window-wrapper" id={String(id) ?? undefined}>
                 <DocumentView
                     Document={this._renderedDocCollection}
@@ -1131,7 +1136,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
                     hideDecorations={true}
                 />
             </div>
-        );
+        )
     };
 
     get optionsMenuContents() {
@@ -1213,7 +1218,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
                                     clickEv.stopPropagation();
                                     if (!this._selectedTemplate) return;
                                     const layout: DataVizTemplateLayout = {
-                                        template: this._selectedTemplate.mainField.renderedDoc(),
+                                        template: this._selectedTemplate.getRenderedDoc(),
                                         layout: { type: this._layout.type, xMargin: this._layout.xMargin, yMargin: this._layout.yMargin, repeat: 0 },
                                         columns: this.columnsCount,
                                         rows: this.rowsCount,
-- 
cgit v1.2.3-70-g09d2

