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

1 files changed, 15 insertions, 8 deletions

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 5e7908725..34b05da56 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -2,7 +2,7 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Tooltip } from '@mui/material';
 import { IconButton } from 'browndash-components';
-import { action, computed, makeObservable, observable, runInAction } from 'mobx';
+import { action, computed, makeObservable, observable, runInAction, trace } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { FaUndo } from 'react-icons/fa';
@@ -36,6 +36,7 @@ import { ImageBox } from './nodes/ImageBox';
 import { OpenWhere, OpenWhereMod } from './nodes/OpenWhere';
 import { FormattedTextBox } from './nodes/formattedText/FormattedTextBox';
 import { TagsView } from './TagsView';
+import { setTime } from 'react-datepicker/dist/date_utils';
 
 interface DocumentDecorationsProps {
     PanelWidth: number;
@@ -59,6 +60,7 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
     private _interactionLock?: boolean;
 
     @observable _showNothing = true;
+    @observable private _forceRender = 0
     @observable private _accumulatedTitle = '';
     @observable private _titleControlString: string = '$title';
     @observable private _editingTitle = false;
@@ -340,7 +342,7 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
 
     setRotateCenter = (seldocview: DocumentView, rotCenter: number[]) => {
         const selDoc = seldocview.Document;
-        const newloccentern = seldocview.screenToContentsTransform().transformPoint(rotCenter[0], rotCenter[1]);
+        const newloccentern = seldocview.screenToViewTransform().transformPoint(rotCenter[0], rotCenter[1]);
         const newlocenter = [newloccentern[0] - NumCast(seldocview.layoutDoc._width) / 2, newloccentern[1] - NumCast(seldocview.layoutDoc._height) / 2];
         const final = Utils.rotPt(newlocenter[0], newlocenter[1], -(NumCast(seldocview.Document._rotation) / 180) * Math.PI);
         selDoc._rotation_centerX = final.x / NumCast(seldocview.layoutDoc._width);
@@ -620,8 +622,7 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
             });
     };
 
-    @computed
-    get selectionTitle(): string {
+    @computed get selectionTitle(): string {
         if (DocumentView.Selected().length === 1) {
             const selected = DocumentView.Selected()[0];
             if (this._titleControlString.startsWith('$')) {
@@ -635,15 +636,16 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
     @computed get rotCenter() {
         const lastView = DocumentView.Selected().lastElement();
         if (lastView) {
-            const invXf = lastView.screenToContentsTransform().inverse();
+            const invXf = lastView.screenToViewTransform().inverse();
             const seldoc = lastView.layoutDoc;
             const loccenter = Utils.rotPt(NumCast(seldoc._rotation_centerX) * NumCast(seldoc._width), NumCast(seldoc._rotation_centerY) * NumCast(seldoc._height), invXf.Rotate);
             return invXf.transformPoint(loccenter.x + NumCast(seldoc._width) / 2, loccenter.y + NumCast(seldoc._height) / 2);
         }
         return this._rotCenter;
     }
-
+;
     render() {
+        this._forceRender;
         const { b, r, x, y } = this.Bounds;
         const seldocview = DocumentView.Selected().lastElement();
         if (SnappingManager.IsDragging || r - x < 1 || x === Number.MAX_VALUE || !seldocview || this._hidden || isNaN(r) || isNaN(b) || isNaN(x) || isNaN(y)) {
@@ -656,6 +658,11 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
             return null;
         }
 
+        if (seldocview && !seldocview?.ContentDiv?.getBoundingClientRect().width) {
+            setTimeout(action(() => this._forceRender++)); // if the selected Doc has no width, then assume it's stil being layed out and try to render again later. 
+            return null;
+        }
+
         // sharing
         const acl = GetEffectiveAcl(!this._showLayoutAcl ? Doc.GetProto(seldocview.Document) : seldocview.Document);
         const docShareMode = HierarchyMapping.get(acl)!.name;
@@ -837,7 +844,7 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
                                 <div
                                     className="link-button-container"
                                     style={{
-                                        top: DocumentView.Selected().length > 1 ? 0 : `${seldocview.Document._layout_showTags ? 4 + seldocview.TagPanelHeight : 4}px`,
+                                        top: DocumentView.Selected().length > 1 ? 0 : `${seldocview.showTags ? 4 + seldocview.TagPanelHeight : 4}px`,
                                         transform: `translate(${-this._resizeBorderWidth / 2 + 10}px, ${this._resizeBorderWidth + bounds.b - bounds.y + this._titleHeight}px) `,
                                     }}>
                                     <DocumentButtonBar views={() => DocumentView.Selected()} />
@@ -846,7 +853,7 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora
                             <div
                                 className="documentDecorations-tagsView"
                                 style={{
-                                    top: `${seldocview.Document._layout_showTags ? 4 + seldocview.TagPanelHeight : 4}px`,
+                                    top: `${seldocview.showTags ? 4 + seldocview.TagPanelHeight : 4}px`,
                                     transform: `translate(${-this._resizeBorderWidth / 2 + 10}px, ${this._resizeBorderWidth + bounds.b - bounds.y + this._titleHeight}px) `,
                                 }}>
                                 {DocumentView.Selected().length > 1 ? <TagsView Views={DocumentView.Selected()} /> : null}