From 1ffa8a8fb3e16bd5a3338d18782ddda0c2ffca03 Mon Sep 17 00:00:00 2001 From: bobzel Date: Sun, 16 Mar 2025 21:15:00 -0400 Subject: a lot of code cleanup for doc creators templates --- .../DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx | 89 ++++++++++------------ 1 file changed, 42 insertions(+), 47 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 a702218b0..97faf01c2 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx @@ -27,7 +27,7 @@ import { DocumentView, DocumentViewInternal } from '../../DocumentView'; import { OpenWhere } from '../../OpenWhere'; import { DataVizBox } from '../DataVizBox'; import './DocCreatorMenu.scss'; -import { Field, ViewType } from './FieldTypes/Field'; +import { TemplateField, ViewType } from './TemplateFieldTypes/TemplateField'; import { Template } from './Template'; import { TemplateFieldSize, TemplateFieldType, TemplateLayouts } from './TemplateBackend'; import { TemplateManager } from './TemplateManager'; @@ -371,7 +371,7 @@ export class DocCreatorMenu extends ObservableReactComponent } @action updateRenderedPreviewCollection = async (template: Template) => { - this._fullyRenderedDocs = (await this.createDocsFromTemplate(template)) ?? []; + this._fullyRenderedDocs = ((await this.createDocsFromTemplate(template)) ?? []).filter(doc => doc).map(doc => doc!); console.log(this._fullyRenderedDocs); this.updateRenderedDocCollection(); }; @@ -630,7 +630,7 @@ export class DocCreatorMenu extends ObservableReactComponent await Promise.all(renderedTemplatePromises); } - templates.forEach(template => template.mainField.initializeDocument({ subfields: [], title: template.title, opts: {}, viewType: ViewType.FREEFORM, tl: [0, 0], br: [900, 900] })); + templates.forEach(template => template.mainField.initializeDocument({ title: template.title, opts: {}, viewType: ViewType.FREEFORM, tl: [0, 0], br: [900, 900] }, [])); setTimeout(() => { this.setSuggestedTemplates(templates); @@ -638,10 +638,10 @@ export class DocCreatorMenu extends ObservableReactComponent }); }; - renderGPTImageCall = async (template: Template, col: Col, fieldNumber: number): Promise => { + renderGPTImageCall = async (template: Template, col: Col, fieldNumber: number | undefined): Promise => { const generateAndLoadImage = async (fieldNum: string, column: Col, prompt: string) => { const url = await this.generateGPTImage(prompt); - const field: Field = template.getFieldByID(Number(fieldNum)); + const field: TemplateField = template.getFieldByID(Number(fieldNum)); field.setContent(url ?? '', ViewType.IMG); field.setTitle(col.title); @@ -665,7 +665,7 @@ export class DocCreatorMenu extends ObservableReactComponent return true; }; - renderGPTTextCall = async (template: Template, col: Col, fieldNum: number): Promise => { + renderGPTTextCall = async (template: Template, col: Col, fieldNum: number | undefined): Promise => { const wordLimit = (size: TemplateFieldSize) => { switch (size) { case TemplateFieldSize.TINY: @@ -697,7 +697,7 @@ export class DocCreatorMenu extends ObservableReactComponent if (res) { const assignments: { [title: string]: { number: string; content: string } } = JSON.parse(res); Object.entries(assignments).forEach(([, /* title */ info]) => { - const field: Field = template.getFieldByID(Number(info.number)); + const field: TemplateField = template.getFieldByID(Number(info.number)); // const column = this.getColByTitle(title); field.setContent(info.content ?? '', ViewType.TEXT); @@ -771,7 +771,7 @@ export class DocCreatorMenu extends ObservableReactComponent return templateCopy.mainField.renderedDoc; }; - let docs: Promise[]; + let docs: Promise[]; if (this.DEBUG_MODE) { docs = [1, 2, 3, 4].map(() => processContent({})); } else { @@ -868,30 +868,31 @@ export class DocCreatorMenu extends ObservableReactComponent get templatesPreviewContents() { const GPTOptions =
; - const previewDoc = (doc: Doc, template: Template) => ( - (this._selectedTemplate === template ? 104 : 111)} - PanelHeight={() => (this._selectedTemplate === template ? 104 : 111)} - ScreenToLocalTransform={() => new Transform(-this._pageX - 5, -this._pageY - 35, 1)} - renderDepth={1} - whenChildContentsActiveChanged={emptyFunction} - focus={emptyFunction} - styleProvider={DefaultStyleProvider} - addDocTab={this._props.addDocTab} - pinToPres={() => undefined} - childFilters={returnEmptyFilter} - childFiltersByRanges={returnEmptyFilter} - searchFilterDocs={returnEmptyDoclist} - fitContentsToBox={returnFalse} - fitWidth={returnFalse} - hideDecorations={true} - /> - ); + const previewDoc = (doc: Doc | undefined, template: Template) => + !doc ? null : ( + (this._selectedTemplate === template ? 104 : 111)} + PanelHeight={() => (this._selectedTemplate === template ? 104 : 111)} + ScreenToLocalTransform={() => new Transform(-this._pageX - 5, -this._pageY - 35, 1)} + renderDepth={1} + whenChildContentsActiveChanged={emptyFunction} + focus={emptyFunction} + styleProvider={DefaultStyleProvider} + addDocTab={this._props.addDocTab} + pinToPres={() => undefined} + childFilters={returnEmptyFilter} + childFiltersByRanges={returnEmptyFilter} + searchFilterDocs={returnEmptyDoclist} + fitContentsToBox={returnFalse} + fitWidth={returnFalse} + hideDecorations={true} + /> + ); // @@ -1096,19 +1097,13 @@ export class DocCreatorMenu extends ObservableReactComponent const collectionFactory = (): ((docs: Doc[], options: DocumentOptions) => Doc) => { switch (this._layout.type) { - case LayoutType.CAROUSEL3D: - return Docs.Create.Carousel3DDocument; - case LayoutType.FREEFORM: - return Docs.Create.FreeformDocument; - case LayoutType.CARD: - return Docs.Create.CardDeckDocument; - case LayoutType.MASONRY: - return Docs.Create.MasonryDocument; - case LayoutType.CAROUSEL: - return Docs.Create.CarouselDocument; - default: - return Docs.Create.FreeformDocument; - } + case LayoutType.CAROUSEL3D: return Docs.Create.Carousel3DDocument; + case LayoutType.FREEFORM: return Docs.Create.FreeformDocument; + case LayoutType.CARD: return Docs.Create.CardDeckDocument; + case LayoutType.MASONRY: return Docs.Create.MasonryDocument; + case LayoutType.CAROUSEL: return Docs.Create.CarouselDocument; + default: return Docs.Create.FreeformDocument; + } // prettier-ignore }; const collection = collectionFactory()(this._fullyRenderedDocs, { @@ -1241,9 +1236,9 @@ export class DocCreatorMenu extends ObservableReactComponent emptyFunction, undoable(clickEv => { clickEv.stopPropagation(); - if (!this._selectedTemplate) return; + if (!this._selectedTemplate || !this._selectedTemplate.getRenderedDoc()) return; const layout: DataVizTemplateLayout = { - template: this._selectedTemplate.getRenderedDoc(), + 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