fix: do not auto create dashboard

4 files changed, 46 insertions, 11 deletions

diff --git a/src/client/views/DashboardView.scss b/src/client/views/DashboardView.scss
index 06f331c13..3db23b86f 100644
--- a/src/client/views/DashboardView.scss
+++ b/src/client/views/DashboardView.scss
@@ -47,4 +47,20 @@
             margin: 10px;
             font-weight: 500;
       }
+
+      img {
+            width: auto;
+            height: 80%;
+      }
+
+      .info {
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            align-items: center;
+      }
+
+      .more {
+            z-index: 100;
+      }
 }
\ No newline at end of file
diff --git a/src/client/views/DashboardView.tsx b/src/client/views/DashboardView.tsx
index fa8a98402..027cfd376 100644
--- a/src/client/views/DashboardView.tsx
+++ b/src/client/views/DashboardView.tsx
@@ -9,11 +9,16 @@ import { CurrentUserUtils } from "../util/CurrentUserUtils";
 import { UndoManager } from "../util/UndoManager";
 import "./DashboardView.scss"
 import { MainViewModal } from "./MainViewModal";
+import { ContextMenu } from "./ContextMenu";
+import { DocumentManager } from "../util/DocumentManager";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 enum DashboardGroup {
       MyDashboards, SharedDashboards
 }
 
+// DashboardView is the view with the dashboard previews, rendered when the app first loads
+
 @observer
 export class DashboardView extends React.Component {
 
@@ -23,7 +28,7 @@ export class DashboardView extends React.Component {
 
       @observable private newDashboardName: string | undefined = undefined;
       @action abortCreateNewDashboard = () => { this.newDashboardName = undefined }
-      @action setNewDashboardName(name: string) { this.newDashboardName = name}
+      @action setNewDashboardName(name: string) { this.newDashboardName = name }
 
       @action
       selectDashboardGroup = (group: DashboardGroup) => {
@@ -75,7 +80,27 @@ export class DashboardView extends React.Component {
                                     const href = ImageCast((dashboard.thumb as Doc)?.data)?.url.href;
                                     return <div className="dashboard-container" key={dashboard[Id]} onClick={e => this.clickDashboard(e, dashboard)}>
                                           <img src={href ?? "https://media.istockphoto.com/photos/hot-air-balloons-flying-over-the-botan-canyon-in-turkey-picture-id1297349747?b=1&k=20&m=1297349747&s=170667a&w=0&h=oH31fJty_4xWl_JQ4OIQWZKP8C6ji9Mz7L4XmEnbqRU="}></img>
-                                          <div className="title"> {StrCast(dashboard.title)} </div>
+                                          <div className="info">
+                                                <div className="title"> {StrCast(dashboard.title)} </div>
+                                                <div className="more" onClick={e => {
+                                                      const dashView = DocumentManager.Instance.getDocumentView(dashboard);
+                                                      console.log(dashView)
+                                                      ContextMenu.Instance.addItem({
+                                                            description: "Share Dashboard", event: async () => {
+                                                               // ...
+                                                            }, icon: "edit"
+                                                      });
+                                                      ContextMenu.Instance.addItem({
+                                                            description: "Delete Dashboard", event: async () => {
+                                                               // ...
+                                                            }, icon: "trash"
+                                                      });
+                                                      dashView?.showContextMenu(e.clientX + 20, e.clientY + 30);
+                                                }}>
+                                                      <FontAwesomeIcon color="black" size="lg" icon="bars" />
+                                                </div>
+                                          </div>
+
                                     </div>
 
                               })}
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 5fd76c388..c32198f68 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -222,16 +222,10 @@ export class MainView extends React.Component {
     }
 
     initAuthenticationRouters = async () => {
-        // Load the user's active dashboard, or create a new one if initial session after signup
         const received = CurrentUserUtils.MainDocId;
         if (received && !this.userDoc) {
-            reaction(() => CurrentUserUtils.GuestTarget, target => target && CurrentUserUtils.createNewDashboard(Doc.UserDoc()), { fireImmediately: true });
-        } else {
-            PromiseValue(this.userDoc.activeDashboard).then(dash => {
-                if (dash instanceof Doc) CurrentUserUtils.openDashboard(this.userDoc, dash);
-                else CurrentUserUtils.createNewDashboard(this.userDoc);
-            });
-        }
+            reaction(() => CurrentUserUtils.GuestTarget, target => target);
+        } 
     }
 
     @action
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index c5b340514..214b20193 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -2,7 +2,6 @@
 
 
 .topbar-container {
-      display: flex;
       flex-direction: column;
       font-size: 10px;
       line-height: 1;
@@ -11,6 +10,7 @@
       background: $dark-gray;
       overflow: visible;
       z-index: 1000;
+      align-items: center;
       height: $topbar-height;
       background-color: $dark-gray;