diff options
Diffstat (limited to 'src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx')
| -rw-r--r-- | src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx | 140 |
1 files changed, 71 insertions, 69 deletions
diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx index dad0c214b..b498a4850 100644 --- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx +++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx @@ -3,15 +3,26 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { action, computed, observable } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; -import { returnEmptyDoclist, returnEmptyFilter, returnFalse, setupMoveUpEvents } from '../../../../ClientUtils'; +import { returnEmptyDoclist, returnEmptyFilter, returnFalse, returnZero, setupMoveUpEvents } from '../../../../ClientUtils'; import { emptyFunction } from '../../../../Utils'; import { Colors } from '../../global/globalEnums'; import './CollectionSchemaView.scss'; import { EditableView } from '../../EditableView'; import { DefaultStyleProvider, returnEmptyDocViewList } from '../../StyleProvider'; import { FieldViewProps } from '../../nodes/FieldView'; +import { Doc, Field } from '../../../../fields/Doc'; +import { dropActionType } from '../../../util/DropActionTypes'; +import { Transform } from 'prosemirror-transform'; +import { SchemaTableCell } from './SchemaTableCell'; +import { DocCast } from '../../../../fields/Types'; +import { computedFn } from 'mobx-utils'; +import { CollectionSchemaView } from './CollectionSchemaView'; +import { SnappingManager } from '../../../util/SnappingManager'; +import { undoable } from '../../../util/UndoManager'; +import { FInfo } from '../../../documents/Documents'; export interface SchemaColumnHeaderProps { + Document: Doc; autoFocus?: boolean; oneLine?: boolean; // whether all input should fit on one line vs allowing textare multiline inputs allowCRs?: boolean; // allow carriage returns in text input (othewrise CR ends the edit) @@ -20,6 +31,8 @@ export interface SchemaColumnHeaderProps { columnIndex: number; sortField: string; sortDesc: boolean; + schemaView: CollectionSchemaView; + //cleanupField: (s: string) => string; isContentActive: (outsideReaction?: boolean | undefined) => boolean | undefined; setSort: (field: string | undefined, desc?: boolean) => void; removeColumn: (index: number) => void; @@ -28,6 +41,10 @@ export interface SchemaColumnHeaderProps { dragColumn: (e: any, index: number) => boolean; openContextMenu: (x: number, y: number, index: number) => void; setColRef: (index: number, ref: HTMLDivElement) => void; + rootSelected?: () => boolean; + columnWidth: () => number; + finishEdit?: () => void; // notify container that edit is over (eg. to hide view in DashFieldView) + //transform: () => Transform; } @observer @@ -39,6 +56,9 @@ export class SchemaColumnHeader extends React.Component<SchemaColumnHeaderProps> return this.props.columnKeys[this.props.columnIndex]; } + // getFinfo = computedFn((fieldKey: string) => this.props.schemaView?.fieldInfos.get(fieldKey)); + // setColumnValues = (field: string, value: string) => this.props.schemaView?.setColumnValues(field, value); + @action sortClicked = (e: React.PointerEvent) => { e.stopPropagation(); @@ -57,76 +77,58 @@ export class SchemaColumnHeader extends React.Component<SchemaColumnHeaderProps> this.props.isContentActive(true) && setupMoveUpEvents(this, e, moveEv => this.props.dragColumn(moveEv, this.props.columnIndex), emptyFunction, emptyFunction); }; - public static renderProps(props: SchemaColumnHeaderProps) { - const { Document, fieldKey, getFinfo, columnWidth, isContentActive } = props; - let protoCount = 0; - let doc: Doc | undefined = Document; - while (doc) { - if (Object.keys(doc).includes(fieldKey.replace(/^_/, ''))) { - break; - } - protoCount++; - doc = DocCast(doc.proto); - } - const parenCount = Math.max(0, protoCount - 1); - const color = protoCount === 0 || (fieldKey.startsWith('_') && Document[fieldKey] === undefined) ? 'black' : 'blue'; // color of text in cells - const textDecoration = color !== 'black' && parenCount ? 'underline' : ''; - const fieldProps: FieldViewProps = { - childFilters: returnEmptyFilter, - childFiltersByRanges: returnEmptyFilter, - docViewPath: returnEmptyDocViewList, - searchFilterDocs: returnEmptyDoclist, - styleProvider: DefaultStyleProvider, - isSelected: returnFalse, - setHeight: returnFalse, - select: emptyFunction, - dragAction: dropActionType.move, - renderDepth: 1, - noSidebar: true, - isContentActive: returnFalse, - whenChildContentsActiveChanged: emptyFunction, - ScreenToLocalTransform: Transform.Identity, - focus: emptyFunction, - addDocTab: SchemaTableCell.addFieldDoc, - pinToPres: returnZero, - Document: DocCast(Document.rootDocument, Document), - fieldKey: fieldKey, - PanelWidth: columnWidth, - PanelHeight: props.rowHeight, - rootSelected: props.rootSelected, - }; - const readOnly = getFinfo(fieldKey)?.readOnly ?? false; - const cursor = !readOnly ? 'text' : 'default'; - const pointerEvents = 'all'; - return { color, textDecoration, fieldProps, cursor, pointerEvents }; - } - - @computed get editableView() { - const { color, textDecoration, fieldProps, pointerEvents } = SchemaColumnHeader.renderProps(this.props); - - return <EditableView + // public static renderProps(props: SchemaColumnHeaderProps) { + // const { columnKeys, columnWidth, isContentActive, Document } = props; + // const fieldKey = columnKeys[props.columnIndex]; + // const color = 'black'; // color of text in cells + // const fieldProps: FieldViewProps = { + // childFilters: returnEmptyFilter, + // childFiltersByRanges: returnEmptyFilter, + // docViewPath: returnEmptyDocViewList, + // searchFilterDocs: returnEmptyDoclist, + // styleProvider: DefaultStyleProvider, + // isSelected: returnFalse, + // setHeight: returnFalse, + // select: emptyFunction, + // dragAction: dropActionType.move, + // renderDepth: 1, + // noSidebar: true, + // isContentActive: returnFalse, + // whenChildContentsActiveChanged: emptyFunction, + // ScreenToLocalTransform: Transform.Identity, + // focus: emptyFunction, + // addDocTab: SchemaTableCell.addFieldDoc, + // pinToPres: returnZero, + // Document: DocCast(Document.rootDocument, Document), + // fieldKey: fieldKey, + // PanelWidth: columnWidth, + // PanelHeight: props.rowHeight, + // rootSelected: props.rootSelected, + // }; + // const readOnly = getFinfo(fieldKey)?.readOnly ?? false; + // const cursor = !readOnly ? 'text' : 'default'; + // const pointerEvents = 'all'; + // return { color, fieldProps, cursor, pointerEvents }; + // } + // @computed get editableView() { + // const { color, fieldProps, pointerEvents } = SchemaColumnHeader.renderProps(this.props); - ref={r => this.props.autoFocus && r?.setIsFocused(true)} - oneLine={this.props.oneLine} - allowCRs={this.props.allowCRs} - contents={undefined} - fieldContents={fieldProps} - editing={this._editing ? undefined : false} - GetValue={() => this._props.cleanupField(Field.toKeyValueString(fieldProps.Document, this._props.fieldKey, SnappingManager.MetaKey)).replace(/[";]/g, '')} //TODO: feed this into parser that handles idToDoc - SetValue={undoable((value: string, shiftDown?: boolean, enterKey?: boolean) => { - if (shiftDown && enterKey) { - this._props.setColumnValues(this._props.fieldKey.replace(/^_/, ''), value); - this._props.finishEdit?.(); - return true; - } - const hasNoLayout = Doc.IsDataProto(fieldProps.Document) ? true : undefined; // the "delegate" is a a data document so never write to it's proto - const ret = Doc.SetField(fieldProps.Document, this._props.fieldKey.replace(/^_/, ''), value, hasNoLayout); - this._props.finishEdit?.(); - return ret; - }, 'edit schema cell')} - /> - } + // return <EditableView + // ref={r => this.props.autoFocus && r?.setIsFocused(true)} + // oneLine={this.props.oneLine} + // allowCRs={this.props.allowCRs} + // contents={undefined} + // fieldContents={fieldProps} + // editing={this._editing ? undefined : false} + // GetValue={() => this.props.cleanupField(Field.toKeyValueString(fieldProps.Document, this.fieldKey, SnappingManager.MetaKey)).replace(/[";]/g, '')} //TODO: feed this into parser that handles idToDoc + // SetValue={undoable((value: string, enterKey?: boolean) => { + // if (enterKey) this.setColumnValues(this.fieldKey.replace(/^_/, ''), value); + // this.props.finishEdit?.(); + // return true; + // }, 'edit schema cell')} + // /> + // } render() { return ( |