updated from master

7 files changed, 817 insertions, 298 deletions

diff --git a/src/client/views/nodes/chatbot/agentsystem/Agent.ts b/src/client/views/nodes/chatbot/agentsystem/Agent.ts
index 8338879cf..689c152dd 100644
--- a/src/client/views/nodes/chatbot/agentsystem/Agent.ts
+++ b/src/client/views/nodes/chatbot/agentsystem/Agent.ts
@@ -1,28 +1,27 @@
 import dotenv from 'dotenv';
 import { XMLBuilder, XMLParser } from 'fast-xml-parser';
-import OpenAI from 'openai';
-import { ChatCompletionMessageParam } from 'openai/resources';
 import { escape } from 'lodash'; // Imported escape from lodash
+import OpenAI from 'openai';
+import { DocumentOptions } from '../../../../documents/Documents';
 import { AnswerParser } from '../response_parsers/AnswerParser';
 import { StreamedAnswerParser } from '../response_parsers/StreamedAnswerParser';
+import { BaseTool } from '../tools/BaseTool';
 import { CalculateTool } from '../tools/CalculateTool';
-import { CreateCSVTool } from '../tools/CreateCSVTool';
+import { CreateAnyDocumentTool } from '../tools/CreateAnyDocTool';
+import { CreateDocTool } from '../tools/CreateDocumentTool';
 import { DataAnalysisTool } from '../tools/DataAnalysisTool';
+import { ImageCreationTool } from '../tools/ImageCreationTool';
 import { NoTool } from '../tools/NoTool';
-import { RAGTool } from '../tools/RAGTool';
 import { SearchTool } from '../tools/SearchTool';
-import { WebsiteInfoScraperTool } from '../tools/WebsiteInfoScraperTool';
+import { Parameter, ParametersType, TypeMap } from '../types/tool_types';
 import { AgentMessage, ASSISTANT_ROLE, AssistantMessage, Observation, PROCESSING_TYPE, ProcessingInfo, TEXT_TYPE } from '../types/types';
 import { Vectorstore } from '../vectorstore/Vectorstore';
 import { getReactPrompt } from './prompts';
-import { BaseTool } from '../tools/BaseTool';
-import { Parameter, ParametersType, TypeMap } from '../types/tool_types';
-import { CreateTextDocTool } from '../tools/CreateTextDocumentTool';
-import { DocumentOptions } from '../../../../documents/Documents';
-import { CreateAnyDocumentTool } from '../tools/CreateAnyDocTool';
-import { ImageCreationTool } from '../tools/ImageCreationTool';
-import { DictionaryTool } from '../tools/DictionaryTool';
 //import { DictionaryTool } from '../tools/DictionaryTool';
+import { ChatCompletionMessageParam } from 'openai/resources';
+import { Doc } from '../../../../../fields/Doc';
+import { parsedDoc } from '../chatboxcomponents/ChatBox';
+import { CreateTextDocTool } from '../tools/CreateTextDocumentTool';
 
 dotenv.config();
 
