From 3c71a4b9c727f8eee8631b46b28c010682608f13 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Sat, 16 Feb 2019 07:46:55 -0500 Subject: Fixed server and added a field debug viewer --- src/debug/Viewer.tsx | 192 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 192 insertions(+) create mode 100644 src/debug/Viewer.tsx (limited to 'src/debug/Viewer.tsx') diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx new file mode 100644 index 000000000..ddfe884ed --- /dev/null +++ b/src/debug/Viewer.tsx @@ -0,0 +1,192 @@ +import { action, configure, observable, ObservableMap, Lambda } from 'mobx'; +import "normalize.css"; +import * as React from 'react'; +import * as ReactDOM from 'react-dom'; +import { observer } from 'mobx-react'; +import { Document } from '../fields/Document'; +import { BasicField } from '../fields/BasicField'; +import { ListField } from '../fields/ListField'; +import { Key } from '../fields/Key'; +import { Field } from '../fields/Field'; +import { Server } from '../client/Server'; + +configure({ + enforceActions: "observed" +}); + +@observer +class FieldViewer extends React.Component<{ field: BasicField }> { + render() { + return {this.props.field.Data} ({this.props.field.Id}); + } +} + +@observer +class KeyViewer extends React.Component<{ field: Key }> { + render() { + return this.props.field.Name; + } +} + +@observer +class ListViewer extends React.Component<{ field: ListField }>{ + @observable + expanded = false; + + render() { + let content; + if (this.expanded) { + content = ( +
+ {this.props.field.Data.map(field => )} +
+ ) + } else { + content = <>[...] ({this.props.field.Id}) + } + return ( +
+ + {content} +
+ ) + } +} + +@observer +class DocumentViewer extends React.Component<{ field: Document }> { + private keyMap: ObservableMap = new ObservableMap + + private disposer?: Lambda; + + componentDidMount() { + let f = () => { + Array.from(this.props.field._proxies.keys()).forEach(id => { + if (!this.keyMap.has(id)) { + Server.GetField(id, (field) => { + if (field && field instanceof Key) { + this.keyMap.set(id, field); + } + }) + } + }); + } + this.disposer = this.props.field._proxies.observe(f) + f() + } + + componentWillUnmount() { + if (this.disposer) { + this.disposer(); + } + } + + render() { + let fields = Array.from(this.props.field._proxies.entries()).map(kv => { + let key = this.keyMap.get(kv[0]); + return ( +
+ ({key ? key.Name : kv[0]}): + +
+ ) + }) + return ( +
+ Document ({this.props.field.Id}) +
+ {fields} +
+
+ ) + } +} + +@observer +class DebugViewer extends React.Component<{ fieldId: string }> { + @observable + private field?: Field; + + @observable + private error?: string; + + constructor(props: { fieldId: string }) { + super(props) + this.update() + } + + update() { + Server.GetField(this.props.fieldId, (field => { + this.field = field; + if (!field) { + this.error = `Field with id ${this.props.fieldId} not found` + } + })); + + } + + render() { + let content; + if (this.field) { + // content = this.field.ToJson(); + if (this.field instanceof ListField) { + content = () + } else if (this.field instanceof Document) { + content = () + } else if (this.field instanceof BasicField) { + content = () + } else if (this.field instanceof Key) { + content = () + } + } else if (this.error) { + content = Field {this.props.fieldId} not found + } else { + content = <>Field loading + } + return content; + } +} + +@observer +class Viewer extends React.Component { + @observable + private idToAdd: string = ''; + + @observable + private ids: string[] = []; + + @action + inputOnChange = (e: React.ChangeEvent) => { + this.idToAdd = e.target.value; + } + + @action + onKeyPress = (e: React.KeyboardEvent) => { + if (e.key === "Enter") { + this.ids.push(this.idToAdd) + this.idToAdd = "" + } + } + + render() { + return ( + <> + +
+ {this.ids.map(id => { + return + })} +
+ + ) + } +} + +ReactDOM.render(( +
+ +
), + document.getElementById('root') +); \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 1f624d900738115452a4a676c3f93dd9bfc6a745 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Sat, 23 Feb 2019 04:49:37 -0500 Subject: Fixed crash in debug viewer --- src/debug/Viewer.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src/debug/Viewer.tsx') diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx index ddfe884ed..aff77fca3 100644 --- a/src/debug/Viewer.tsx +++ b/src/debug/Viewer.tsx @@ -7,7 +7,7 @@ import { Document } from '../fields/Document'; import { BasicField } from '../fields/BasicField'; import { ListField } from '../fields/ListField'; import { Key } from '../fields/Key'; -import { Field } from '../fields/Field'; +import { Opt, Field } from '../fields/Field'; import { Server } from '../client/Server'; configure({ @@ -116,7 +116,7 @@ class DebugViewer extends React.Component<{ fieldId: string }> { } update() { - Server.GetField(this.props.fieldId, (field => { + Server.GetField(this.props.fieldId, action((field: Opt) => { this.field = field; if (!field) { this.error = `Field with id ${this.props.fieldId} not found` -- cgit v1.2.3-70-g09d2 From f8fe6307622439d23d05a7628b3a91851a54797d Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Mon, 25 Feb 2019 12:14:31 -0500 Subject: Another debug view fix --- src/debug/Viewer.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/debug/Viewer.tsx') diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx index aff77fca3..780e9f8f2 100644 --- a/src/debug/Viewer.tsx +++ b/src/debug/Viewer.tsx @@ -17,7 +17,7 @@ configure({ @observer class FieldViewer extends React.Component<{ field: BasicField }> { render() { - return {this.props.field.Data} ({this.props.field.Id}); + return {JSON.stringify(this.props.field.Data)} ({this.props.field.Id}); } } -- cgit v1.2.3-70-g09d2