fixed a few golden layout and tree view issues.

4 files changed, 30 insertions, 7 deletions

diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 6f721a0c8..05c467763 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -78,14 +78,16 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
                 if (child.contentItems.length === 1 && child.contentItems[0].config.component === "DocumentFrameRenderer" &&
                     child.contentItems[0].config.props.documentId == document[Id]) {
                     child.contentItems[0].remove();
-                    //this._goldenLayout.root.contentItems[0].contentItems.splice(i, 1);
                     this.layoutChanged(document);
+                    this.stateChanged();
                 } else
                     child.contentItems.map((tab: any, j: number) => {
                         if (tab.config.component === "DocumentFrameRenderer" && tab.config.props.documentId === document[Id]) {
                             child.contentItems[j].remove();
+                            child.config.activeItemIndex = Math.max(child.contentItems.length - 1, 0);
                             let docs = Cast(this.props.Document.data, listSpec(Doc));
                             docs && docs.indexOf(document) !== -1 && docs.splice(docs.indexOf(document), 1);
+                            this.stateChanged();
                         }
                     });
             })
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 429d0f047..6fa374464 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -10,7 +10,7 @@ import "./CollectionTreeView.scss";
 import React = require("react");
 import { Document, listSpec } from '../../../new_fields/Schema';
 import { Cast, StrCast, BoolCast, FieldValue } from '../../../new_fields/Types';
-import { Doc } from '../../../new_fields/Doc';
+import { Doc, DocListCast } from '../../../new_fields/Doc';
 import { Id } from '../../../new_fields/RefField';
 import { ContextMenu } from '../ContextMenu';
 import { undoBatch } from '../../util/UndoManager';
@@ -51,7 +51,7 @@ class TreeView extends React.Component<TreeViewProps> {
 
     @undoBatch delete = () => this.props.deleteDoc(this.props.document);
 
-    @undoBatch openRight = () => {
+    @undoBatch openRight = async () => {
         if (this.props.document.dockingConfig) {
             Main.Instance.openWorkspace(this.props.document);
         } else {
@@ -63,6 +63,10 @@ class TreeView extends React.Component<TreeViewProps> {
         return Cast(this.props.document.data, listSpec(Doc), []); // bcz: needed?    .filter(doc => FieldValue(doc));
     }
 
+    onPointerDown = (e: React.PointerEvent) => {
+        e.stopPropagation();
+    }
+
     @action
     remove = (document: Document) => {
         let children = Cast(this.props.document.data, listSpec(Doc), []);
@@ -109,11 +113,18 @@ class TreeView extends React.Component<TreeViewProps> {
                     return true;
                 }}
             />);
+        let dataDocs = Cast(CollectionDockingView.Instance.props.Document.data, listSpec(Doc), []);
+        let openRight = dataDocs && dataDocs.indexOf(this.props.document) !== -1 ? (null) : (
+            <div className="treeViewItem-openRight" onPointerDown={this.onPointerDown} onClick={this.openRight}>
+                <FontAwesomeIcon icon="angle-right" size="lg" />
+                <FontAwesomeIcon icon="angle-right" size="lg" />
+            </div>);
         return (
             <div className="docContainer" ref={reference} onPointerDown={onItemDown}
+                style={{ background: BoolCast(this.props.document.libraryBrush, false) ? "#06121212" : "0" }}
                 onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
                 {editableView(StrCast(this.props.document.title))}
-                <div className="treeViewItem-openRight" onClick={this.openRight}><FontAwesomeIcon icon="angle-right" size="lg" /><FontAwesomeIcon icon="angle-right" size="lg" /></div>
+                {openRight}
                 {/* {<div className="delete-button" onClick={this.delete}><FontAwesomeIcon icon="trash-alt" size="xs" /></div>} */}
             </div >);
     }
@@ -156,7 +167,6 @@ class TreeView extends React.Component<TreeViewProps> {
             }
         });
         return <div className="treeViewItem-container"
-            style={{ background: BoolCast(this.props.document.libraryBrush, false) ? "#06121212" : "0" }}
             onContextMenu={this.onWorkspaceContextMenu}>
             <li className="collection-child">
                 {this.renderBullet(bulletType)}
diff --git a/src/client/views/nodes/IconBox.tsx b/src/client/views/nodes/IconBox.tsx
index 3fab10df4..b521d5ce6 100644
--- a/src/client/views/nodes/IconBox.tsx
+++ b/src/client/views/nodes/IconBox.tsx
@@ -2,7 +2,7 @@ import React = require("react");
 import { library } from '@fortawesome/fontawesome-svg-core';
 import { faCaretUp, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable, runInAction } from "mobx";
+import { action, computed, observable, runInAction, reaction, IReactionDisposer } from "mobx";
 import { observer } from "mobx-react";
 import { SelectionManager } from "../../util/SelectionManager";
 import { FieldView, FieldViewProps } from './FieldView';
@@ -25,6 +25,17 @@ library.add(faFilm);
 @observer
 export class IconBox extends React.Component<FieldViewProps> {
     public static LayoutString() { return FieldView.LayoutString(IconBox); }
+    _reactionDisposer?: IReactionDisposer;
+    componentDidMount() {
+        this._reactionDisposer = reaction(() => [this.props.Document.maximizedDocs],
+            () => {
+                let maxDoc = Cast(this.props.Document.maximizedDocs, listSpec(Doc), []);
+                this.props.Document.title = maxDoc && (maxDoc.length === 1 ? maxDoc[0].title + ".icon" : "");
+            }, { fireImmediately: true });
+    }
+    componentWillUnmount() {
+        if (this._reactionDisposer) this._reactionDisposer();
+    }
 
     @computed get layout(): string { const field = Cast(this.props.Document[this.props.fieldKey], IconField); return field ? field.icon : "<p>Error loading icon data</p>"; }
     @computed get minimizedIcon() { return IconBox.DocumentIcon(this.layout); }
@@ -52,6 +63,7 @@ export class IconBox extends React.Component<FieldViewProps> {
     @observable _panelWidth: number = 0;
     @observable _panelHeight: number = 0;
     render() {
+        let title = this._title;
         let labelField = StrCast(this.props.Document.labelField);
         let hideLabel = BoolCast(this.props.Document.hideLabel);
         let maxDoc = Cast(this.props.Document.maximizedDocs, listSpec(Doc), []);
diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts
index 70dd8361b..38c220bc8 100644
--- a/src/new_fields/Doc.ts
+++ b/src/new_fields/Doc.ts
@@ -220,7 +220,6 @@ export namespace Doc {
             return undefined;
         }
         const delegate = new Doc();
-        //TODO Does this need to be doc[Self]?
         delegate.proto = doc;
         return delegate;
     }