aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--package-lock.json44
-rw-r--r--src/client/views/collections/CollectionSchemaCells.tsx4
-rw-r--r--src/client/views/collections/CollectionSchemaView.scss38
-rw-r--r--src/client/views/collections/CollectionSchemaView.tsx108
4 files changed, 52 insertions, 142 deletions
diff --git a/package-lock.json b/package-lock.json
index 6c364530b..735cff1a6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2946,8 +2946,7 @@
},
"ansi-regex": {
"version": "2.1.1",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"aproba": {
"version": "1.2.0",
@@ -2965,13 +2964,11 @@
},
"balanced-match": {
"version": "1.0.0",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
- "optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@@ -2984,18 +2981,15 @@
},
"code-point-at": {
"version": "1.1.0",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"concat-map": {
"version": "0.0.1",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"console-control-strings": {
"version": "1.1.0",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"core-util-is": {
"version": "1.0.2",
@@ -3098,8 +3092,7 @@
},
"inherits": {
"version": "2.0.4",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"ini": {
"version": "1.3.5",
@@ -3109,7 +3102,6 @@
"is-fullwidth-code-point": {
"version": "1.0.0",
"bundled": true,
- "optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@@ -3122,20 +3114,17 @@
"minimatch": {
"version": "3.0.4",
"bundled": true,
- "optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
},
"minimist": {
"version": "1.2.5",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"minipass": {
"version": "2.9.0",
"bundled": true,
- "optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@@ -3152,7 +3141,6 @@
"mkdirp": {
"version": "0.5.3",
"bundled": true,
- "optional": true,
"requires": {
"minimist": "^1.2.5"
}
@@ -3208,8 +3196,7 @@
},
"npm-normalize-package-bin": {
"version": "1.0.1",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"npm-packlist": {
"version": "1.4.8",
@@ -3234,8 +3221,7 @@
},
"number-is-nan": {
"version": "1.0.1",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"object-assign": {
"version": "4.1.1",
@@ -3245,7 +3231,6 @@
"once": {
"version": "1.4.0",
"bundled": true,
- "optional": true,
"requires": {
"wrappy": "1"
}
@@ -3314,8 +3299,7 @@
},
"safe-buffer": {
"version": "5.1.2",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"safer-buffer": {
"version": "2.1.2",
@@ -3345,7 +3329,6 @@
"string-width": {
"version": "1.0.2",
"bundled": true,
- "optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@@ -3363,7 +3346,6 @@
"strip-ansi": {
"version": "3.0.1",
"bundled": true,
- "optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@@ -3402,13 +3384,11 @@
},
"wrappy": {
"version": "1.0.2",
- "bundled": true,
- "optional": true
+ "bundled": true
},
"yallist": {
"version": "3.1.1",
- "bundled": true,
- "optional": true
+ "bundled": true
}
}
}
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 0026ab927..034ba27cf 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -26,15 +26,11 @@ import { SnappingManager } from "../../util/SnappingManager";
import { ComputedField } from "../../../fields/ScriptField";
import { ImageField } from "../../../fields/URLField";
import { List } from "../../../fields/List";
-import { LinkBox } from "../nodes/LinkBox";
import { OverlayView } from "../OverlayView";
import { DocumentIconContainer } from "../nodes/DocumentIcon";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { ContentFittingDocumentView } from "../nodes/ContentFittingDocumentView";
-import ReactDOM from "react-dom";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
-import { DateField } from "../../../fields/DateField";
const path = require('path');
library.add(faExpand);
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
index fa1f01448..2330fcc8a 100644
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -177,6 +177,26 @@
}
+.collectionSchema-header-menu {
+ height: 100%;
+ z-index: 100;
+ position: absolute;
+ background:white;
+
+ .collectionSchema-header-toggler {
+ z-index: 100;
+ width: 100%;
+ height: 100%;
+ padding: 4px;
+ letter-spacing: 2px;
+ text-transform: uppercase;
+
+ svg {
+ margin-right: 4px;
+ }
+ }
+}
+
.collectionSchemaView-header {
height: 100%;
color: gray;
@@ -185,24 +205,6 @@
display: flex;
justify-content: space-between;
flex-wrap: wrap;
-
- .collectionSchema-header-menu {
- height: 100%;
- z-index: 100;
-
- .collectionSchema-header-toggler {
- z-index: 100;
- width: 100%;
- height: 100%;
- padding: 4px;
- letter-spacing: 2px;
- text-transform: uppercase;
-
- svg {
- margin-right: 4px;
- }
- }
- }
}
button.add-column {
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index 7e8455149..857d8cb50 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -11,7 +11,6 @@ import { List } from "../../../fields/List";
import { listSpec } from "../../../fields/Schema";
import { SchemaHeaderField, PastelSchemaPalette } from "../../../fields/SchemaHeaderField";
import { Cast, NumCast, StrCast } from "../../../fields/Types";
-import { Docs, DocumentOptions } from "../../documents/Documents";
import { Transform } from "../../util/Transform";
import { undoBatch } from "../../util/UndoManager";
import { COLLECTION_BORDER_WIDTH } from '../../views/globalCssVariables.scss';
@@ -23,8 +22,8 @@ import { ContentFittingDocumentView } from "../nodes/ContentFittingDocumentView"
import { setupMoveUpEvents, emptyFunction, returnZero, returnOne, returnFalse } from "../../../Utils";
import { SnappingManager } from "../../util/SnappingManager";
import Measure from "react-measure";
-import { SchemaTable } from "./SchemaTable";
-import { civicinfo } from "googleapis/build/src/apis/civicinfo";
+import { SchemaTable } from "./SchemaTable"
+import { TraceMobx } from "../../../fields/util";
library.add(faCog, faPlus, faSortUp, faSortDown);
library.add(faTable);
@@ -185,7 +184,6 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
this._openTypes = bool;
}
- @action
renderTypes = (col: any) => {
if (columnTypes.get(col.heading)) return (null);
@@ -353,29 +351,6 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
/>;
}
- @action
- renderContent = (col: any) => {
- return (
- <div className="collectionSchema-header-menuOptions">
- <div className="collectionSchema-headerMenu-group">
- <label>Key:</label>
- {this.renderKeysDropDown(col)}
- </div>
- {false ? <></> :
- <>
- {this.renderTypes(col)}
- {this.renderSorting(col)}
- {this.renderColors(col)}
- <div className="collectionSchema-headerMenu-group">
- <button onClick={() => { this.deleteColumn(col.heading); }}
- >Delete Column</button>
- </div>
- </>
- }
- </div>
- );
- }
-
@undoBatch
@action
deleteColumn = (key: string) => {
@@ -410,45 +385,22 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
//this.menuCoordinates[1] -= e.screenY / scale;
}
- @action renderMenu() {
- const scale = this.props.ScreenToLocalTransform().Scale;
- return (
- <div className="collectionSchema-header-menu" ref={this.setNode}
- onWheel={e => this.props.active(true) && e.stopPropagation()}
- onPointerDown={e => this.onHeaderClick(e)}
- style={{
- position: "absolute", background: "white",
- transform: `translate(${this.menuCoordinates[0] * scale}px, ${this.menuCoordinates[1] / scale}px)`
- }}>
- <Measure offset onResize={action((r: any) => {
- const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
- this._menuWidth = dim[0]; this._menuHeight = dim[1];
- })}>
- {({ measureRef }) => <div ref={measureRef}>
- <div className="collectionSchema-header-menuOptions">
- <div className="collectionSchema-headerMenu-group">
- <label>Key:</label>
- {this.renderKeysDropDown(this._col)}
- </div>
- {false ? <></> :
- <>
- {this.renderTypes(this._col)}
- {this.renderSorting(this._col)}
- {this.renderColors(this._col)}
- <div className="collectionSchema-headerMenu-group">
- <button onClick={() => { this.deleteColumn(this._col.heading); }}
- >Delete Column</button>
- </div>
- </>
- }
- </div>
-
- </div>}
- </Measure>
+ @computed get renderMenuContent() {
+ TraceMobx();
+ return <div className="collectionSchema-header-menuOptions">
+ <div className="collectionSchema-headerMenu-group">
+ <label>Key:</label>
+ {this.renderKeysDropDown(this._col)}
</div>
- );
+ {this.renderTypes(this._col)}
+ {this.renderSorting(this._col)}
+ {this.renderColors(this._col)}
+ <div className="collectionSchema-headerMenu-group">
+ <button onClick={() => { this.deleteColumn(this._col.heading); }}
+ >Delete Column</button>
+ </div>
+ </div>;
}
-
private createTarget = (ele: HTMLDivElement) => {
this._previewCont = ele;
super.CreateDropTarget(ele);
@@ -623,38 +575,18 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
}
render() {
+ TraceMobx();
+ const menuContent = this.renderMenuContent;
const scale = this.props.ScreenToLocalTransform().Scale;
const menu = <div className="collectionSchema-header-menu" ref={this.setNode}
onWheel={e => this.props.active(true) && e.stopPropagation()}
onPointerDown={e => this.onHeaderClick(e)}
- style={{
- position: "absolute", background: "white",
- transform: `translate(${this.menuCoordinates[0] * scale}px, ${this.menuCoordinates[1] / scale}px)`
- }}>
+ style={{ transform: `translate(${this.menuCoordinates[0] * scale}px, ${this.menuCoordinates[1] / scale}px)` }}>
<Measure offset onResize={action((r: any) => {
const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
this._menuWidth = dim[0]; this._menuHeight = dim[1];
})}>
- {({ measureRef }) => <div ref={measureRef}>
- <div className="collectionSchema-header-menuOptions">
- <div className="collectionSchema-headerMenu-group">
- <label>Key:</label>
- {this.renderKeysDropDown(this._col)}
- </div>
- {false ? <></> :
- <>
- {this.renderTypes(this._col)}
- {this.renderSorting(this._col)}
- {this.renderColors(this._col)}
- <div className="collectionSchema-headerMenu-group">
- <button onClick={() => { this.deleteColumn(this._col.heading); }}
- >Delete Column</button>
- </div>
- </>
- }
- </div>
-
- </div>}
+ {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
</Measure>
</div>;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 10:11:51 +0000