more exception fixes.

2 files changed, 23 insertions, 20 deletions

diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index 8916d4a53..37b5ef3ec 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -39,7 +39,7 @@ const cloud: IconProp = "cloud-upload-alt";
 const fetch: IconProp = "sync-alt";
 
 @observer
-export class DocumentButtonBar extends React.Component<{ views: DocumentView[], stack?: any }, {}> {
+export class DocumentButtonBar extends React.Component<{ views: (DocumentView | undefined)[], stack?: any }, {}> {
     private _linkButton = React.createRef<HTMLDivElement>();
     private _downX = 0;
     private _downY = 0;
@@ -59,7 +59,7 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
     public static hasPushedHack = false;
     public static hasPulledHack = false;
 
-    constructor(props: { views: DocumentView[] }) {
+    constructor(props: { views: (DocumentView | undefined)[] }) {
         super(props);
         runInAction(() => DocumentButtonBar.Instance = this);
     }
@@ -101,18 +101,20 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
         this._pullColorAnimating = false;
     });
 
+    get view0() { return this.props.views && this.props.views.length ? this.props.views[0] : undefined; }
+
     @action
     onLinkButtonMoved = (e: PointerEvent): void => {
         if (this._linkButton.current !== null && (Math.abs(e.clientX - this._downX) > 3 || Math.abs(e.clientY - this._downY) > 3)) {
             document.removeEventListener("pointermove", this.onLinkButtonMoved);
             document.removeEventListener("pointerup", this.onLinkButtonUp);
             const linkDrag = UndoManager.StartBatch("Drag Link");
-            DragManager.StartLinkDrag(this._linkButton.current, this.props.views[0].props.Document, e.pageX, e.pageY, {
+            this.view0 && DragManager.StartLinkDrag(this._linkButton.current, this.view0.props.Document, e.pageX, e.pageY, {
                 dragComplete: dropEv => {
                     const linkDoc = dropEv.linkDragData?.linkDocument; // equivalent to !dropEve.aborted since linkDocument is only assigned on a completed drop
-                    if (linkDoc && FormattedTextBox.ToolTipTextMenu) {
+                    if (this.view0 && linkDoc && FormattedTextBox.ToolTipTextMenu) {
                         const proto = Doc.GetProto(linkDoc);
-                        proto.sourceContext = this.props.views[0].props.ContainingCollectionDoc;
+                        proto.sourceContext = this.view0.props.ContainingCollectionDoc;
 
                         const anchor2Title = linkDoc.anchor2 instanceof Doc ? StrCast(linkDoc.anchor2.title) : "-untitled-";
                         const text = FormattedTextBox.ToolTipTextMenu.makeLink(linkDoc, anchor2Title, e.ctrlKey ? "onRight" : "inTab");
@@ -147,10 +149,10 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
 
     @computed
     get considerGoogleDocsPush() {
-        const targetDoc = this.props.views[0].props.Document;
-        const published = Doc.GetProto(targetDoc)[GoogleRef] !== undefined;
+        const targetDoc = this.view0?.props.Document;
+        const published = targetDoc && Doc.GetProto(targetDoc)[GoogleRef] !== undefined;
         const animation = this.isAnimatingPulse ? "shadow-pulse 1s linear infinite" : "none";
-        return <div
+        return !targetDoc ? (null) : <div
             title={`${published ? "Push" : "Publish"} to Google Docs`}
             className="documentButtonBar-linker"
             style={{ animation }}
@@ -165,10 +167,10 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
 
     @computed
     get considerGoogleDocsPull() {
-        const targetDoc = this.props.views[0].props.Document;
-        const dataDoc = Doc.GetProto(targetDoc);
+        const targetDoc = this.view0?.props.Document;
+        const dataDoc = targetDoc && Doc.GetProto(targetDoc);
         const animation = this.isAnimatingFetch ? "spin 0.5s linear infinite" : "none";
-        return !dataDoc[GoogleRef] ? (null) : <div className="documentButtonBar-linker"
+        return !targetDoc || !dataDoc || !dataDoc[GoogleRef] ? (null) : <div className="documentButtonBar-linker"
             title={`${!dataDoc.unchanged ? "Pull from" : "Fetch"} Google Docs`}
             style={{ backgroundColor: this.pullColor }}
             onPointerEnter={e => e.altKey && runInAction(() => this.openHover = true)}
@@ -193,10 +195,11 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
 
     @computed
     get linkButton() {
-        const linkCount = DocListCast(this.props.views[0].props.Document.links).length;
-        return <div title="Drag(create link) Tap(view links)" className="documentButtonBar-linkFlyout" ref={this._linkButton}>
+        const view0 = this.view0;
+        const linkCount = view0 && DocListCast(view0.props.Document.links).length;
+        return !view0 ? (null) : <div title="Drag(create link) Tap(view links)" className="documentButtonBar-linkFlyout" ref={this._linkButton}>
             <Flyout anchorPoint={anchorPoints.RIGHT_TOP}
-                content={<LinkMenu docView={this.props.views[0]} addDocTab={this.props.views[0].props.addDocTab} changeFlyout={emptyFunction} />}>
+                content={<LinkMenu docView={view0} addDocTab={view0.props.addDocTab} changeFlyout={emptyFunction} />}>
                 <div className={"documentButtonBar-linkButton-" + (linkCount ? "nonempty" : "empty")} onPointerDown={this.onLinkButtonDown} >
                     {linkCount ? linkCount : <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />}
                 </div>
@@ -206,21 +209,21 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
 
     @computed
     get contextButton() {
-        return <ParentDocSelector Views={this.props.views} Document={this.props.views[0].props.Document} addDocTab={(doc, data, where) => {
+        return !this.view0 ? (null) : <ParentDocSelector Views={this.props.views.filter(v => v).map(v => v as DocumentView)} Document={this.view0.props.Document} addDocTab={(doc, data, where) => {
             where === "onRight" ? CollectionDockingView.AddRightSplit(doc, data) :
                 this.props.stack ? CollectionDockingView.Instance.AddTab(this.props.stack, doc, data) :
-                    this.props.views[0].props.addDocTab(doc, data, "onRight");
+                    this.view0?.props.addDocTab(doc, data, "onRight");
             return true;
         }} />;
     }
 
     render() {
-        if (!this.props.views.length) return (null);
+        if (!this.view0) return (null);
         const templates: Map<Template, boolean> = new Map();
         Array.from(Object.values(Templates.TemplateList)).map(template =>
             templates.set(template, this.props.views.reduce((checked, doc) => checked || doc?.getLayoutPropStr("show" + template.Name) ? true : false, false as boolean)));
 
-        const isText = this.props.views[0].props.Document.data instanceof RichTextField; // bcz: Todo - can't assume layout is using the 'data' field.  need to add fieldKey to DocumentView
+        const isText = this.view0.props.Document.data instanceof RichTextField; // bcz: Todo - can't assume layout is using the 'data' field.  need to add fieldKey to DocumentView
         const considerPull = isText && this.considerGoogleDocsPull;
         const considerPush = isText && this.considerGoogleDocsPush;
         return <div className="documentButtonBar">
@@ -228,7 +231,7 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
                 {this.linkButton}
             </div>
             <div className="documentButtonBar-button">
-                <TemplateMenu docs={this.props.views} templates={templates} />
+                <TemplateMenu docs={this.props.views.filter(v => v).map(v => v as DocumentView)} templates={templates} />
             </div>
             <div className="documentButtonBar-button" style={{ display: !considerPush ? "none" : "" }}>
                 {this.considerGoogleDocsPush}
diff --git a/src/client/views/collections/ParentDocumentSelector.tsx b/src/client/views/collections/ParentDocumentSelector.tsx
index 8346e8099..ffaf41b91 100644
--- a/src/client/views/collections/ParentDocumentSelector.tsx
+++ b/src/client/views/collections/ParentDocumentSelector.tsx
@@ -120,7 +120,7 @@ export class ButtonSelector extends React.Component<{ Document: Doc, Stack: any
         const view = DocumentManager.Instance.getDocumentView(this.props.Document);
         let flyout = (
             <div className="ParentDocumentSelector-flyout" title=" ">
-                <DocumentButtonBar views={[view!]} stack={this.props.Stack} />
+                <DocumentButtonBar views={[view]} stack={this.props.Stack} />
             </div>
         );
         return <span title="Tap for menu" onPointerDown={e => e.stopPropagation()} className="buttonSelector">