@@ -61,9 +60,10 @@ export class Agent {
         history: () => string,
         csvData: () => { filename: string; id: string; text: string }[],
         addLinkedUrlDoc: (url: string, id: string) => void,
-        addLinkedDoc: (doc_type: string, data: string | undefined, options: DocumentOptions, id: string) => void,
-        createCSVInDash: (url: string, title: string, id: string, data: string) => void,
-        createImage: (result: any, options: DocumentOptions) => void
+        createImage: (result: any, options: DocumentOptions) => void,
+        addLinkedDoc: (doc: parsedDoc) => Doc | undefined,
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        createCSVInDash: (url: string, title: string, id: string, data: string) => void
     ) {
         // Initialize OpenAI client with API key from environment
         this.client = new OpenAI({ apiKey: process.env.OPENAI_KEY, dangerouslyAllowBrowser: true });
@@ -75,16 +75,17 @@ export class Agent {
         // Define available tools for the assistant
         this.tools = {
             calculate: new CalculateTool(),
-            rag: new RAGTool(this.vectorstore),
+            // rag: new RAGTool(this.vectorstore),
             dataAnalysis: new DataAnalysisTool(csvData),
-            websiteInfoScraper: new WebsiteInfoScraperTool(addLinkedUrlDoc),
+            // websiteInfoScraper: new WebsiteInfoScraperTool(addLinkedUrlDoc),
             searchTool: new SearchTool(addLinkedUrlDoc),
-            createCSV: new CreateCSVTool(createCSVInDash),
+            // createCSV: new CreateCSVTool(createCSVInDash),
             noTool: new NoTool(),
             imageCreationTool: new ImageCreationTool(createImage),
-            //createTextDoc: new CreateTextDocTool(addLinkedDoc),
+            createTextDoc: new CreateTextDocTool(addLinkedDoc),
+            createDoc: new CreateDocTool(addLinkedDoc),
             createAnyDocument: new CreateAnyDocumentTool(addLinkedDoc),
-            dictionary: new DictionaryTool(),
+            // dictionary: new DictionaryTool(),
         };
     }
 
@@ -142,6 +143,7 @@ export class Agent {
             console.log(this.interMessages);
             console.log(`Turn ${i}/${maxTurns}`);
 
+            // eslint-disable-next-line no-await-in-loop
             const result = await this.execute(onProcessingUpdate, onAnswerUpdate);
             this.interMessages.push({ role: 'assistant', content: result });
 
@@ -197,11 +199,13 @@ export class Agent {
                 } else if (key === 'action_input') {
                     // Handle action input stage
                     const actionInput = stage[key];
+                    console.log(`Action input full:`, actionInput);
                     console.log(`Action input:`, actionInput.inputs);
 
                     if (currentAction) {
                         try {
                             // Process the action with its input
+                            // eslint-disable-next-line no-await-in-loop
                             const observation = (await this.processAction(currentAction, actionInput.inputs)) as Observation[];
                             const nextPrompt = [{ type: 'text', text: `<stage number="${i + 1}" role="user"> <observation>` }, ...observation, { type: 'text', text: '</observation></stage>' }] as Observation[];
                             console.log(observation);
@@ -306,7 +310,7 @@ export class Agent {
      * @param response The parsed XML response from the assistant.
      * @throws An error if the response does not meet the expected structure.
      */
-    private validateAssistantResponse(response: any) {
+    private validateAssistantResponse(response: { stage: { [key: string]: object | string } }) {
         if (!response.stage) {
             throw new Error('Response does not contain a <stage> element');
         }
@@ -349,7 +353,7 @@ export class Agent {
 
             // If 'action_input' is present, validate its structure
             if ('action_input' in stage) {
-                const actionInput = stage.action_input;
+                const actionInput = stage.action_input as object;
 
                 if (!('action_input_description' in actionInput) || typeof actionInput.action_input_description !== 'string') {
                     throw new Error('action_input must contain an action_input_description string');
@@ -364,7 +368,7 @@ export class Agent {
 
             // If 'answer' is present, validate its structure
             if ('answer' in stage) {
-                const answer = stage.answer;
+                const answer = stage.answer as object;
 
                 // Ensure answer contains at least one of the required elements
                 if (!('grounded_text' in answer || 'normal_text' in answer)) {
diff --git a/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.tsx b/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.tsx
index 37059c635..f13116fdd 100644
--- a/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.tsx
+++ b/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.tsx
@@ -13,41 +13,40 @@ import { observer } from 'mobx-react';
 import OpenAI, { ClientOptions } from 'openai';
 import * as React from 'react';
 import { v4 as uuidv4 } from 'uuid';
-import { ClientUtils } from '../../../../../ClientUtils';
-import { Doc, DocListCast } from '../../../../../fields/Doc';
+import { ClientUtils, OmitKeys } from '../../../../../ClientUtils';
+import { Doc, DocListCast, Opt } from '../../../../../fields/Doc';
 import { DocData, DocViews } from '../../../../../fields/DocSymbols';
-import { CsvCast, DocCast, PDFCast, RTFCast, StrCast } from '../../../../../fields/Types';
-import { Networking } from '../../../../Network';
+import { RichTextField } from '../../../../../fields/RichTextField';
+import { ScriptField } from '../../../../../fields/ScriptField';
+import { CsvCast, DocCast, NumCast, PDFCast, RTFCast, StrCast } from '../../../../../fields/Types';
 import { DocUtils } from '../../../../documents/DocUtils';
-import { DocumentType } from '../../../../documents/DocumentTypes';
+import { CollectionViewType, DocumentType } from '../../../../documents/DocumentTypes';
 import { Docs, DocumentOptions } from '../../../../documents/Documents';
 import { DocumentManager } from '../../../../util/DocumentManager';
+import { ImageUtils } from '../../../../util/Import & Export/ImageUtils';
 import { LinkManager } from '../../../../util/LinkManager';
+import { CompileError, CompileScript } from '../../../../util/Scripting';
+import { DictationButton } from '../../../DictationButton';
 import { ViewBoxAnnotatableComponent } from '../../../DocComponent';
-import { DocumentView } from '../../DocumentView';
+import { AudioBox } from '../../AudioBox';
+import { DocumentView, DocumentViewInternal } from '../../DocumentView';
 import { FieldView, FieldViewProps } from '../../FieldView';
 import { PDFBox } from '../../PDFBox';
+import { ScriptingBox } from '../../ScriptingBox';
+import { VideoBox } from '../../VideoBox';
 import { Agent } from '../agentsystem/Agent';
+import { supportedDocumentTypes } from '../tools/CreateDocumentTool';
 import { ASSISTANT_ROLE, AssistantMessage, CHUNK_TYPE, Citation, ProcessingInfo, SimplifiedChunk, TEXT_TYPE } from '../types/types';
 import { Vectorstore } from '../vectorstore/Vectorstore';
 import './ChatBox.scss';
 import MessageComponentBox from './MessageComponent';
 import { ProgressBar } from './ProgressBar';
-import { RichTextField } from '../../../../../fields/RichTextField';
-import { VideoBox } from '../../VideoBox';
-import { AudioBox } from '../../AudioBox';
-import { DiagramBox } from '../../DiagramBox';
-import { ImageField } from '../../../../../fields/URLField';
-import { DashUploadUtils } from '../../../../../server/DashUploadUtils';
-import { DocCreatorMenu, Field, FieldUtils } from '../../DataVizBox/DocCreatorMenu';
-import { ImageUtils } from '../../../../util/Import & Export/ImageUtils';
-import { ScriptManager } from '../../../../util/ScriptManager';
-import { CompileError, CompileScript } from '../../../../util/Scripting';
-import { ScriptField } from '../../../../../fields/ScriptField';
-import { ScriptingBox } from '../../ScriptingBox';
+import { OpenWhere } from '../../OpenWhere';
 
 dotenv.config();
 
+export type parsedDocData = { doc_type: string; data: unknown };
+export type parsedDoc = DocumentOptions & parsedDocData;
 /**
  * ChatBox is the main class responsible for managing the interaction between the user and the assistant,
  * handling documents, and integrating with OpenAI for tasks such as document analysis, chat functionality,
@@ -56,17 +55,17 @@ dotenv.config();
 @observer
 export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     // MobX observable properties to track UI state and data
-    @observable history: AssistantMessage[] = [];
-    @observable.deep current_message: AssistantMessage | undefined = undefined;
-    @observable isLoading: boolean = false;
-    @observable uploadProgress: number = 0;
-    @observable currentStep: string = '';
-    @observable expandedScratchpadIndex: number | null = null;
-    @observable inputValue: string = '';
-    @observable private linked_docs_to_add: ObservableSet = observable.set();
-    @observable private linked_csv_files: { filename: string; id: string; text: string }[] = [];
-    @observable private isUploadingDocs: boolean = false;
-    @observable private citationPopup: { text: string; visible: boolean } = { text: '', visible: false };
+    @observable private _history: AssistantMessage[] = [];
+    @observable.deep private _current_message: AssistantMessage | undefined = undefined;
+    @observable private _isLoading: boolean = false;
+    @observable private _uploadProgress: number = 0;
+    @observable private _currentStep: string = '';
+    @observable private _expandedScratchpadIndex: number | null = null;
+    @observable private _inputValue: string = '';
+    @observable private _linked_docs_to_add: ObservableSet = observable.set();
+    @observable private _linked_csv_files: { filename: string; id: string; text: string }[] = [];
+    @observable private _isUploadingDocs: boolean = false;
+    @observable private _citationPopup: { text: string; visible: boolean } = { text: '', visible: false };
 
     // Private properties for managing OpenAI API, vector store, agent, and UI elements
     private openai: OpenAI;
@@ -74,6 +73,7 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     private vectorstore: Vectorstore;
     private agent: Agent;
     private messagesRef: React.RefObject<HTMLDivElement>;
+    private _textInputRef: HTMLInputElement | undefined | null;
 
     /**
      * Static method that returns the layout string for the field.
@@ -83,6 +83,10 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         return FieldView.LayoutString(ChatBox, fieldKey);
     }
 
+    setChatInput = action((input: string) => {
+        this._inputValue = input;
+    });
+
     /**
      * Constructor initializes the component, sets up OpenAI, vector store, and agent instances,
      * and observes changes in the chat history to save the state in dataDoc.
@@ -101,13 +105,13 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             this.vectorstore_id = StrCast(this.dataDoc.vectorstore_id);
         }
         this.vectorstore = new Vectorstore(this.vectorstore_id, this.retrieveDocIds);
-        this.agent = new Agent(this.vectorstore, this.retrieveSummaries, this.retrieveFormattedHistory, this.retrieveCSVData, this.addLinkedUrlDoc, this.createDocInDash, this.createCSVInDash, this.createImageInDash);
+        this.agent = new Agent(this.vectorstore, this.retrieveSummaries, this.retrieveFormattedHistory, this.retrieveCSVData, this.addLinkedUrlDoc, this.createImageInDash, this.createDocInDash, this.createCSVInDash);
         this.messagesRef = React.createRef<HTMLDivElement>();
 
         // Reaction to update dataDoc when chat history changes
         reaction(
             () =>
-                this.history.map((msg: AssistantMessage) => ({
+                this._history.map((msg: AssistantMessage) => ({
                     role: msg.role,
                     content: msg.content,
                     follow_up_questions: msg.follow_up_questions,
@@ -126,20 +130,22 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      */
     @action
     addDocToVectorstore = async (newLinkedDoc: Doc) => {
-        this.uploadProgress = 0;
-        this.currentStep = 'Initializing...';
-        this.isUploadingDocs = true;
+        this._uploadProgress = 0;
+        this._currentStep = 'Initializing...';
+        this._isUploadingDocs = true;
 
         try {
             // Add the document to the vectorstore
             await this.vectorstore.addAIDoc(newLinkedDoc, this.updateProgress);
         } catch (error) {
             console.error('Error uploading document:', error);
-            this.currentStep = 'Error during upload';
+            this._currentStep = 'Error during upload';
         } finally {
-            this.isUploadingDocs = false;
-            this.uploadProgress = 0;
-            this.currentStep = '';
+            runInAction(() => {
+                this._isUploadingDocs = false;
+                this._uploadProgress = 0;
+                this._currentStep = '';
+            });
         }
     };
 
@@ -150,8 +156,8 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      */
     @action
     updateProgress = (progress: number, step: string) => {
-        this.uploadProgress = progress;
-        this.currentStep = step;
+        this._uploadProgress = progress;
+        this._currentStep = step;
     };
 
     /**
@@ -188,7 +194,7 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             const csvId = id ?? uuidv4();
 
             // Add CSV details to linked files
-            this.linked_csv_files.push({
+            this._linked_csv_files.push({
                 filename: CsvCast(newLinkedDoc.data).url.pathname,
                 id: csvId,
                 text: csvData,
@@ -210,7 +216,7 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      */
     @action
     toggleToolLogs = (index: number) => {
-        this.expandedScratchpadIndex = this.expandedScratchpadIndex === index ? null : index;
+        this._expandedScratchpadIndex = this._expandedScratchpadIndex === index ? null : index;
     };
 
     /**
@@ -269,7 +275,7 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     @action
     askGPT = async (event: React.FormEvent): Promise<void> => {
         event.preventDefault();
-        this.inputValue = '';
+        this._inputValue = '';
 
         // Extract the user's message
         const textInput = (event.currentTarget as HTMLFormElement).elements.namedItem('messageInput') as HTMLInputElement;
@@ -279,13 +285,13 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             try {
                 textInput.value = '';
                 // Add the user's message to the history
-                this.history.push({
+                this._history.push({
                     role: ASSISTANT_ROLE.USER,
                     content: [{ index: 0, type: TEXT_TYPE.NORMAL, text: trimmedText, citation_ids: null }],
                     processing_info: [],
                 });
-                this.isLoading = true;
-                this.current_message = {
+                this._isLoading = true;
+                this._current_message = {
                     role: ASSISTANT_ROLE.ASSISTANT,
                     content: [],
                     citations: [],
@@ -295,9 +301,9 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                 // Define callbacks for real-time processing updates
                 const onProcessingUpdate = (processingUpdate: ProcessingInfo[]) => {
                     runInAction(() => {
-                        if (this.current_message) {
-                            this.current_message = {
-                                ...this.current_message,
+                        if (this._current_message) {
+                            this._current_message = {
+                                ...this._current_message,
                                 processing_info: processingUpdate,
                             };
                         }
@@ -307,9 +313,9 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
 
                 const onAnswerUpdate = (answerUpdate: string) => {
                     runInAction(() => {
-                        if (this.current_message) {
-                            this.current_message = {
-                                ...this.current_message,
+                        if (this._current_message) {
+                            this._current_message = {
+                                ...this._current_message,
                                 content: [{ text: answerUpdate, type: TEXT_TYPE.NORMAL, index: 0, citation_ids: [] }],
                             };
                         }
@@ -321,22 +327,24 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
 
                 // Update the history with the final assistant message
                 runInAction(() => {
-                    if (this.current_message) {
-                        this.history.push({ ...finalMessage });
-                        this.current_message = undefined;
-                        this.dataDoc.data = JSON.stringify(this.history);
+                    if (this._current_message) {
+                        this._history.push({ ...finalMessage });
+                        this._current_message = undefined;
+                        this.dataDoc.data = JSON.stringify(this._history);
                     }
                 });
             } catch (err) {
                 console.error('Error:', err);
                 // Handle error in processing
-                this.history.push({
+                this._history.push({
                     role: ASSISTANT_ROLE.ASSISTANT,
                     content: [{ index: 0, type: TEXT_TYPE.ERROR, text: 'Sorry, I encountered an error while processing your request.', citation_ids: null }],
                     processing_info: [],
                 });
             } finally {
-                this.isLoading = false;
+                runInAction(() => {
+                    this._isLoading = false;
+                });
                 this.scrollToBottom();
             }
         }
@@ -350,8 +358,8 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      */
     @action
     updateMessageCitations = (index: number, citations: Citation[]) => {
-        if (this.history[index]) {
-            this.history[index].citations = citations;
+        if (this._history[index]) {
+            this._history[index].citations = citations;
         }
     };
 
@@ -392,17 +400,14 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      * @param data The CSV data content.
      */
     @action
-    createCSVInDash = async (url: string, title: string, id: string, data: string) => {
-        const doc = DocCast(await DocUtils.DocumentFromType('csv', url, { title: title, text: RTFCast(data) }));
-
-        const linkDoc = Docs.Create.LinkDocument(this.Document, doc);
-        LinkManager.Instance.addLink(linkDoc);
-
-        doc && this._props.addDocument?.(doc);
-        await DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {});
-
-        this.addCSVForAnalysis(doc, id);
-    };
+    createCSVInDash = (url: string, title: string, id: string, data: string) =>
+        DocUtils.DocumentFromType('csv', url, { title: title, text: RTFCast(data) }).then(doc => {
+            if (doc) {
+                LinkManager.Instance.addLink(Docs.Create.LinkDocument(this.Document, doc));
+                this._props.addDocument?.(doc);
+                DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {}).then(() => this.addCSVForAnalysis(doc, id));
+            }
+        });
 
     @action
     createImageInDash = async (result: any, options: DocumentOptions) => {
@@ -414,7 +419,10 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         this.addDocument(ImageUtils.AssignImgInfo(doc, result));
         const linkDoc = Docs.Create.LinkDocument(this.Document, doc);
         LinkManager.Instance.addLink(linkDoc);
-        doc && this._props.addDocument?.(doc);
+        if (doc) {
+            if (this._props.addDocument) this._props.addDocument(doc);
+            else DocumentViewInternal.addDocTabFunc(doc, OpenWhere.addRight);
+        }
         await DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {});
     };
 
@@ -426,86 +434,173 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      * @param id The unique ID for the document.
      */
     @action
-    createDocInDash = async (doc_type: string, data: string | undefined, options: DocumentOptions, id: string) => {
-        let doc: Doc;
+    private createCollectionWithChildren = (data: parsedDoc[], insideCol: boolean): Opt<Doc>[] => data.map(doc => this.whichDoc(doc, insideCol));
 
-        switch (doc_type.toLowerCase()) {
-            case 'text':
-                doc = Docs.Create.PdfDocument(data || '', { ...options, text: RTFCast(data) });
-                break;
-            case 'pdf':
-                doc = Docs.Create.PdfDocument(data || '', options);
-                break;
-            case 'video':
-                doc = Docs.Create.VideoDocument(data || '', options);
-                break;
-            case 'mermaid_diagram':
-                doc = Docs.Create.DiagramDocument(data, options);
-                DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {
-                    const firstView = Array.from(doc[DocViews])[0] as DocumentView;
-                    (firstView.ComponentView as DiagramBox)?.renderMermaid?.(data!);
-                });
-                break;
-            case 'audio':
-                doc = Docs.Create.AudioDocument(data || '', options);
-                break;
-            case 'web':
-                doc = Docs.Create.WebDocument(data || '', options);
-                break;
-            case 'equation':
-                doc = Docs.Create.EquationDocument(data || '', options);
-                break;
-            case 'function_plot':
-                doc = Docs.Create.FunctionPlotDocument([], options);
-                break;
-            case 'dataviz':
-                const { fileUrl, id } = await Networking.PostToServer('/createCSV', {
-                    filename: (options.title as string).replace(/\s+/g, '') + '.csv',
-                    data: data,
-                });
-                doc = Docs.Create.DataVizDocument(fileUrl, { ...options, text: RTFCast(data) });
-                this.addCSVForAnalysis(doc, id);
-                break;
-            case 'chat':
-                doc = Docs.Create.ChatDocument(options);
-                break;
-            case 'note_taking':
-                doc = Docs.Create.NoteTakingDocument([Docs.Create.TextDocument(data!)], options);
-                break;
-            case 'script':
-                const result = !data!.trim() ? ({ compiled: false, errors: [] } as CompileError) : CompileScript(data!, {});
-                const script_field = result.compiled ? new ScriptField(result, undefined, data!) : undefined;
-                doc = Docs.Create.ScriptingDocument(script_field, options);
-                await DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {
-                    const firstView = Array.from(doc[DocViews])[0] as DocumentView;
-                    (firstView.ComponentView as ScriptingBox)?.onApply?.();
-                    (firstView.ComponentView as ScriptingBox)?.onRun?.();
-                });
-
-                break;
-            // this.dataDoc.script = this.rawScript;
+    @action
+    whichDoc = (doc: parsedDoc, insideCol: boolean): Opt<Doc> => {
+        const options = OmitKeys(doc, ['doct_type', 'data']).omit as DocumentOptions;
+        const data = (doc as parsedDocData).data;
+        const ndoc = (() => {
+            switch (doc.doc_type) {
+                default:           
+                case supportedDocumentTypes.text:       return Docs.Create.TextDocument(data as string, options);
+                case supportedDocumentTypes.comparison: return this.createComparison(data as parsedDoc[], options);
+                case supportedDocumentTypes.flashcard:  return this.createFlashcard(data as parsedDoc[], options);
+                case supportedDocumentTypes.deck:       return this.createDeck(data as parsedDoc[], options);
+                case supportedDocumentTypes.image:      return Docs.Create.ImageDocument(data as string, options);
+                case supportedDocumentTypes.equation:   return Docs.Create.EquationDocument(data as string, options);
+                case supportedDocumentTypes.notetaking: return Docs.Create.NoteTakingDocument([], options);
+                case supportedDocumentTypes.web:        return Docs.Create.WebDocument(data as string, { ...options, data_useCors: true });
+                case supportedDocumentTypes.dataviz:    return Docs.Create.DataVizDocument('/users/rz/Downloads/addresses.csv', options);
+                case supportedDocumentTypes.pdf:        return Docs.Create.PdfDocument(data as string, options);
+                case supportedDocumentTypes.video:      return Docs.Create.VideoDocument(data as string, options);
+                case supportedDocumentTypes.mermaid:    return Docs.Create.DiagramDocument(undefined, { text: data as unknown as RichTextField, ...options}); // text: can take a string or RichTextField but it's typed for RichTextField.
+                
+                // case supportedDocumentTypes.dataviz: 
+                // {
+                //     const { fileUrl, id } = await Networking.PostToServer('/createCSV', {
+                //         filename: (options.title as string).replace(/\s+/g, '') + '.csv',
+                //         data: data,
+                //     });
+                //     const doc = Docs.Create.DataVizDocument(fileUrl, { ...options, text: RTFCast(data as string) });
+                //     this.addCSVForAnalysis(doc, id);
+                //     return doc;
+                // }
+                case supportedDocumentTypes.script: {
+                    const result = !(data as string).trim() ? ({ compiled: false, errors: [] } as CompileError) : CompileScript(data as string, {});
+                    const script_field = result.compiled ? new ScriptField(result, undefined, data as string) : undefined;
+                    const sdoc = Docs.Create.ScriptingDocument(script_field, options);
+                    DocumentManager.Instance.showDocument(sdoc, { willZoomCentered: true }, () => {
+                        const firstView = Array.from(sdoc[DocViews])[0] as DocumentView;
+                        (firstView.ComponentView as ScriptingBox)?.onApply?.();
+                        (firstView.ComponentView as ScriptingBox)?.onRun?.();
+                    });
+                    return sdoc;
+                }
+                case supportedDocumentTypes.collection: {
+                    const arr = this.createCollectionWithChildren(data as parsedDoc[], true).filter(d=>d).map(d => d!);
+                    const collOpts = {  ...options, _layout_fitWidth: true, _width:300, _height: 300, _freeform_backgroundGrid: true };
+                    return (() => {
+                            switch (options.type_collection) {
+                                case CollectionViewType.Tree:        return Docs.Create.TreeDocument(arr, collOpts);
+                                case CollectionViewType.Masonry:     return Docs.Create.MasonryDocument(arr, collOpts);
+                                case CollectionViewType.Card:        return Docs.Create.CardDeckDocument(arr, collOpts);
+                                case CollectionViewType.Carousel:    return Docs.Create.CarouselDocument(arr, collOpts);
+                                case CollectionViewType.Carousel3D:  return Docs.Create.Carousel3DDocument(arr, collOpts);
+                                case CollectionViewType.Multicolumn: return Docs.Create.CarouselDocument(arr, collOpts);
+                                default:                             return Docs.Create.FreeformDocument(arr, collOpts);
+                            }
+                        })();
+                    }
+                // case supportedDocumentTypes.map:        return Docs.Create.MapDocument([], options);
+                // case supportedDocumentTypes.button:     return Docs.Create.ButtonDocument(options);
+                // case supportedDocumentTypes.trail:      return Docs.Create.PresDocument(options);
+            } // prettier-ignore
+        })();
+
+        if (ndoc) {
+            ndoc.x = NumCast((options.x as number) ?? 0) + (insideCol ? 0 : NumCast(this.layoutDoc.x) + NumCast(this.layoutDoc.width)) + 100;
+            ndoc.y = NumCast(options.y as number) + (insideCol ? 0 : NumCast(this.layoutDoc.y));
+        }
+        return ndoc;
+    };
 
-            // ScriptManager.Instance.addScript(this.dataDoc);
+    /**
+     * Creates a document in the dashboard.
+     *
+     * @param {string} doc_type - The type of document to create.
+     * @param {string} data - The data used to generate the document.
+     * @param {DocumentOptions} options - Configuration options for the document.
+     * @returns {Promise<void>} A promise that resolves once the document is created and displayed.
+     */
+    @action
+    createDocInDash = (pdoc: parsedDoc) => {
+        const linkAndShowDoc = (doc: Opt<Doc>) => {
+            if (doc) {
+                LinkManager.Instance.addLink(Docs.Create.LinkDocument(this.Document, doc));
+                this._props.addDocument?.(doc);
+                DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {});
+            }
+        };
+        const doc = this.whichDoc(pdoc, false);
+        if (doc) linkAndShowDoc(doc);
+        return doc;
+    };
 
-            // this._scriptKeys = ScriptingGlobals.getGlobals();
-            // this._scriptingDescriptions = ScriptingGlobals.getDescriptions();
-            // this._scriptingParams = ScriptingGlobals.getParameters();
-            // Add more cases for other document types
-            default:
-                console.error('Unknown or unsupported document type:', doc_type);
-                return;
+    /**
+     * Creates a deck of flashcards.
+     *
+     * @param {any} data - The data used to generate the flashcards. Can be a string or an object.
+     * @param {DocumentOptions} options - Configuration options for the flashcard deck.
+     * @returns {Doc} A carousel document containing the flashcard deck.
+     */
+    @action
+    createDeck = (data: parsedDoc[], options: DocumentOptions) => {
+        const flashcardDeck: Doc[] = [];
+        // Process each flashcard document in the `deckData` array
+        if (data.length == 2 && data[0].doc_type == 'text' && data[1].doc_type == 'text') {
+            this.createFlashcard(data, options);
+        } else {
+            data.forEach(doc => {
+                const flashcardDoc = this.createFlashcard((doc as parsedDocData).data as parsedDoc[] | string[], options);
+                if (flashcardDoc) flashcardDeck.push(flashcardDoc);
+            });
         }
-        const linkDoc = Docs.Create.LinkDocument(this.Document, doc);
-        LinkManager.Instance.addLink(linkDoc);
 
-        doc && this._props.addDocument?.(doc);
-        await DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {});
+        // Create a carousel to contain the flashcard deck
+        return Docs.Create.CarouselDocument(flashcardDeck, {
+            title: options.title || 'Flashcard Deck',
+            _width: options._width || 300,
+            _height: options._height || 300,
+            _layout_fitWidth: false,
+            _layout_autoHeight: true,
+        });
     };
 
+    /**
+     * Creates a single flashcard document.
+     *
+     * @param {any} data - The data used to generate the flashcard. Can be a string or an object.
+     * @param {any} options - Configuration options for the flashcard.
+     * @returns {Doc | undefined} The created flashcard document, or undefined if the flashcard cannot be created.
+     */
+    @action
+    createFlashcard = (data: parsedDoc[] | string[], options: DocumentOptions) => {
+        const [front, back] = data;
+        const sideOptions = { _height: 300, ...options };
+
+        // Create front and back text documents
+        const side1 = typeof front === 'string' ? Docs.Create.CenteredTextCreator('question', front as string, sideOptions) : this.whichDoc(front, false);
+        const side2 = typeof back === 'string' ? Docs.Create.CenteredTextCreator('answer', back as string, sideOptions) : this.whichDoc(back, false);
+
+        // Create the flashcard document with both sides
+        return Docs.Create.FlashcardDocument('flashcard', side1, side2, sideOptions);
+    };
+
+    /**
+     * Creates a comparison document.
+     *
+     * @param {any} doc - The document data containing left and right components for comparison.
+     * @param {any} options - Configuration options for the comparison document.
+     * @returns {Doc} The created comparison document.
+     */
+    @action
+    createComparison = (doc: parsedDoc[], options: DocumentOptions) =>
+        Docs.Create.ComparisonDocument(options.title as string, {
+            data_back: this.whichDoc(doc[0], false),
+            data_front: this.whichDoc(doc[1], false),
+            _width: options._width,
+            _height: options._height || 300,
+            backgroundColor: options.backgroundColor,
+        });
+
+    /**
+     * Event handler to manage citations click in the message components.
+     * @param citation The citation object clicked by the user.
+     */
     @action
     handleCitationClick = async (citation: Citation) => {
         const currentLinkedDocs: Doc[] = this.linkedDocs;
-
         const chunkId = citation.chunk_id;
 
         for (const doc of currentLinkedDocs) {
@@ -643,8 +738,8 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                 }
                 break;
             case CHUNK_TYPE.TEXT:
-                this.citationPopup = { text: citation.direct_text ?? 'No text available', visible: true };
-                setTimeout(() => (this.citationPopup.visible = false), 3000);
+                this._citationPopup = { text: citation.direct_text ?? 'No text available', visible: true };
+                setTimeout(() => (this._citationPopup.visible = false), 3000);
 
                 DocumentManager.Instance.showDocument(doc, { willZoomCentered: true }, () => {
                     const firstView = Array.from(doc[DocViews])[0] as DocumentView;
@@ -705,7 +800,7 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             try {
                 const storedHistory = JSON.parse(StrCast(this.dataDoc.data));
                 runInAction(() => {
-                    this.history.push(
+                    this._history.push(
                         ...storedHistory.map((msg: AssistantMessage) => ({
                             role: msg.role,
                             content: msg.content,
@@ -720,7 +815,7 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         } else {
             // Default welcome message
             runInAction(() => {
-                this.history.push({
+                this._history.push({
                     role: ASSISTANT_ROLE.ASSISTANT,
                     content: [
                         {
@@ -744,11 +839,11 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                     .filter(d => d);
                 return linkedDocs;
             },
-            linked => linked.forEach(doc => this.linked_docs_to_add.add(doc))
+            linked => linked.forEach(doc => this._linked_docs_to_add.add(doc))
         );
 
         // Observe changes to linked documents and handle document addition
-        observe(this.linked_docs_to_add, change => {
+        observe(this._linked_docs_to_add, change => {
             if (change.type === 'add') {
                 if (CsvCast(change.newValue.data)) {
                     this.addCSVForAnalysis(change.newValue);
@@ -824,18 +919,16 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     /**
      * Getter that retrieves all linked CSV files for analysis.
      */
-    @computed
-    get linkedCSVs(): { filename: string; id: string; text: string }[] {
-        return this.linked_csv_files;
+    @computed get linkedCSVs(): { filename: string; id: string; text: string }[] {
+        return this._linked_csv_files;
     }
 
     /**
      * Getter that formats the entire chat history as a string for the agent's system message.
      */
-    @computed
-    get formattedHistory(): string {
+    @computed get formattedHistory(): string {
         let history = '<chat_history>\n';
-        for (const message of this.history) {
+        for (const message of this._history) {
             history += `<${message.role}>${message.content.map(content => content.text).join(' ')}`;
             if (message.loop_summary) {
                 history += `<loop_summary>${message.loop_summary}</loop_summary>`;
@@ -871,20 +964,21 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
      */
     @action
     handleFollowUpClick = (question: string) => {
-        this.inputValue = question;
+        this._inputValue = question;
     };
 
+    _dictation: DictationButton | null = null;
     /**
      * Renders the chat interface, including the message list, input field, and other UI elements.
      */
     render() {
         return (
             <div className="chat-box">
-                {this.isUploadingDocs && (
+                {this._isUploadingDocs && (
                     <div className="uploading-overlay">
                         <div className="progress-container">
                             <ProgressBar />
-                            <div className="step-name">{this.currentStep}</div>
+                            <div className="step-name">{this._currentStep}</div>
                         </div>
                     </div>
                 )}
@@ -892,18 +986,29 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                     <h2>{this.userName()}&apos;s AI Assistant</h2>
                 </div>
                 <div className="chat-messages" ref={this.messagesRef}>
-                    {this.history.map((message, index) => (
+                    {this._history.map((message, index) => (
                         <MessageComponentBox key={index} message={message} onFollowUpClick={this.handleFollowUpClick} onCitationClick={this.handleCitationClick} updateMessageCitations={this.updateMessageCitations} />
                     ))}
-                    {this.current_message && (
-                        <MessageComponentBox key={this.history.length} message={this.current_message} onFollowUpClick={this.handleFollowUpClick} onCitationClick={this.handleCitationClick} updateMessageCitations={this.updateMessageCitations} />
+                    {this._current_message && (
+                        <MessageComponentBox key={this._history.length} message={this._current_message} onFollowUpClick={this.handleFollowUpClick} onCitationClick={this.handleCitationClick} updateMessageCitations={this.updateMessageCitations} />
                     )}
                 </div>
 
                 <form onSubmit={this.askGPT} className="chat-input">
-                    <input type="text" name="messageInput" autoComplete="off" placeholder="Type your message here..." value={this.inputValue} onChange={e => (this.inputValue = e.target.value)} disabled={this.isLoading} />
-                    <button className="submit-button" type="submit" disabled={this.isLoading || !this.inputValue.trim()}>
-                        {this.isLoading ? (
+                    <input
+                        ref={r => {
+                            this._textInputRef = r;
+                        }}
+                        type="text"
+                        name="messageInput"
+                        autoComplete="off"
+                        placeholder="Type your message here..."
+                        value={this._inputValue}
+                        onChange={action(e => (this._inputValue = e.target.value))}
+                        disabled={this._isLoading}
+                    />
+                    <button className="submit-button" onClick={() => this._dictation?.stopDictation()} type="submit" disabled={this._isLoading || !this._inputValue.trim()}>
+                        {this._isLoading ? (
                             <div className="spinner"></div>
                         ) : (
                             <svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" strokeWidth="2" fill="none" strokeLinecap="round" strokeLinejoin="round">
@@ -912,12 +1017,19 @@ export class ChatBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                             </svg>
                         )}
                     </button>
+                    <DictationButton
+                        ref={r => {
+                            this._dictation = r;
+                        }}
+                        setInput={this.setChatInput}
+                        inputRef={this._textInputRef}
+                    />
                 </form>
                 {/* Popup for citation */}
-                {this.citationPopup.visible && (
+                {this._citationPopup.visible && (
                     <div className="citation-popup">
                         <p>
-                            <strong>Text from your document: </strong> {this.citationPopup.text}
+                            <strong>Text from your document: </strong> {this._citationPopup.text}
                         </p>
                     </div>
                 )}
diff --git a/src/client/views/nodes/chatbot/tools/CreateAnyDocTool.ts b/src/client/views/nodes/chatbot/tools/CreateAnyDocTool.ts
index 5f3af8296..5cf858998 100644
--- a/src/client/views/nodes/chatbot/tools/CreateAnyDocTool.ts
+++ b/src/client/views/nodes/chatbot/tools/CreateAnyDocTool.ts
@@ -1,57 +1,76 @@
-import { v4 as uuidv4 } from 'uuid';
-import { BaseTool } from './BaseTool';
+import { toLower } from 'lodash';
+import { Doc } from '../../../../../fields/Doc';
+import { Id } from '../../../../../fields/FieldSymbols';
+import { DocumentOptions } from '../../../../documents/Documents';
+import { parsedDoc } from '../chatboxcomponents/ChatBox';
+import { ParametersType, ToolInfo } from '../types/tool_types';
 import { Observation } from '../types/types';
-import { ParametersType, Parameter, ToolInfo } from '../types/tool_types';
-import { DocumentOptions, Docs } from '../../../../documents/Documents';
-
-/**
- * List of supported document types that can be created via text LLM.
- */
-type supportedDocumentTypesType = 'text' | 'html' | 'equation' | 'function_plot' | 'dataviz' | 'note_taking' | 'rtf' | 'message' | 'mermaid_diagram' | 'script';
-const supportedDocumentTypes: supportedDocumentTypesType[] = ['text', 'html', 'equation', 'function_plot', 'dataviz', 'note_taking', 'rtf', 'message', 'mermaid_diagram', 'script'];
+import { BaseTool } from './BaseTool';
+import { supportedDocumentTypes } from './CreateDocumentTool';
 
+const standardOptions = ['title', 'backgroundColor'];
 /**
  * Description of document options and data field for each type.
  */
-const documentTypesInfo = {
-    text: {
-        options: ['title', 'backgroundColor', 'fontColor', 'text_align', 'layout'],
-        dataDescription: 'The text content of the text document. Should contain all the text content.',
+const documentTypesInfo: { [key in supportedDocumentTypes]: { options: string[]; dataDescription: string } } = {
+    [supportedDocumentTypes.flashcard]: {
+        options: [...standardOptions, 'fontColor', 'text_align'],
+        dataDescription: 'an array of two strings.  the first string contains a question, and the second string contains an answer',
+    },
+    [supportedDocumentTypes.text]: {
+        options: [...standardOptions, 'fontColor', 'text_align'],
+        dataDescription: 'The text content of the document.',
     },
-    html: {
-        options: ['title', 'backgroundColor', 'layout'],
+    [supportedDocumentTypes.html]: {
+        options: [],
         dataDescription: 'The HTML-formatted text content of the document.',
     },
-    equation: {
-        options: ['title', 'backgroundColor', 'fontColor', 'layout'],
+    [supportedDocumentTypes.equation]: {
+        options: [...standardOptions, 'fontColor'],
         dataDescription: 'The equation content as a string.',
     },
-    function_plot: {
-        options: ['title', 'backgroundColor', 'layout', 'function_definition'],
+    [supportedDocumentTypes.functionplot]: {
+        options: [...standardOptions, 'function_definition'],
         dataDescription: 'The function definition(s) for plotting. Provide as a string or array of function definitions.',
     },
-    dataviz: {
-        options: ['title', 'backgroundColor', 'layout', 'chartType'],
+    [supportedDocumentTypes.dataviz]: {
+        options: [...standardOptions, 'chartType'],
         dataDescription: 'A string of comma-separated values representing the CSV data.',
     },
-    note_taking: {
-        options: ['title', 'backgroundColor', 'layout'],
+    [supportedDocumentTypes.notetaking]: {
+        options: standardOptions,
         dataDescription: 'The initial content or structure for note-taking.',
     },
-    rtf: {
-        options: ['title', 'backgroundColor', 'layout'],
+    [supportedDocumentTypes.rtf]: {
+        options: standardOptions,
         dataDescription: 'The rich text content in RTF format.',
     },
-    message: {
-        options: ['title', 'backgroundColor', 'layout'],
+    [supportedDocumentTypes.image]: {
+        options: standardOptions,
+        dataDescription: 'The image content as an image file URL.',
+    },
+    [supportedDocumentTypes.pdf]: {
+        options: standardOptions,
+        dataDescription: 'the pdf content as a PDF file url.',
+    },
+    [supportedDocumentTypes.audio]: {
+        options: standardOptions,
+        dataDescription: 'The audio content as a file url.',
+    },
+    [supportedDocumentTypes.video]: {
+        options: standardOptions,
+        dataDescription: 'The video content as a file url.',
+    },
+    [supportedDocumentTypes.message]: {
+        options: standardOptions,
         dataDescription: 'The message content of the document.',
     },
-    mermaid_diagram: {
-        options: ['title', 'backgroundColor', 'layout'],
+    [supportedDocumentTypes.mermaid]: {
+        options: ['title', 'backgroundColor'],
         dataDescription: 'The Mermaid diagram content.',
     },
-    script: {
-        options: ['title', 'backgroundColor', 'layout'],
+    [supportedDocumentTypes.script]: {
+        options: ['title', 'backgroundColor'],
         dataDescription: 'The compilable JavaScript code. Use this for creating scripts.',
     },
 };
@@ -60,7 +79,7 @@ const createAnyDocumentToolParams = [
     {
         name: 'document_type',
         type: 'string',
-        description: `The type of the document to create. Supported types are: ${supportedDocumentTypes.join(', ')}`,
+        description: `The type of the document to create. Supported types are: ${Object.values(supportedDocumentTypes).join(', ')}`,
         required: true,
     },
     {
@@ -72,14 +91,11 @@ const createAnyDocumentToolParams = [
     {
         name: 'options',
         type: 'string',
-        description: `A JSON string representing the document options. Available options depend on the document type. For example:
-${supportedDocumentTypes
-    .map(
-        docType => `
-- For '${docType}' documents, options include: ${documentTypesInfo[docType].options.join(', ')}`
-    )
-    .join('\n')}`,
         required: false,
+        description: `A JSON string representing the document options. Available options depend on the document type. For example:
+            ${Object.entries(documentTypesInfo).map( ([doc_type, info]) => `
+- For '${doc_type}' documents, options include: ${info.options.join(', ')}`) 
+                    .join('\n')}`, // prettier-ignore
     },
 ] as const;
 
@@ -87,76 +103,56 @@ type CreateAnyDocumentToolParamsType = typeof createAnyDocumentToolParams;
 
 const createAnyDocToolInfo: ToolInfo<CreateAnyDocumentToolParamsType> = {
     name: 'createAnyDocument',
-    description: `Creates any type of document (in Dash) with the provided options and data. Supported document types are: ${supportedDocumentTypes.join(', ')}. dataviz is a csv table tool, so for CSVs, use dataviz. Here are the options for each type:
-            <supported_document_types>
-        ${supportedDocumentTypes
+    description:
+        `Creates any type of document with the provided options and data. 
+      Supported document types are: ${Object.values(supportedDocumentTypes).join(', ')}. 
+           dataviz is a csv table tool, so for CSVs, use dataviz. Here are the options for each type:
+        <supported_document_types>` +
+        Object.entries(documentTypesInfo)
             .map(
-                docType => `
-        <document_type name="${docType}">
-          <data_description>${documentTypesInfo[docType].dataDescription}</data_description>
-          <options>
-            ${documentTypesInfo[docType].options.map(option => `<option>${option}</option>`).join('\n')}
-          </options>
-        </document_type>
-        `
+                ([doc_type, info]) =>
+                    `<document_type name="${doc_type}">
+                    <data_description>${info.dataDescription}</data_description>
+                    <options>` +
+                    info.options.map(option => `<option>${option}</option>`).join('\n') +
+                    `</options>
+                </document_type>`
             )
-            .join('\n')}
-      </supported_document_types>`,
+            .join('\n') +
+        `</supported_document_types>`,
     parameterRules: createAnyDocumentToolParams,
     citationRules: 'No citation needed.',
 };
 
 export class CreateAnyDocumentTool extends BaseTool<CreateAnyDocumentToolParamsType> {
-    private _addLinkedDoc: (doc_type: string, data: string | undefined, options: DocumentOptions, id: string) => void;
+    private _addLinkedDoc: (doc: parsedDoc) => Doc | undefined;
 
-    constructor(addLinkedDoc: (doc_type: string, data: string | undefined, options: DocumentOptions, id: string) => void) {
+    constructor(addLinkedDoc: (doc: parsedDoc) => Doc | undefined) {
         super(createAnyDocToolInfo);
         this._addLinkedDoc = addLinkedDoc;
     }
 
     async execute(args: ParametersType<CreateAnyDocumentToolParamsType>): Promise<Observation[]> {
         try {
-            const documentType: supportedDocumentTypesType = args.document_type.toLowerCase() as supportedDocumentTypesType;
-            let options: DocumentOptions = {};
+            const documentType = toLower(args.document_type) as unknown as supportedDocumentTypes;
+            const info = documentTypesInfo[documentType];
 
-            if (!supportedDocumentTypes.includes(documentType)) {
-                throw new Error(`Unsupported document type: ${documentType}. Supported types are: ${supportedDocumentTypes.join(', ')}.`);
+            if (info === undefined) {
+                throw new Error(`Unsupported document type: ${documentType}. Supported types are: ${Object.values(supportedDocumentTypes).join(', ')}.`);
             }
 
             if (!args.data) {
-                throw new Error(`Data is required for ${documentType} documents. ${documentTypesInfo[documentType].dataDescription}`);
+                throw new Error(`Data is required for ${documentType} documents. ${info.dataDescription}`);
             }
 
-            if (args.options) {
-                try {
-                    options = JSON.parse(args.options as string) as DocumentOptions;
-                } catch (e) {
-                    throw new Error('Options must be a valid JSON string.');
-                }
-            }
-
-            const data = args.data as string;
-            const id = uuidv4();
-
-            // Set default options if not provided
-            options.title = options.title || `New ${documentType.charAt(0).toUpperCase() + documentType.slice(1)} Document`;
+            const options: DocumentOptions = !args.options ? {} : JSON.parse(args.options);
 
-            // Call the function to add the linked document
-            this._addLinkedDoc(documentType, data, options, id);
+            // Call the function to add the linked document (add default title that can be overriden if set in options)
+            const doc = this._addLinkedDoc({ doc_type: documentType, data: args.data, title: `New ${documentType.charAt(0).toUpperCase() + documentType.slice(1)} Document`, ...options });
 
-            return [
-                {
-                    type: 'text',
-                    text: `Created ${documentType} document with ID ${id}.`,
-                },
-            ];
+            return [{ type: 'text', text: `Created ${documentType} document with ID ${doc?.[Id]}.` }];
         } catch (error) {
-            return [
-                {
-                    type: 'text',
-                    text: 'Error creating document: ' + (error as Error).message,
-                },
-            ];
+            return [{ type: 'text', text: 'Error creating document: ' + (error as Error).message }];
         }
     }
 }
diff --git a/src/client/views/nodes/chatbot/tools/CreateDocumentTool.ts b/src/client/views/nodes/chatbot/tools/CreateDocumentTool.ts
new file mode 100644
index 000000000..7d6964f44
--- /dev/null
+++ b/src/client/views/nodes/chatbot/tools/CreateDocumentTool.ts
@@ -0,0 +1,415 @@
+import { BaseTool } from './BaseTool';
+import { Observation } from '../types/types';
+import { ParametersType, ToolInfo } from '../types/tool_types';
+import { parsedDoc } from '../chatboxcomponents/ChatBox';
+
+/**
+ * List of supported document types that can be created via text LLM.
+ */
+export enum supportedDocumentTypes {
+    flashcard = 'flashcard',
+    text = 'text',
+    html = 'html',
+    equation = 'equation',
+    functionplot = 'functionplot',
+    dataviz = 'dataviz',
+    notetaking = 'notetaking',
+    audio = 'audio',
+    video = 'video',
+    pdf = 'pdf',
+    rtf = 'rtf',
+    message = 'message',
+    collection = 'collection',
+    image = 'image',
+    deck = 'deck',
+    web = 'web',
+    comparison = 'comparison',
+    mermaid = 'mermaid',
+    script = 'script',
+}
+/**
+ * Tthe CreateDocTool class is responsible for creating
+ * documents of various types (e.g., text, flashcards, collections) and organizing them in a
+ * structured manner. The tool supports creating dashboards with diverse document types and
+ * ensures proper placement of documents without overlap.
+ */
+
+// Example document structure for various document types
+const example = [
+    {
+        doc_type: supportedDocumentTypes.equation,
+        title: 'quadratic',
+        data: 'x^2 + y^2 = 3',
+        width: 300,
+        height: 300,
+        x: 0,
+        y: 0,
+    },
+    {
+        doc_type: supportedDocumentTypes.collection,
+        title: 'Advanced Biology',
+        data: [
+            {
+                doc_type: supportedDocumentTypes.text,
+                title: 'Cell Structure',
+                data: 'Cells are the basic building blocks of all living organisms.',
+                width: 300,
+                height: 300,
+                x: 500,
+                y: 0,
+            },
+        ],
+        backgroundColor: '#00ff00',
+        width: 600,
+        height: 600,
+        x: 600,
+        y: 0,
+        type_collection: 'tree',
+    },
+    {
+        doc_type: supportedDocumentTypes.image,
+        title: 'experiment',
+        data: 'https://plus.unsplash.com/premium_photo-1694819488591-a43907d1c5cc?q=80&w=2628&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
+        width: 300,
+        height: 300,
+        x: 600,
+        y: 300,
+    },
+    {
+        doc_type: supportedDocumentTypes.deck,
+        title: 'Chemistry',
+        data: [
+            {
+                doc_type: supportedDocumentTypes.flashcard,
+                title: 'Photosynthesis',
+                data: [
+                    {
+                        doc_type: supportedDocumentTypes.text,
+                        title: 'front_Photosynthesis',
+                        data: 'What is photosynthesis?',
+                        width: 300,
+                        height: 300,
+                        x: 100,
+                        y: 600,
+                    },
+                    {
+                        doc_type: supportedDocumentTypes.text,
+                        title: 'back_photosynthesis',
+                        data: 'The process by which plants make food.',
+                        width: 300,
+                        height: 300,
+                        x: 100,
+                        y: 700,
+                    },
+                ],
+                backgroundColor: '#00ff00',
+                width: 300,
+                height: 300,
+                x: 300,
+                y: 1000,
+            },
+            {
+                doc_type: supportedDocumentTypes.flashcard,
+                title: 'Photosynthesis',
+                data: [
+                    {
+                        doc_type: supportedDocumentTypes.text,
+                        title: 'front_Photosynthesis',
+                        data: 'What is photosynthesis?',
+                        width: 300,
+                        height: 300,
+                        x: 200,
+                        y: 800,
+                    },
+                    {
+                        doc_type: supportedDocumentTypes.text,
+                        title: 'back_photosynthesis',
+                        data: 'The process by which plants make food.',
+                        width: 300,
+                        height: 300,
+                        x: 100,
+                        y: -100,
+                    },
+                ],
+                backgroundColor: '#00ff00',
+                width: 300,
+                height: 300,
+                x: 10,
+                y: 70,
+            },
+        ],
+        backgroundColor: '#00ff00',
+        width: 600,
+        height: 600,
+        x: 200,
+        y: 800,
+    },
+    {
+        doc_type: supportedDocumentTypes.web,
+        title: 'Brown University Wikipedia',
+        data: 'https://en.wikipedia.org/wiki/Brown_University',
+        width: 300,
+        height: 300,
+        x: 1000,
+        y: 2000,
+    },
+    {
+        doc_type: supportedDocumentTypes.comparison,
+        title: 'WWI vs. WWII',
+        data: [
+            {
+                doc_type: supportedDocumentTypes.text,
+                title: 'WWI',
+                data: 'From 1914 to 1918, fighting took place across several continents, at sea and, for the first time, in the air.',
+                width: 300,
+                height: 300,
+                x: 100,
+                y: 100,
+            },
+            {
+                doc_type: supportedDocumentTypes.text,
+                title: 'WWII',
+                data: 'A devastating global conflict spanning from 1939 to 1945, saw the Allied powers fight against the Axis powers.',
+                width: 300,
+                height: 300,
+                x: 100,
+                y: 100,
+            },
+        ],
+        width: 300,
+        height: 300,
+        x: 100,
+        y: 100,
+    },
+    {
+        doc_type: supportedDocumentTypes.collection,
+        title: 'Science Collection',
+        data: [
+            {
+                doc_type: supportedDocumentTypes.flashcard,
+                title: 'Photosynthesis',
+                data: [
+                    {
+                        doc_type: supportedDocumentTypes.text,
+                        title: 'front_Photosynthesis',
+                        data: 'What is photosynthesis?',
+                        width: 300,
+                        height: 300,
+                    },
+                    {
+                        doc_type: supportedDocumentTypes.text,
+                        title: 'back_photosynthesis',
+                        data: 'The process by which plants make food.',
+                        width: 300,
+                        height: 300,
+                    },
+                ],
+                backgroundColor: '#00ff00',
+                width: 300,
+                height: 300,
+            },
+            {
+                doc_type: supportedDocumentTypes.web,
+                title: 'Brown University Wikipedia',
+                data: 'https://en.wikipedia.org/wiki/Brown_University',
+                width: 300,
+                height: 300,
+                x: 1100,
+                y: 1100,
+            },
+            {
+                doc_type: supportedDocumentTypes.text,
+                title: 'Water Cycle',
+                data: 'The continuous movement of water on, above, and below the Earth’s surface.',
+                width: 300,
+                height: 300,
+                x: 1500,
+                y: 500,
+            },
+            {
+                doc_type: supportedDocumentTypes.collection,
+                title: 'Advanced Biology',
+                data: [
+                    {
+                        doc_type: 'text',
+                        title: 'Cell Structure',
+                        data: 'Cells are the basic building blocks of all living organisms.',
+                        width: 300,
+                        height: 300,
+                    },
+                ],
+                backgroundColor: '#00ff00',
+                width: 600,
+                height: 600,
+                x: 1100,
+                y: 500,
+                type_collection: 'freeform',
+            },
+        ],
+        width: 600,
+        height: 600,
+        x: 500,
+        y: 500,
+        type_collection: 'freeform',
+    },
+];
+
+// Stringify the entire structure for transmission if needed
+const finalJsonString = JSON.stringify(example);
+
+// Instructions for creating various document types
+const docInstructions: [supportedDocumentTypes, string | { description: string; example: string }][] = [
+    [ supportedDocumentTypes.collection,
+        { description: `A recursive collection of documents as a stringified array. Each document can be a ${Object.keys(supportedDocumentTypes).map(key => '"' + key + '"').join(',')}.`,
+          example: finalJsonString  },
+    ], // prettier-ignore
+    [supportedDocumentTypes.text, 'Provide text content as a plain string. Example: "This is a standalone text document."'],
+    [supportedDocumentTypes.flashcard, 'Two text documents with content for the front and back.'],
+    [supportedDocumentTypes.deck, 'A decks data is an array of flashcards.'],
+    [supportedDocumentTypes.comparison, 'two documents of any kind that can be compared.'],
+    [supportedDocumentTypes.image, `A url string that must end with '.png', '.jpeg', '.gif', or '.jpg'`],
+    [supportedDocumentTypes.web, 'A URL to a webpage. Example: https://en.wikipedia.org/wiki/Brown_University'],
+    [supportedDocumentTypes.equation, 'Create an equation document, not a text document. Data is math equation.'],
+    [supportedDocumentTypes.notetaking, 'Create a noteboard document'],
+    [supportedDocumentTypes.audio, 'A url to an audio recording. Example: '],
+] as const;
+
+// Parameters for creating individual documents
+const createDocToolParams = [
+    {
+        name: 'data',
+        type: 'string', // Accepts either string or array, supporting individual and nested data
+        description:
+            typeof docInstructions === 'string'
+                ? docInstructions
+                : docInstructions.reduce(
+                      (prev, [type, data]) => {
+                          prev[type] = data;
+                          return prev;
+                      },
+                      {} as { [key: string]: string | { description: string; example: string } }
+                  ),
+        required: true,
+    },
+    {
+        name: 'doc_type',
+        type: 'string',
+        description: 'The type of the document. Options: "collection", "text", "flashcard", "web".',
+        required: true,
+    },
+    {
+        name: 'title',
+        type: 'string',
+        description: 'The title of the document.',
+        required: true,
+    },
+    {
+        name: 'x',
+        type: 'number',
+        description: 'The x location of the document; 0 <= x.',
+        required: true,
+    },
+    {
+        name: 'y',
+        type: 'number',
+        description: 'The y location of the document; 0 <= y.',
+        required: true,
+    },
+    {
+        name: 'backgroundColor',
+        type: 'string',
+        description: 'The background color of the document as a hex string.',
+        required: false,
+    },
+    {
+        name: 'fontColor',
+        type: 'string',
+        description: 'The font color of the document as a hex string.',
+        required: false,
+    },
+    {
+        name: 'width',
+        type: 'number',
+        description: 'The width of the document in pixels.',
+        required: true,
+    },
+    {
+        name: 'height',
+        type: 'number',
+        description: 'The height of the document in pixels.',
+        required: true,
+    },
+    {
+        name: 'type_collection',
+        type: 'string',
+        description: 'Either freeform, card, carousel, 3d-carousel, multicolumn, multirow, linear, map, notetaking, schema, stacking, grid, tree, or masonry.',
+        required: false,
+    },
+] as const;
+
+// Parameters for creating a list of documents
+const createListDocToolParams = [
+    {
+        name: 'docs',
+        type: 'string',
+        description:
+            'Array of documents in stringified JSON format. Each item in the array should be an individual stringified JSON object. Each document can be of type "text", "flashcard", "comparison", "web", or "collection" (for nested documents). ' +
+            'Use this structure for nesting collections within collections. Each document should follow the structure in ' +
+            createDocToolParams +
+            '. Example: ' +
+            finalJsonString,
+        required: true,
+    },
+] as const;
+
+type CreateListDocToolParamsType = typeof createListDocToolParams;
+
+type CreateDocumentToolParamsType = typeof createDocToolParams;
+
+const createDocToolInfo: ToolInfo<CreateDocumentToolParamsType> = {
+    name: 'createAnyDocument',
+    description: `Creates one or more documents that best fit the user’s request. 
+              If the user requests a "dashboard," first call the search tool and then generate a variety of document types individually, with absolutely a minimum of 20 documents 
+              with two stacks of flashcards that are small and it should have a couple nested freeform collections of things, each with different content and color schemes.
+               For example, create multiple individual documents like "text," "deck," "web", "equation," and "comparison." 
+               Use decks instead of flashcards for dashboards. Decks should have at least three flashcards. 
+               Really think about what documents are useful to the user. If they ask for a dashboard about the skeletal system, include flashcards, as they would be helpful.  
+               Arrange the documents in a grid layout, ensuring that the x and y coordinates are calculated so no documents overlap but they should be directly next to each other with 20 padding in between. 
+               Take into account the width and height of each document, spacing them appropriately to prevent collisions. 
+               Use a systematic approach, such as placing each document in a grid cell based on its order, where cell dimensions match the document dimensions plus a fixed margin for spacing. 
+               Do not nest all documents within a single collection unless explicitly requested by the user. 
+               Instead, create a set of independent documents with diverse document types. Each type should appear separately unless specified otherwise.
+            Use the "data" parameter for document content and include title, color, and document dimensions. 
+             Ensure web documents use URLs from the search tool if relevant. Each document in a dashboard should be unique and well-differentiated in type and content, 
+             without repetition of similar types in any single collection.
+            When creating a dashboard, ensure that it consists of a broad range of document types. 
+              Include a variety of documents, such as text, web, deck, comparison, image, simulation, and equation documents, 
+                each with distinct titles and colors, following the user’s preferences.
+              Do not overuse collections or nest all document types within a single collection; instead, represent document types individually. Use this example for reference:
+                ${finalJsonString} . 
+              Which documents are created should be random with different numbers of each document type and different for each dashboard. 
+              Must use search tool before creating a dashboard.`,
+    parameterRules: createDocToolParams,
+    citationRules: 'No citation needed.',
+};
+
+// Tool class for creating documents
+export class CreateDocTool extends BaseTool<CreateListDocToolParamsType> {
+    private _addLinkedDoc: (doc: parsedDoc) => void;
+
+    constructor(addLinkedDoc: (doc: parsedDoc) => void) {
+        super(createDocToolInfo);
+        this._addLinkedDoc = addLinkedDoc;
+    }
+
+    // Executes the tool logic for creating documents
+    async execute(args: ParametersType<CreateListDocToolParamsType>): Promise<Observation[]> {
+        try {
+            const parsedDocs = JSON.parse(args.docs) as parsedDoc[];
+            parsedDocs.forEach(doc => this._addLinkedDoc({ ...doc, _layout_fitWidth: false, _layout_autoHeight: true }));
+            return [{ type: 'text', text: 'Created document.' }];
+        } catch (error) {
+            return [{ type: 'text', text: 'Error creating text document, ' + error }];
+        }
+    }
+}
diff --git a/src/client/views/nodes/chatbot/tools/CreateTextDocumentTool.ts b/src/client/views/nodes/chatbot/tools/CreateTextDocumentTool.ts
index 487fc951d..16dc938bb 100644
--- a/src/client/views/nodes/chatbot/tools/CreateTextDocumentTool.ts
+++ b/src/client/views/nodes/chatbot/tools/CreateTextDocumentTool.ts
@@ -1,11 +1,7 @@
-import { v4 as uuidv4 } from 'uuid';
-import { Networking } from '../../../../Network';
-import { BaseTool } from './BaseTool';
-import { Observation } from '../types/types';
+import { parsedDoc } from '../chatboxcomponents/ChatBox';
 import { ParametersType, ToolInfo } from '../types/tool_types';
-import { DocumentOptions } from '../../../../documents/Documents';
-import { RTFCast, StrCast } from '../../../../../fields/Types';
-
+import { Observation } from '../types/types';
+import { BaseTool } from './BaseTool';
 const createTextDocToolParams = [
     {
         name: 'text_content',
@@ -43,17 +39,16 @@ const createTextDocToolInfo: ToolInfo<CreateTextDocToolParamsType> = {
 };
 
 export class CreateTextDocTool extends BaseTool<CreateTextDocToolParamsType> {
-    private _addLinkedDoc: (doc_type: string, data: string, options: DocumentOptions, id: string) => void;
+    private _addLinkedDoc: (doc: parsedDoc) => void;
 
-    constructor(addLinkedDoc: (text_content: string, data: string, options: DocumentOptions, id: string) => void) {
+    constructor(addLinkedDoc: (doc: parsedDoc) => void) {
         super(createTextDocToolInfo);
         this._addLinkedDoc = addLinkedDoc;
     }
 
     async execute(args: ParametersType<CreateTextDocToolParamsType>): Promise<Observation[]> {
         try {
-            console.log(RTFCast(args.text_content));
-            this._addLinkedDoc('text', args.text_content, { title: args.title }, uuidv4());
+            this._addLinkedDoc({ doc_type: 'text', data: args.text_content, title: args.title });
             return [{ type: 'text', text: 'Created text document.' }];
         } catch (error) {
             return [{ type: 'text', text: 'Error creating text document, ' + error }];
diff --git a/src/client/views/nodes/chatbot/tools/ImageCreationTool.ts b/src/client/views/nodes/chatbot/tools/ImageCreationTool.ts
index ba1aa987a..177552c5c 100644
--- a/src/client/views/nodes/chatbot/tools/ImageCreationTool.ts
+++ b/src/client/views/nodes/chatbot/tools/ImageCreationTool.ts
@@ -1,12 +1,10 @@
 import { v4 as uuidv4 } from 'uuid';
+import { RTFCast } from '../../../../../fields/Types';
+import { DocumentOptions } from '../../../../documents/Documents';
 import { Networking } from '../../../../Network';
-import { BaseTool } from './BaseTool';
-import { Observation } from '../types/types';
 import { ParametersType, ToolInfo } from '../types/tool_types';
-import { DocumentOptions } from '../../../../documents/Documents';
-import { ClientUtils } from '../../../../../ClientUtils';
-import { DashUploadUtils } from '../../../../../server/DashUploadUtils';
-import { RTFCast, StrCast } from '../../../../../fields/Types';
+import { Observation } from '../types/types';
+import { BaseTool } from './BaseTool';
 
 const imageCreationToolParams = [
     {
diff --git a/src/client/views/nodes/chatbot/vectorstore/Vectorstore.ts b/src/client/views/nodes/chatbot/vectorstore/Vectorstore.ts
index 5334f7df0..ef24e59bc 100644
--- a/src/client/views/nodes/chatbot/vectorstore/Vectorstore.ts
+++ b/src/client/views/nodes/chatbot/vectorstore/Vectorstore.ts
@@ -9,13 +9,12 @@ import { Index, IndexList, Pinecone, PineconeRecord, QueryResponse, RecordMetada
 import { CohereClient } from 'cohere-ai';
 import { EmbedResponse } from 'cohere-ai/api';
 import dotenv from 'dotenv';
+import path from 'path';
+import { v4 as uuidv4 } from 'uuid';
 import { Doc } from '../../../../../fields/Doc';
-import { AudioCast, Cast, CsvCast, DocCast, PDFCast, StrCast, VideoCast } from '../../../../../fields/Types';
+import { AudioCast, CsvCast, PDFCast, StrCast, VideoCast } from '../../../../../fields/Types';
 import { Networking } from '../../../../Network';
 import { AI_Document, CHUNK_TYPE, RAGChunk } from '../types/types';
-import path from 'path';
-import { v4 as uuidv4 } from 'uuid';
-import { indexes } from 'd3';
 
 dotenv.config();
 
@@ -40,14 +39,14 @@ export class Vectorstore {
      * @param doc_ids A function that returns a list of document IDs.
      */
     constructor(id: string, doc_ids: () => string[]) {
-        const pineconeApiKey = process.env.PINECONE_API_KEY;
+        const pineconeApiKey = '51738e9a-bea2-4c11-b6bf-48a825e774dc';
         if (!pineconeApiKey) {
             throw new Error('PINECONE_API_KEY is not defined.');
         }
 
         // Initialize Pinecone and Cohere clients with API keys from the environment.
         this.pinecone = new Pinecone({ apiKey: pineconeApiKey });
-        this.cohere = new CohereClient({ token: process.env.COHERE_API_KEY });
+        // this.cohere = new CohereClient({ token: process.env.COHERE_API_KEY });
         this._id = id;
         this._doc_ids = doc_ids;
         this.initializeIndex();