diff options
| -rw-r--r-- | src/client/views/DashboardView.scss | 16 | ||||
| -rw-r--r-- | src/client/views/DashboardView.tsx | 29 | ||||
| -rw-r--r-- | src/client/views/MainView.tsx | 10 | ||||
| -rw-r--r-- | src/client/views/topbar/TopBar.scss | 2 |
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; |