aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections/KeyRestrictionRow.tsx
diff options
context:
space:
mode:
authorEleanor Eng <eleanor_eng@brown.edu>2019-08-06 10:54:33 -0400
committerEleanor Eng <eleanor_eng@brown.edu>2019-08-06 10:54:33 -0400
commitb7194d88ba9733413063c7f371dedefd3a97e35f (patch)
tree418203fe1ee1f4aa0771c555ab672541cc775473 /src/client/views/collections/KeyRestrictionRow.tsx
parent2c4440be2807b3b1da691ea04b061c35e50ecb72 (diff)
parent298d1c9b29d6ce2171fd9ac8274b64583b73f6f5 (diff)
merge with master
Diffstat (limited to 'src/client/views/collections/KeyRestrictionRow.tsx')
-rw-r--r--src/client/views/collections/KeyRestrictionRow.tsx55
1 files changed, 55 insertions, 0 deletions
diff --git a/src/client/views/collections/KeyRestrictionRow.tsx b/src/client/views/collections/KeyRestrictionRow.tsx
new file mode 100644
index 000000000..1b59547d8
--- /dev/null
+++ b/src/client/views/collections/KeyRestrictionRow.tsx
@@ -0,0 +1,55 @@
+import * as React from "react";
+import { observable, runInAction } from "mobx";
+import { observer } from "mobx-react";
+import { PastelSchemaPalette } from "../../../new_fields/SchemaHeaderField";
+import { Doc } from "../../../new_fields/Doc";
+
+interface IKeyRestrictionProps {
+ contains: boolean;
+ script: (value: string) => void;
+}
+
+@observer
+export default class KeyRestrictionRow extends React.Component<IKeyRestrictionProps> {
+ @observable private _key = "";
+ @observable private _value = "";
+ @observable private _contains = this.props.contains;
+
+ render() {
+ if (this._key && this._value) {
+ let parsedValue: string | number = `"${this._value}"`;
+ let parsed = parseInt(this._value);
+ let type = "string";
+ if (!isNaN(parsed)) {
+ parsedValue = parsed;
+ type = "number";
+ }
+ let scriptText = `${this._contains ? "" : "!"}(((doc.${this._key} && (doc.${this._key} as ${type})${type === "string" ? ".includes" : "<="}(${parsedValue}))) ||
+ ((doc.data_ext && doc.data_ext.${this._key}) && (doc.data_ext.${this._key} as ${type})${type === "string" ? ".includes" : "<="}(${parsedValue}))))`;
+ // let doc = new Doc();
+ // ((doc.data_ext && doc.data_ext!.text) && (doc.data_ext!.text as string).includes("hello"));
+ this.props.script(scriptText);
+ }
+ else {
+ this.props.script("");
+ }
+
+ return (
+ <div className="collectionViewBaseChrome-viewSpecsMenu-row">
+ <input className="collectionViewBaseChrome-viewSpecsMenu-rowLeft"
+ value={this._key}
+ onChange={(e) => runInAction(() => this._key = e.target.value)}
+ placeholder="KEY" />
+ <button className="collectionViewBaseChrome-viewSpecsMenu-rowMiddle"
+ style={{ background: this._contains ? "#77dd77" : "#ff6961" }}
+ onClick={() => runInAction(() => this._contains = !this._contains)}>
+ {this._contains ? "CONTAINS" : "DOES NOT CONTAIN"}
+ </button>
+ <input className="collectionViewBaseChrome-viewSpecsMenu-rowRight"
+ value={this._value}
+ onChange={(e) => runInAction(() => this._value = e.target.value)}
+ placeholder="VALUE" />
+ </div>
+ );
+ }
+} \ No newline at end of file