Merge branch 'master' into geireann-eslint-prettier

6 files changed, 71 insertions, 42 deletions

diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts
index 0435cd535..8473ce703 100644
--- a/src/client/util/DocumentManager.ts
+++ b/src/client/util/DocumentManager.ts
@@ -255,7 +255,7 @@ export class DocumentManager {
                                 retryDocView.focus(targetDoc, {
                                     willZoom, afterFocus: (didFocus: boolean) =>
                                         new Promise<ViewAdjustment>(res => {
-                                            !noSelect && focusAndFinish(didFocus);
+                                            !noSelect && focusAndFinish(true);
                                             res(ViewAdjustment.doNothing);
                                         })
                                 }); // focus on the target in the context
diff --git a/src/client/views/LightboxView.tsx b/src/client/views/LightboxView.tsx
index fcc4aea13..a1e71b5f4 100644
--- a/src/client/views/LightboxView.tsx
+++ b/src/client/views/LightboxView.tsx
@@ -233,7 +233,7 @@ export class LightboxView extends React.Component<LightboxViewProps> {
                             const doc = LightboxView._doc;
                             const targetView = target && DocumentManager.Instance.getLightboxDocumentView(target);
                             if (doc === r.props.Document && (!target || target === doc)) r.ComponentView?.shrinkWrap?.();
-                            //else target && targetView?.focus(target, { willZoom: true, scale: 0.9, instant: true }); // bcz: why was this here?  it breaks smooth navigation in lightbox using 'next' button
+                            //else target?.focus(target, { willZoom: true, scale: 0.9, instant: true }); // bcz: why was this here?  it breaks smooth navigation in lightbox using 'next' button
                         }));
                     })}
                         Document={LightboxView.LightboxDoc}
diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx
index 44abbdb1c..37589974b 100644
--- a/src/client/views/collections/CollectionStackingView.tsx
+++ b/src/client/views/collections/CollectionStackingView.tsx
@@ -191,7 +191,7 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection
                 smoothScroll(focusSpeed = doc.presTransition || doc.presTransition === 0 ? NumCast(doc.presTransition) : 500, this._mainCont!, localTop[1] + this._mainCont!.scrollTop);
             }
         }
