Merge branch 'info-ui' of https://github.com/brown-dash/Dash-Web into info-ui

1 files changed, 50 insertions, 29 deletions

diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx
index 74b5545bd..a54ee4b2c 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx
@@ -25,54 +25,75 @@ export class CollectionFreeFormInfoUI extends React.Component<CollectionFreeForm
 
     constructor(props: any) {
         super(props);
-        this.currState = this.start;
+        this.currState = this.state0;
     }
 
-    @observable currState: infoState;
-
     @computed get first_doc() {
         return this.props.Freeform.childDocs.lastElement();
     }
-    start: infoState = {
+    @observable currState: infoState;
+    state0: infoState = {
         Message: 'Click to create Object',
-        Events: () => this.props.Freeform.childDocs,
-        Actions: (docs: Doc[]) => {
-            if (docs.length === 1) this.currState = this.state1;
-            if (docs.length > 1) this.currState = this.state2;
-        },
+        Arcs: [
+            {
+                events: () => this.props.Freeform.childDocs,
+                actions: (docs: Doc[]) => {
+                    if (docs.length === 1) this.currState = this.state1;
+                    if (docs.length > 1) this.currState = this.state2;
+                },
+            },
+        ],
     };
     state1: infoState = {
         Message: 'Create a second doc',
-        Events: () => this.props.Freeform.childDocs,
-        Actions: (docs: Doc[]) => {
-            if (docs.length === 0) this.currState = this.start;
-            if (docs.length === 2) this.currState = this.state2;
-        },
+        Arcs: [
+            {
+                events: () => this.props.Freeform.childDocs,
+                actions: (docs: Doc[]) => {
+                    if (docs.length === 0) this.currState = this.state0;
+                    if (docs.length === 2) this.currState = this.state2;
+                },
+            },
+        ],
     };
     state2: infoState = {
         Message: 'Create a link',
-        Events: () => ({ links: this.first_doc && LinkManager.Instance.getAllDirectLinks(this.first_doc), docs: this.props.Freeform.childDocs.slice() }),
-        Actions: arc => {
-            const { links, docs } = arc;
-            if (docs.length === 0) this.currState = this.start;
-            if (docs.length === 1) this.currState = this.state1;
-            if (links?.length) this.currState = this.state3;
-        },
+        Arcs: [
+            {
+                events: () => this.first_doc && LinkManager.Instance.getAllDirectLinks(this.first_doc),
+                actions: links => links?.length && (this.currState = this.state3),
+            },
+            {
+                events: () => this.props.Freeform.childDocs,
+                actions: docs => {
+                    if (docs.length === 0) this.currState = this.state0;
+                    if (docs.length === 1) this.currState = this.state1;
+                },
+            },
+        ],
     };
 
     state3: infoState = {
         Message: 'View links',
-        Events: () => ({ links: this.first_doc && LinkManager.Instance.getAllDirectLinks(this.first_doc), viewingLinks: DocumentLinksButton.LinkEditorDocView }),
-        Actions: arc => {
-            const { links, viewingLinks } = arc;
-            if (viewingLinks) this.currState = this.state4;
-            if (links?.length === 0) this.currState = this.state2;
-        },
+        Arcs: [
+            {
+                events: () => this.first_doc && LinkManager.Instance.getAllDirectLinks(this.first_doc),
+                actions: links => links?.length === 0 && (this.currState = this.state2),
+            },
+            {
+                events: () => DocumentLinksButton.LinkEditorDocView,
+                actions: viewingLinks => viewingLinks && (this.currState = this.state4),
+            },
+        ],
     };
     state4: infoState = {
         Message: 'You did it!',
-        Events: () => false,
-        Actions: arc => {},
+        Arcs: [
+            {
+                events: () => false,
+                actions: arc => {},
+            },
+        ],
     };
 
     /*