diff options
author | Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> | 2024-10-29 21:45:37 -0400 |
---|---|---|
committer | Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> | 2024-10-29 21:45:37 -0400 |
commit | de18eecdbd0ac99cdc78aef2dd477e341c28df76 (patch) | |
tree | 3fc587809f77831a7fbd03ad99d72176a3cdbce7 /src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx | |
parent | 66fcb190ad52aa7e5fc7e0055fed392a569c1972 (diff) |
content is being filled into fields properly
Diffstat (limited to 'src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx')
-rw-r--r-- | src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx | 108 |
1 files changed, 44 insertions, 64 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx index a1de81fa3..405b32e8a 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx @@ -104,7 +104,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { makeObservable(this); DocCreatorMenu.Instance = this; this.templateManager = new TemplateManager(TemplateLayouts.allTemplates); - //setTimeout(() => this.generateTemplates('')); } @action setDataViz = (dataViz: DataVizBox) => { @@ -264,7 +263,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { } updateIcons = (docs: Doc[]) => { - console.log('called') docs.map(this.getIcon); }; @@ -593,34 +591,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { } }; - const renderTextCalls = async (): Promise<Doc[]> => { - const rendered: Doc[] = []; - - if (GPTTextCalls.length) { - try { - const prompt = fieldContent + GPTTextAssignment; - - const res = await gptAPICall(prompt, GPTCallType.FILL); - - if (res) { - const assignments: { [title: string]: { number: string; content: string } } = JSON.parse(res); - //console.log('assignments', GPTAssignments, 'assignment string', GPTAssignmentString, 'field content', fieldContent, 'response', res, 'assignments', assignments); - Object.entries(assignments).forEach(([title, info]) => { - const field: Field = template.getFieldByID(Number(info.number)); - const col = this.getColByTitle(title); - - field.setContent(info.content ?? '', FieldContentType.STRING); - field.setTitle(col.title); - }); - } - } catch (err) { - console.log(err); - } - } - - return rendered; - }; - const generateAndLoadImage = async (fieldNum: string, col: Col, prompt: string) => { const url = await this.generateGPTImage(prompt); const field: Field = template.getFieldByID(Number(fieldNum)); @@ -629,33 +599,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { field.setTitle(col.title); }; - const renderImageCalls = async (): Promise<Doc[]> => { - const rendered: Doc[] = []; - const calls = GPTIMGCalls; - - if (calls.length) { - try { - await Promise.all( - calls.map(async ([fieldNum, col]) => { - const sysPrompt = - 'Your job is to create a prompt for an AI image generator to help it generate an image based on existing content in a template and a user prompt. Your prompt should focus heavily on visual elements to help the image generator; avoid unecessary info that might distract it. ONLY INCLUDE THE PROMPT, NO OTHER TEXT OR EXPLANATION. The existing content is as follows: ' + - fieldContent + - ' **** The user prompt is: ' + - col.desc; - - const prompt = await gptAPICall(sysPrompt, GPTCallType.COMPLETEPROMPT); - - generateAndLoadImage(fieldNum, col, prompt); - }) - ); - } catch (e) { - console.log(e); - } - } - - return rendered; - }; - const GPTTextCalls = Object.entries(assignments).filter(([str, col]) => col.type === TemplateFieldType.TEXT); const GPTIMGCalls = Object.entries(assignments).filter(([str, col]) => col.type === TemplateFieldType.VISUAL); @@ -671,15 +614,50 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { let fieldContent: string = this.templateManager.getContentSummary(template); - const textCalls = await renderTextCalls(); - const imageCalls = await renderImageCalls(); + if (GPTTextCalls.length) { + try { + const prompt = fieldContent + GPTTextAssignment; - return template; - }; + const res = await gptAPICall(prompt, GPTCallType.FILL); - renderTemplates = (templates: Template[]) => { + if (res) { + const assignments: { [title: string]: { number: string; content: string } } = JSON.parse(res); + //console.log('assignments', GPTAssignments, 'assignment string', GPTAssignmentString, 'field content', fieldContent, 'response', res, 'assignments', assignments); + Object.entries(assignments).forEach(([title, info]) => { + const field: Field = template.getFieldByID(Number(info.number)); + const col = this.getColByTitle(title); - } + field.setContent(info.content ?? '', FieldContentType.STRING); + field.setTitle(col.title); + }); + } + } catch (err) { + console.log(err); + } + } + + if (GPTIMGCalls.length) { + try { + await Promise.all( + GPTIMGCalls.map(async ([fieldNum, col]) => { + const sysPrompt = + 'Your job is to create a prompt for an AI image generator to help it generate an image based on existing content in a template and a user prompt. Your prompt should focus heavily on visual elements to help the image generator; avoid unecessary info that might distract it. ONLY INCLUDE THE PROMPT, NO OTHER TEXT OR EXPLANATION. The existing content is as follows: ' + + fieldContent + + ' **** The user prompt is: ' + + col.desc; + + const prompt = await gptAPICall(sysPrompt, GPTCallType.COMPLETEPROMPT); + + generateAndLoadImage(fieldNum, col, prompt); + }) + ); + } catch (e) { + console.log(e); + } + }; + + return template; + }; compileFieldDescriptions = (templates: Template[]): string => { let descriptions: string = ''; @@ -723,6 +701,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { if (res && this._callCount === origCount) { const assignments: { [templateTitle: string]: { [fieldID: string]: string } } = JSON.parse(res); + console.log('assignments', assignments) const brokenDownAssignments: [Template, { [fieldID: number]: Col }][] = []; Object.entries(assignments).forEach(([tempTitle, assignment]) => { @@ -733,6 +712,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { const col = this.getColByTitle(colTitle); if (!this._userCreatedColumns.includes(col)){ // do the following for any fields not added by the user; will change in the future, for now only GPT content works with user-added fields const field = template.getFieldByID(Number(fieldID)); + //console.log(field); field.setContent(col.defaultContent ?? '', col.type === TemplateFieldType.VISUAL ? FieldContentType.IMAGE : FieldContentType.STRING); field.setTitle(col.title); } else { @@ -766,7 +746,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { const renderedTemplates: Template[] = await Promise.all(renderedTemplatePromises); setTimeout(() => { - this.setGSuggestedTemplates(renderedTemplates.map(template => template.mainField.renderedDoc())); + this.setGSuggestedTemplates(templates.map(template => template.mainField.renderedDoc())); this._GPTLoading = false; }); }; |