diff options
Diffstat (limited to 'src')
7 files changed, 16 insertions, 130 deletions
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx index 12c342b9f..59ccec71f 100644 --- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx +++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx @@ -46,7 +46,6 @@ import { SchemaCellField } from './SchemaCellField'; import { threadId } from 'worker_threads'; import { FontIconBox } from '../../nodes/FontIconBox/FontIconBox'; -// eslint-disable-next-line @typescript-eslint/no-var-requires const { SCHEMA_NEW_NODE_HEIGHT } = require('../../global/globalCssVariables.module.scss'); // prettier-ignore export const FInfotoColType: { [key: string]: ColumnType } = { @@ -1539,4 +1538,4 @@ class CollectionSchemaViewDocs extends React.Component<CollectionSchemaViewDocsP </div> ); } -} +}
\ No newline at end of file diff --git a/src/client/views/collections/collectionSchema/SchemaCellField.tsx b/src/client/views/collections/collectionSchema/SchemaCellField.tsx index 3be9167fe..e1059b8fc 100644 --- a/src/client/views/collections/collectionSchema/SchemaCellField.tsx +++ b/src/client/views/collections/collectionSchema/SchemaCellField.tsx @@ -8,15 +8,6 @@ import { FieldView, FieldViewProps } from "../../nodes/FieldView"; import { ObjectField } from "../../../../fields/ObjectField"; import { Doc } from "../../../../fields/Doc"; import { DocumentView } from "../../nodes/DocumentView"; -import { date } from "serializr"; -import { createRoot } from "react-dom/client"; -import DatePicker from "react-datepicker"; -import { emptyFunction } from "../../../../Utils"; -import { DateField } from "../../../../fields/DateField"; - -enum EleType { - plainText, fieldReference, date, boolean -} export interface SchemaCellFieldProps { contents: any; @@ -43,7 +34,6 @@ export class SchemaCellField extends ObservableReactComponent<SchemaCellFieldPro @observable _displayedContent = ''; @observable _inCellSelectMode: boolean = false; @observable _dependencyMessageShown: boolean = false; - @observable _displayedElements: JSX.Element[] = []; constructor(props: SchemaCellFieldProps) { super(props); @@ -126,32 +116,12 @@ export class SchemaCellField extends ObservableReactComponent<SchemaCellFieldPro this.finalizeEdit(false, true, false); } - // addReactComponents = () => { - // if (!this._inputref) return; - - // const dateRefs = Array.from(this._inputref.querySelectorAll('.date-placeholder')); - - // dateRefs.forEach(ref => { - // const root = createRoot(ref); - // root.render(<DatePicker dateFormat="Pp" selected={new Date} onChange={emptyFunction} />); - // }) - // } - - generateSpan = (text: string, cell: HTMLDivElement | undefined): JSX.Element => { + generateSpan = (text: string, cell: HTMLDivElement | undefined) => { const selfRef = text === this.selfRefPattern; - const color: string | undefined = cell?.style.borderTop.replace('2px solid', ''); - return ( - <span style={{ - textDecoration: selfRef ? 'underline' : 'none', - textDecorationColor: 'red', - color: selfRef ? 'gray' : color}}> - {text} - </span> - ); + return `<span style="text-decoration: ${selfRef ? 'underline' : 'none'}; text-decoration-color: red; color: ${selfRef ? 'gray' : cell?.style.borderTop.replace('2px solid', '')}">${text}</span>`; } makeSpans = (content: string) => { - const spans: JSX.Element[] = []; let chunkedText = content; const pattern = /(this|d(\d+))\.(\w+)/g; @@ -170,93 +140,17 @@ export class SchemaCellField extends ObservableReactComponent<SchemaCellFieldPro let matchNum = 0; matches.forEach((match: string) => { - chunkedText = chunkedText.replace(match, ''); - spans.push(this.generateSpan(match, cells.get(match))); + chunkedText = chunkedText.replace(match, this.generateSpan(match, cells.get(match))); ++matchNum; }) - chunkedText = chunkedText.replace(/{{date}}/g, `<span class="date-placeholder">placeholder text</span>`); - return chunkedText; } - verifyCellRef = (text: string): [string, HTMLDivElement | undefined] | undefined => { - const pattern = /(this|d(\d+))\.(\w+)/g; - let matchedText: string = ''; - let matchedCell: HTMLDivElement | undefined = undefined; - let match: RegExpExecArray | null; - - while ((match = pattern.exec(text)) !== null) { - const cells = this._props.getCells(match[0]); - if (cells.length) { - matchedText = match[0]; - matchedCell = cells[0]; - } - } - - if (!matchedText && !matchedCell) return undefined; - else return [matchedText, matchedCell]; - } - - elementsFromText = (chunks: string[]): JSX.Element[] => { - const eles: any[] = []; - - chunks.forEach(text => { - const cellRef = this.verifyCellRef(text); - if (cellRef) { - eles.push(this.generateSpan(cellRef[0], cellRef[1])); - } else if (text && !text.replace('{{date}}', '')){ - eles.push(<DatePicker dateFormat="Pp" selected={new Date()} onChange={emptyFunction} />); - } else if (text && !text.replace('{{boolean}}', '')) { - eles.push(<span>boolean thing</span>); - } else { - eles.push(<span>{text}</span>); - } - }); - - return eles; - } - - parseElements = (content: string) => { - let string: string = content; - if (string.startsWith(':')) string = string.slice(1); - if (string.startsWith('=')) string = string.slice(1); - - const chunks: string[] = []; - - let subStr: string = ''; - let currChar = ''; - for (let i = 0; i < string.length; i++){ - currChar = string[i]; - if (((string.charCodeAt(i) === 32 || string.charCodeAt(i) === 160) && subStr.trim()) || (currChar !== ' ' && !subStr.trim())) { - chunks.push(subStr); - subStr = currChar; - } else { - subStr += currChar; - } - } - - if (subStr) {chunks.push(subStr)}; - - return this.elementsFromText(chunks); - } - - // `<input - // style={{ marginRight: 4 }} - // type="checkbox" - // checked={BoolCast(this._props.Document[this._props.fieldKey])} - // onChange={undoBatch((value: React.ChangeEvent<HTMLInputElement> | undefined) => { - // if ((value?.nativeEvent as any).shiftKey) { - // this._props.setColumnValues(this._props.fieldKey.replace(/^_/, ''), (color === 'black' ? '=' : '') + (value?.target?.checked.toString() ?? '')); - // } else Doc.SetField(this._props.Document, this._props.fieldKey.replace(/^_/, ''), (color === 'black' ? '=' : '') + (value?.target?.checked.toString() ?? '')); - // })} - // />` - @action setContent = (content: string, restoreCursorPos?: boolean) => { const pos = this.cursorPosition; - this._displayedContent = content; - this._displayedElements = this.parseElements(content); + this._displayedContent = this.makeSpans(content); restoreCursorPos && setTimeout(() => this.setCursorPosition(pos)); } @@ -339,9 +233,8 @@ export class SchemaCellField extends ObservableReactComponent<SchemaCellFieldPro } this._unrenderedContent = targVal; this._props.highlightCells?.(targVal); - if (this.parseElements(targVal).length > this.parseElements(this._displayedContent).length) this.setContent(targVal, true); + if (this.shouldUpdate(prevVal, targVal)) {this.setContent(targVal, true)}; this.setupRefSelect(this.refSelectConditionMet); - console.log(this.parseElements(targVal)); }; setupRefSelect = (enabled: boolean) => { @@ -458,12 +351,8 @@ export class SchemaCellField extends ObservableReactComponent<SchemaCellFieldPro onClick={e => e.stopPropagation} onPointerUp={e => e.stopPropagation} onPointerMove={e => {e.stopPropagation(); e.preventDefault()}} - suppressContentEditableWarning={true} - //dangerouslySetInnerHTML={{ __html: this._displayedContent }} + dangerouslySetInnerHTML={{ __html: this._displayedContent }} > - {this._displayedElements.map((ele, index) => { - return <span key={index}>{ele}</span>; - })} </div> ); } diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx index 40509c41b..9f6478041 100644 --- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx +++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx @@ -249,4 +249,4 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea </div> ); } -} +}
\ No newline at end of file diff --git a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx index 72f5d8c25..ec94a8077 100644 --- a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx +++ b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx @@ -24,7 +24,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { IconProp } from '@fortawesome/fontawesome-svg-core'; import { infoState } from '../collectionFreeForm/CollectionFreeFormInfoState'; import { TbShieldX } from 'react-icons/tb'; -import { DocumentType } from '../../../documents/DocumentTypes'; interface SchemaRowBoxProps extends FieldViewProps { rowIndex: number; @@ -78,7 +77,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<SchemaRowBoxProps>() { icon: 'minus', }); const childDocs = DocListCast(this.Document[Doc.LayoutFieldKey(this.Document)]) - if (childDocs.length) { + if (this.Document.type === 'collection' && childDocs.length) { ContextMenu.Instance.addItem({ description: this.Document._childrenSharedWithSchema ? 'Remove children from schema' : 'Add children to schema', event: () => { @@ -197,4 +196,4 @@ export class SchemaRowBox extends ViewBoxBaseComponent<SchemaRowBoxProps>() { </div> ); } -} +}
\ No newline at end of file diff --git a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx index 7d29e40cc..e2a05da7f 100644 --- a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx +++ b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx @@ -389,7 +389,7 @@ export class SchemaDateCell extends ObservableReactComponent<SchemaTableCellProp const { pointerEvents } = SchemaTableCell.renderProps(this._props); return ( <> - <div style={{ pointerEvents: 'none'}}> + <div style={{ pointerEvents: 'none' }}> <DatePicker dateFormat="Pp" selected={this.date?.date ?? Date.now()} onChange={emptyFunction} /> </div> {pointerEvents === 'none' ? null : ( diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx index dcdd52c73..8273f3e09 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx @@ -375,7 +375,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { if (res && this._callCount === origCount) { this._suggestedTemplates = []; - this._GPTLoading = false; const templates: {template_type: string, fieldVals: {title: string, tlx: string, tly: string, brx: string, bry: string}[]}[] = JSON.parse(res); this.createGeneratedTemplates(templates, 500, 500); } @@ -714,7 +713,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { try { const renderedImages: Doc[] = 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. ONLY INCLUDE THE PROMPT, NO OTHER TEXT OR EXPLANATION. The existing content is as follows: ' + fieldContent + ' **** The user prompt is: ' + col.desc; + 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); console.log(sysPrompt, prompt); @@ -852,7 +851,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { const res = await gptAPICall(prompt, GPTCallType.TEMPLATE); if (res && this._callCount === origCount) { - this._GPTLoading = false; const assignments: {[templateTitle: string]: {[field: string]: string}} = JSON.parse(res); const brokenDownAssignments: [TemplateDocInfos, {[field: number]: Col}][] = []; @@ -889,7 +887,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { const renderedTemplates: Doc[] = await Promise.all(renderedTemplatePromises); - setTimeout(() => { this.setGSuggestedTemplates(renderedTemplates) }); + setTimeout(() => { this.setGSuggestedTemplates(renderedTemplates); this._GPTLoading = false }); }; @action setExpandedView = (info: {icon: ImageField, doc: Doc} | undefined) => { @@ -908,6 +906,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { <div className={`docCreatorMenu-templates-view`}> {this._expandedPreview ? <div className='docCreatorMenu-expanded-template-preview'> + <img className='docCreatorMenu-preview-image expanded' src={this._expandedPreview.icon!.url.href.replace(".png", "_o.png")} /> <div className='right-buttons-panel'> <button className='docCreatorMenu-menu-button section-reveal-options top-right' onPointerDown={e => this.setUpButtonClick(e, () => this.setExpandedView(undefined))}> <FontAwesomeIcon icon='minimize'/> @@ -1618,7 +1617,7 @@ export class FieldFuncs { _rotation: opts.rotation, }); - //setTimeout(() => {console.log('called', RichTextMenu.Instance), RichTextMenu.Instance?.setFontField('#4CE4D4', 'fontColor')}, 2000); + docWithBasicOpts._layout_hideScroll = true; return docWithBasicOpts; } diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 54e6c0add..e091657a8 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -2100,7 +2100,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB }} style={{ width: this.noSidebar ? '100%' : `calc(100% - ${this.layout_sidebarWidthPercent})`, - overflow: this.layoutDoc._createDocOnCR ? 'hidden' : this.layoutDoc._layout_autoHeight ? 'visible' : undefined, + overflow: this.layoutDoc._createDocOnCR || this.layoutDoc._layout_hideScroll ? 'hidden' : this.layout_autoHeight ? 'visible' : undefined, }} onScroll={this.onScroll} onDrop={this.ondrop}> |