From 94c38310c6b54d93e907007f20ba032d12697ca0 Mon Sep 17 00:00:00 2001
From: Naafiyan Ahmed <naafiyan@gmail.com>
Date: Thu, 18 Aug 2022 12:33:34 -0400
Subject: fixed sizing bug

---
 src/client/documents/Documents.ts                  | 14 +++++--------
 src/client/views/collections/CollectionSubView.tsx |  2 ++
 src/client/views/nodes/LoadingBox.tsx              | 24 ++++++++++++++++++----
 3 files changed, 27 insertions(+), 13 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index e54fe16de..f3ab7c788 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -827,9 +827,12 @@ export namespace Docs {
             viewFirstProps.author = Doc.CurrentUserEmail;
             let viewDoc: Doc;
             if (placeholderDoc) {
+                placeholderDoc._height = Number(options._height);
+                placeholderDoc._width = Number(options._width);
                 viewDoc = Doc.assign(placeholderDoc, viewFirstProps, true, true);
+            } else {
+                viewDoc = Doc.assign(Doc.MakeDelegate(dataDoc, delegId), viewFirstProps, true, true);
             }
-            viewDoc = Doc.assign(Doc.MakeDelegate(dataDoc, delegId), viewFirstProps, true, true);
             Doc.assign(viewDoc, viewProps, true, true);
             ![DocumentType.LINK, DocumentType.MARKER, DocumentType.LABEL].includes(viewDoc.type as any) && DocUtils.MakeLinkToActiveAudio(() => viewDoc);
 
@@ -901,7 +904,7 @@ export namespace Docs {
             return InstanceFromProto(Prototypes.get(DocumentType.COLOR), '', options);
         }
 
-        export const filesToDocs = new Map<Doc, File>();
+        export const filesToDocs = new Map<Doc, File | string>();
 
         export function LoadingDocument(file: File | string, options: DocumentOptions, ytString?: string) {
             const fileName = typeof file == 'string' ? file : file.name;
@@ -1854,13 +1857,6 @@ export namespace DocUtils {
         });
     }
 
-    export function generatePlaceHolder(file: File, options: DocumentOptions) {
-        return Docs.Create.LoadingDocument(file, options);
-        // placeholder.file = file
-        // TODO: nda - modify loading doc so it only takes in options
-        // Docs.Create.LoadingDocument(options, )
-    }
-
     // copies the specified drag factory document
     export function copyDragFactory(dragFactory: Doc) {
         if (!dragFactory) return undefined;
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index 30467efa0..fd2c722d2 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -470,6 +470,7 @@ export function CollectionSubView<X>(moreProps?: X) {
                 // generatedDocuments.push(Docs.Create.LoadingDocument(files, options));
                 const loading = Docs.Create.LoadingDocument(files, options);
                 generatedDocuments.push(loading);
+                Docs.Create.filesToDocs.set(loading, files);
                 DocUtils.uploadYoutubeVideoLoading(files, {}, loading);
             } else {
                 // uploadFilesToDocs and similar should return a placeholder, one for each placeholder
@@ -477,6 +478,7 @@ export function CollectionSubView<X>(moreProps?: X) {
                     ...files.map(file => {
                         const loading = Docs.Create.LoadingDocument(file, options);
                         // now that there is a doc do whatever slowload was going to do with that file
+                        Docs.Create.filesToDocs.set(loading, file);
                         DocUtils.uploadFileToDoc(file, {}, loading);
                         return loading;
                     })
diff --git a/src/client/views/nodes/LoadingBox.tsx b/src/client/views/nodes/LoadingBox.tsx
index 96620aff9..249461b67 100644
--- a/src/client/views/nodes/LoadingBox.tsx
+++ b/src/client/views/nodes/LoadingBox.tsx
@@ -5,6 +5,8 @@ import * as React from 'react';
 import './LoadingBox.scss';
 import ReactLoading from 'react-loading';
 import { StrCast } from '../../../fields/Types';
+import { computed, observable } from 'mobx';
+import { Docs } from '../../documents/Documents';
 
 @observer
 export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
@@ -12,6 +14,12 @@ export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         return FieldView.LayoutString(LoadingBox, fieldKey);
     }
 
+    @computed
+    private get isLoading() {
+        const file = Docs.Create.filesToDocs.get(this.rootDoc);
+        return file ? true : false;
+    }
+
     componentDidMount() {
         console.log(this.rootDoc);
         // const file = Docs.Create.filesToDocs.get(this.rootDoc);
@@ -44,10 +52,18 @@ export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     render() {
         return (
             <div className="loadingBoxContainer">
-                <p className="text">Loading:</p>
-                <br></br>
-                <p className="text">{StrCast(this.rootDoc.title)}</p>
-                <ReactLoading type={'spinningBubbles'} color={'blue'} height={100} width={100} />
+                {this.isLoading ? (
+                    <div>
+                        <p className="text">Loading:</p>
+                        <br></br>
+                        <span className="text">{StrCast(this.rootDoc.title)}</span>
+                        <ReactLoading type={'spinningBubbles'} color={'blue'} height={100} width={100} />
+                    </div>
+                ) : (
+                    <div>
+                        <span>Error Loading File: {StrCast(this.rootDoc.title)}</span>
+                    </div>
+                )}
             </div>
         );
     }
-- 
cgit v1.2.3-70-g09d2