From fca16fb81f470b43c72c1e24e530fdf66430dc7a Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Fri, 26 Apr 2019 21:41:16 -0400
Subject: KVP stuff

---
 src/client/views/nodes/KeyValuePair.tsx | 59 ++++++++++++---------------------
 1 file changed, 21 insertions(+), 38 deletions(-)

(limited to 'src/client/views/nodes/KeyValuePair.tsx')

diff --git a/src/client/views/nodes/KeyValuePair.tsx b/src/client/views/nodes/KeyValuePair.tsx
index d480eb5af..235792cbe 100644
--- a/src/client/views/nodes/KeyValuePair.tsx
+++ b/src/client/views/nodes/KeyValuePair.tsx
@@ -1,48 +1,33 @@
 import { action, observable } from 'mobx';
 import { observer } from "mobx-react";
 import 'react-image-lightbox/style.css'; // This only needs to be imported once in your app
-import { Document } from '../../../fields/Document';
-import { Field, Opt } from '../../../fields/Field';
-import { Key } from '../../../fields/Key';
-import { emptyDocFunction, emptyFunction, returnFalse } from '../../../Utils';
-import { Server } from "../../Server";
-import { CompileScript, ToField } from "../../util/Scripting";
+import { emptyFunction, returnFalse, returnZero } from '../../../Utils';
+import { CompileScript } from "../../util/Scripting";
 import { Transform } from '../../util/Transform';
 import { EditableView } from "../EditableView";
 import { FieldView, FieldViewProps } from './FieldView';
 import "./KeyValueBox.scss";
 import "./KeyValuePair.scss";
 import React = require("react");
+import { Doc, Opt, IsField } from '../../../new_fields/Doc';
+import { FieldValue } from '../../../new_fields/Types';
 
 // Represents one row in a key value plane
 
 export interface KeyValuePairProps {
     rowStyle: string;
-    fieldId: string;
-    doc: Document;
+    keyName: string;
+    doc: Doc;
     keyWidth: number;
 }
 @observer
 export class KeyValuePair extends React.Component<KeyValuePairProps> {
 
-    @observable private key: Opt<Key>;
-
-    constructor(props: KeyValuePairProps) {
-        super(props);
-        Server.GetField(this.props.fieldId,
-            action((field: Opt<Field>) => field instanceof Key && (this.key = field)));
-
-    }
-
-
     render() {
-        if (!this.key) {
-            return <tr><td>error</td><td /></tr>;
-        }
         let props: FieldViewProps = {
             Document: this.props.doc,
             ContainingCollectionView: undefined,
-            fieldKey: this.key,
+            fieldKey: this.props.keyName,
             isSelected: returnFalse,
             select: emptyFunction,
             isTopMost: false,
@@ -50,7 +35,9 @@ export class KeyValuePair extends React.Component<KeyValuePairProps> {
             active: returnFalse,
             whenActiveChanged: emptyFunction,
             ScreenToLocalTransform: Transform.Identity,
-            focus: emptyDocFunction,
+            focus: emptyFunction,
+            PanelWidth: returnZero,
+            PanelHeight: returnZero,
         };
         let contents = <FieldView {...props} />;
         return (
@@ -58,21 +45,23 @@ export class KeyValuePair extends React.Component<KeyValuePairProps> {
                 <td className="keyValuePair-td-key" style={{ width: `${this.props.keyWidth}%` }}>
                     <div className="keyValuePair-td-key-container">
                         <button className="keyValuePair-td-key-delete" onClick={() => {
-                            let field = props.Document.Get(props.fieldKey);
-                            field && field instanceof Field && props.Document.Set(props.fieldKey, undefined);
+                            let field = FieldValue(props.Document[props.fieldKey]);
+                            field && (props.Document[props.fieldKey] = undefined);
                         }}>
                             X
                         </button>
-                        <div className="keyValuePair-keyField">{this.key.Name}</div>
+                        <div className="keyValuePair-keyField">{this.props.keyName}</div>
                     </div>
                 </td>
                 <td className="keyValuePair-td-value" style={{ width: `${100 - this.props.keyWidth}%` }}>
                     <EditableView contents={contents} height={36} GetValue={() => {
-                        let field = props.Document.Get(props.fieldKey);
-                        if (field && field instanceof Field) {
-                            return field.ToScriptString();
+                        let field = FieldValue(props.Document[props.fieldKey]);
+                        if (field) {
+                            //TODO Types
+                            return String(field);
+                            // return field.ToScriptString();
                         }
-                        return field || "";
+                        return "";
                     }}
                         SetValue={(value: string) => {
                             let script = CompileScript(value, { addReturn: true });
@@ -82,15 +71,9 @@ export class KeyValuePair extends React.Component<KeyValuePairProps> {
                             let res = script.run();
                             if (!res.success) return false;
                             const field = res.result;
-                            if (field instanceof Field) {
-                                props.Document.Set(props.fieldKey, field);
+                            if (IsField(field)) {
+                                props.Document[props.fieldKey] = field;
                                 return true;
-                            } else {
-                                let dataField = ToField(field);
-                                if (dataField) {
-                                    props.Document.Set(props.fieldKey, dataField);
-                                    return true;
-                                }
                             }
                             return false;
                         }}>
-- 
cgit v1.2.3-70-g09d2