-        const endFocus = async (moved: boolean) => options?.afterFocus ? options?.afterFocus(moved) : ViewAdjustment.doNothing;
+        const endFocus = async (moved: boolean) => options?.afterFocus?.(moved) ?? ViewAdjustment.doNothing;
         this.props.focus(this.rootDoc, {
             willZoom: options?.willZoom, scale: options?.scale, afterFocus: (didFocus: boolean) =>
                 new Promise<ViewAdjustment>(res => setTimeout(async () => res(await endFocus(didFocus)), focusSpeed))
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 360a9b242..7569b209d 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -470,10 +470,13 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
         // after  a timeout, the right _componentView should have been created, so call it to update its view spec values
         setTimeout(() => this._componentView?.setViewSpec?.(anchor, LinkDocPreview.LinkInfo ? true : false));
         const focusSpeed = this._componentView?.scrollFocus?.(anchor, options?.instant === false || !LinkDocPreview.LinkInfo); // bcz: smooth parameter should really be passed into focus() instead of inferred here
-        const endFocus = focusSpeed === undefined ? options?.afterFocus : async (moved: boolean) => options?.afterFocus ? options?.afterFocus(true) : ViewAdjustment.doNothing;
+        const endFocus = focusSpeed === undefined ? options?.afterFocus : async (moved: boolean) => (options?.afterFocus?.(true) ?? ViewAdjustment.doNothing);
         this.props.focus(options?.docTransform ? anchor : this.rootDoc, {
             ...options, afterFocus: (didFocus: boolean) =>
-                new Promise<ViewAdjustment>(res => setTimeout(async () => res(endFocus ? await endFocus(didFocus) : ViewAdjustment.doNothing), focusSpeed ?? 0))
+                new Promise<ViewAdjustment>(res => setTimeout(async () => res(endFocus ? 
+                    await endFocus(didFocus||focusSpeed !== undefined) : 
+                    ViewAdjustment.doNothing), focusSpeed ?? 0)
+                    )
         });
 
     }
@@ -696,6 +699,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
 
     @action
     onContextMenu = (e?: React.MouseEvent, pageX?: number, pageY?: number) => {
+        if (e?.nativeEvent.cancelBubble) return;
         if (e && this.rootDoc._hideContextMenu && Doc.noviceMode) {
             e.preventDefault();
             e.stopPropagation();
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 4eb07fd8d..1fb3cef2a 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -179,12 +179,14 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     }
 
     scrollFocus = (doc: Doc, smooth: boolean) => {
+        let didToggle = false;
         if (DocListCast(this.props.Document[this.fieldKey + "-sidebar"]).includes(doc) && !this.SidebarShown) {
             this.toggleSidebar(!smooth);
+            didToggle = true;
         }
         if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
         this._initialScrollTarget = doc;
-        return this._pdfViewer?.scrollFocus(doc, smooth);
+        return this._pdfViewer?.scrollFocus(doc, smooth) ?? (didToggle ? 1 : undefined);
     }
     getAnchor = () => {
         const anchor =
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index e4f47953d..61940ac09 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -18,7 +18,7 @@ import { PrefetchProxy } from '../../../../fields/Proxy';
 import { RichTextField } from '../../../../fields/RichTextField';
 import { RichTextUtils } from '../../../../fields/RichTextUtils';
 import { ComputedField } from '../../../../fields/ScriptField';
-import { Cast, FieldValue, NumCast, ScriptCast, StrCast } from '../../../../fields/Types';
+import { BoolCast, Cast, FieldValue, NumCast, ScriptCast, StrCast } from '../../../../fields/Types';
 import { GetEffectiveAcl, TraceMobx } from '../../../../fields/util';
 import { addStyleSheet, addStyleSheetRule, clearStyleSheetRules, emptyFunction, numberRange, OmitKeys, returnZero, setupMoveUpEvents, smoothScroll, unimplementedFunction, Utils } from '../../../../Utils';
 import { GoogleApiClientUtils, Pulls, Pushes } from '../../../apis/google_docs/GoogleApiClientUtils';
@@ -651,9 +651,53 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
         return false;
     };
 
+    @undoBatch
+    deleteAnnotation = (anchor: Doc) => {
+        LinkManager.Instance.deleteLink(DocListCast(anchor.links)[0]);
+        // const docAnnotations = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        // this.props.dataDoc[this.props.fieldKey] = new List<Doc>(docAnnotations.filter(a => a !== this.annoTextRegion));
+        // AnchorMenu.Instance.fadeOut(true);
+        this.props.select(false);
+    };
+
+    @undoBatch
+    pinToPres = (anchor: Doc) => this.props.pinToPres(anchor);
+
+    @undoBatch
+    makePushpin = (anchor: Doc) => (anchor.isPushpin = !anchor.isPushpin);
+
+    isPushpin = (anchor: Doc) => BoolCast(anchor.isPushpin);
+
     specificContextMenu = (e: React.MouseEvent): void => {
         const cm = ContextMenu.Instance;
 
+        const editor = this._editorView!;
+        const pcords = editor.posAtCoords({ left: e.clientX, top: e.clientY });
+        let target = (e.target as any).parentElement; // hrefs are stored on the database of the <a> node that wraps the hyerlink <span>
+        while (target && !target.dataset?.targethrefs) target = target.parentElement;
+        if (target) {
+            const hrefs = (target.dataset?.targethrefs as string)
+                ?.trim()
+                .split(' ')
+                .filter(h => h);
+            const anchorDoc = Array.from(hrefs).lastElement().replace(Doc.localServerPath(), '').split('?')[0];
+            e.persist();
+            anchorDoc &&
+                DocServer.GetRefField(anchorDoc).then(
+                    action(anchor => {
+                        AnchorMenu.Instance.Status = 'annotation';
+                        AnchorMenu.Instance.Delete = () => this.deleteAnnotation(anchor as Doc);
+                        AnchorMenu.Instance.Pinned = false;
+                        AnchorMenu.Instance.PinToPres = () => this.pinToPres(anchor as Doc);
+                        AnchorMenu.Instance.MakePushpin = () => this.makePushpin(anchor as Doc);
+                        AnchorMenu.Instance.IsPushpin = () => this.isPushpin(anchor as Doc);
+                        AnchorMenu.Instance.jumpTo(e.clientX, e.clientY, true);
+                    })
+                );
+            e.stopPropagation();
+            return;
+        }
+
         const changeItems: ContextMenuProps[] = [];
         changeItems.push({
             description: 'plain',
@@ -845,8 +889,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
     }
 
     scrollFocus = (textAnchor: Doc, smooth: boolean) => {
+        let didToggle = false;
         if (DocListCast(this.Document[this.fieldKey + '-sidebar']).includes(textAnchor) && !this.SidebarShown) {
             this.toggleSidebar(!smooth);
+            didToggle = true;
         }
         const textAnchorId = textAnchor[Id];
         const findAnchorFrag = (frag: Fragment, editor: EditorView) => {
@@ -899,7 +945,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
             }
         }
 
-        return this._didScroll ? this._focusSpeed : undefined; // if we actually scrolled, then return some focusSpeed
+        return this._didScroll ? this._focusSpeed : didToggle ? 1 : undefined; // if we actually scrolled, then return some focusSpeed
     };
 
     getScrollHeight = () => this.scrollHeight;
@@ -1337,6 +1383,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
     }
 
     onPointerDown = (e: React.PointerEvent): void => {
+        if ((e.nativeEvent as any).handledByInnerReactInstance) {
+            return e.stopPropagation();
+        } else (e.nativeEvent as any).handledByInnerReactInstance = true;
+
         if (this.Document.forceActive) e.stopPropagation();
         this.tryUpdateScrollHeight(); // if a doc a fitwidth doc is being viewed in different context (eg freeform & lightbox), then it will have conflicting heights.  so when the doc is clicked on, we want to make sure it has the appropriate height for the selected view.
         if ((e.target as any).tagName === 'AUDIOTAG') {
@@ -1390,10 +1440,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
         if (!this._editorView?.state.selection.empty && FormattedTextBox._canAnnotate) this.setupAnchorMenu();
         if (!this._downEvent) return;
         this._downEvent = false;
-        if ((e.nativeEvent as any).formattedHandled) {
-            console.log('handled');
-        }
-        if (!(e.nativeEvent as any).formattedHandled && this.props.isContentActive(true)) {
+        if (this.props.isContentActive(true)) {
             const editor = this._editorView!;
             const pcords = editor.posAtCoords({ left: e.clientX, top: e.clientY });
             !this.props.isSelected(true) && editor.dispatch(editor.state.tr.setSelection(new TextSelection(editor.state.doc.resolve(pcords?.pos || 0))));
@@ -1401,9 +1448,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
             while (target && !target.dataset?.targethrefs) target = target.parentElement;
             FormattedTextBoxComment.update(this, editor, undefined, target?.dataset?.targethrefs, target?.dataset.linkdoc);
         }
-        (e.nativeEvent as any).formattedHandled = true;
 
-        if (e.buttons === 1 && this.props.isSelected(true) && !e.altKey) {
+        if (e.button === 0 && this.props.isSelected(true) && !e.altKey) {
             e.stopPropagation();
         }
     };
@@ -1421,8 +1467,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
         }
         FormattedTextBoxComment.Hide();
 
-        (e.nativeEvent as any).formattedHandled = true;
-
         if (e.buttons === 1 && this.props.isSelected(true) && !e.altKey) {
             e.stopPropagation();
         }
@@ -1441,6 +1485,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
     @observable public static Focused: FormattedTextBox | undefined;
 
     onClick = (e: React.MouseEvent): void => {
+        if ((e.nativeEvent as any).handledByInnerReactInstance) {
+            e.stopPropagation();
+            return;
+        }
         if (Math.abs(e.clientX - this._downX) > 4 || Math.abs(e.clientY - this._downY) > 4) {
             this._forceDownNode = undefined;
             return;
@@ -1465,13 +1513,9 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
                 this._editorView!.dispatch(this._editorView!.state.tr.setSelection(NodeSelection.create(this._editorView!.state.doc, pcords.pos)));
             }
         }
-        if ((e.nativeEvent as any).formattedHandled) {
-            e.stopPropagation();
-            return;
-        }
         if (this.props.isSelected(true)) {
             // if text box is selected, then it consumes all click events
-            (e.nativeEvent as any).formattedHandled = true;
+            (e.nativeEvent as any).handledByInnerReactInstance = true;
             if (this.ProseRef?.children[0] !== e.nativeEvent.target) e.stopPropagation(); // if you double click on text, then it will be selected instead of sending a double click to DocumentView & opening a lightbox.  Also,if a text box has isLinkButton, this will prevent link following if you've selected the document to edit it.
             // e.stopPropagation();  // bcz: not sure why this was here.  We need to allow the DocumentView to get clicks to process doubleClicks (see above comment)
             this.hitBulletTargets(e.clientX, e.clientY, !this._editorView?.state.selection.empty || this._forceUncollapse, false, this._forceDownNode, e.shiftKey);
@@ -1512,26 +1556,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
             }
         }
     }
-    onMouseUp = (e: React.MouseEvent): void => {
-        e.stopPropagation();
-
-        const view = this._editorView as any;
-        // this interposes on prosemirror's upHandler to prevent prosemirror's up from invoked multiple times when there
-        // are nested prosemirrors.  We only want the lowest level prosemirror to be invoked.
-        if (view.mouseDown) {
-            const originalUpHandler = view.mouseDown.up;
-            view.root.removeEventListener('mouseup', originalUpHandler);
-            view.mouseDown.up = (e: MouseEvent) => {
-                if (!(e as any).formattedHandled) {
-                    originalUpHandler(e);
-                    (e as any).formattedHandled = true;
-                } else {
-                    console.log('prehandled');
-                }
-            };
-            view.root.addEventListener('mouseup', view.mouseDown.up);
-        }
-    };
     startUndoTypingBatch() {
         !this._undoTyping && (this._undoTyping = UndoManager.StartBatch('undoTyping'));
     }
@@ -1802,7 +1826,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps
                     onBlur={this.onBlur}
                     onPointerUp={this.onPointerUp}
                     onPointerDown={this.onPointerDown}
-                    onMouseUp={this.onMouseUp}
                     onDoubleClick={this.onDoubleClick}>
                     <div
                         className={`formattedTextBox-outer${selected ? '-selected' : ''}`}