1 files changed, 37 insertions, 39 deletions
diff --git a/src/client/views/DashboardView.tsx b/src/client/views/DashboardView.tsx
index ce442801f..68d975a17 100644
--- a/src/client/views/DashboardView.tsx
+++ b/src/client/views/DashboardView.tsx
@@ -92,35 +92,32 @@ export class DashboardView extends React.Component {
         const dashboardCount = DocListCast(Doc.MyDashboards.data).length + 1;
         const placeholder = `Dashboard ${dashboardCount}`;
         return (
-            <div className='new-dashboard'>
-                <div className='header'>Create New Dashboard</div>
+            <div className="new-dashboard">
+                <div className="header">Create New Dashboard</div>
                 <div className="title-input">
                     Title
                     <input className="input" placeholder={placeholder} onChange={e => this.setNewDashboardName((e.target as any).value)} />
                 </div>
                 <div className="color-picker">
                     Background
-                    <ColorPicker onChange={(color) => {
-                        this.newDashboardColor = color;
-                    }} />
+                    <ColorPicker
+                        onChange={color => {
+                            this.newDashboardColor = color;
+                        }}
+                    />
                 </div>
                 <div className="button-bar">
-                    <Button
-                        text="Cancel" 
-                        borderRadius={10}
-                        hoverStyle={'gray'}
-                        fontSize={FontSize.SECONDARY}
-                        onClick={this.abortCreateNewDashboard}
-                    />
+                    <Button text="Cancel" borderRadius={10} hoverStyle={'gray'} fontSize={FontSize.SECONDARY} onClick={this.abortCreateNewDashboard} />
                     <Button
                         text="Create"
                         borderRadius={10}
-                        backgroundColor={Colors.LIGHT_BLUE} 
+                        backgroundColor={Colors.LIGHT_BLUE}
                         hoverStyle={'darken'}
                         fontSize={FontSize.SECONDARY}
                         onClick={() => {
                             this.createNewDashboard(this.newDashboardName!, this.newDashboardColor);
-                    }}/>
+                        }}
+                    />
                 </div>
             </div>
         );
@@ -163,20 +160,19 @@ export class DashboardView extends React.Component {
             <>
                 <div className="dashboard-view">
                     <div className="left-menu">
-                        <div
-                            className="new-dashboard-button">
+                        <div className="new-dashboard-button">
                             <Button
-                            icon={<FaPlus/>}
-                            hoverStyle="darken"
-                            backgroundColor={Colors.LIGHT_BLUE}
-                            size={Size.MEDIUM}
-                            fontSize={FontSize.HEADER}
-                            text="New"
-                            onClick={() => {
-                                this.setNewDashboardName('');
-                            }}
-                            borderRadius={50}    
-                        />
+                                icon={<FaPlus />}
+                                hoverStyle="darken"
+                                backgroundColor={Colors.LIGHT_BLUE}
+                                size={Size.MEDIUM}
+                                fontSize={FontSize.HEADER}
+                                text="New"
+                                onClick={() => {
+                                    this.setNewDashboardName('');
+                                }}
+                                borderRadius={50}
+                            />
                         </div>
                         <div className={`text-button ${this.selectedDashboardGroup === DashboardGroup.MyDashboards && 'selected'}`} onClick={() => this.selectDashboardGroup(DashboardGroup.MyDashboards)}>
                             My Dashboards
@@ -214,18 +210,15 @@ export class DashboardView extends React.Component {
                                                 e.stopPropagation();
                                                 this.onContextMenu(dashboard, e);
                                             }}>
-                                            <IconButton
-                                                isCircle={true}
-                                                size={Size.SMALL}
-                                                hoverStyle="gray"
-                                                icon={<FontAwesomeIcon color="black" size="lg" icon="bars" />}
-                                            />
+                                            <IconButton isCircle={true} size={Size.SMALL} hoverStyle="gray" icon={<FontAwesomeIcon color="black" size="lg" icon="bars" />} />
                                         </div>
                                     </div>
                                 </div>
                             );
                         })}
-                        <div className="dashboard-container-new" onClick={() => {
+                        <div
+                            className="dashboard-container-new"
+                            onClick={() => {
                                 this.setNewDashboardName('');
                             }}>
                             +
@@ -324,6 +317,15 @@ export class DashboardView extends React.Component {
 
         Doc.AddDocToList(dashboards, 'data', dashboardDoc);
 
+        DashboardView.SetupDashboardTrails(dashboardDoc);
+
+        // open this new dashboard
+        Doc.ActiveDashboard = dashboardDoc;
+        Doc.ActivePage = 'dashboard';
+        Doc.ActivePresentation = undefined;
+    };
+
+    public static SetupDashboardTrails(dashboardDoc: Doc) {
         // this section is creating the button document itself  ===  myTrails = new Button
         const reqdBtnOpts: DocumentOptions = {
             _forceActive: true,
@@ -368,15 +370,11 @@ export class DashboardView extends React.Component {
         };
         dashboardDoc.myTrails = new PrefetchProxy(DocUtils.AssignScripts(Docs.Create.TreeDocument([], reqdOpts), { treeViewChildDoubleClick: 'openPresentation(documentView.rootDoc)' }));
 
-        // open this new dashboard
-        Doc.ActiveDashboard = dashboardDoc;
-        Doc.ActivePage = 'dashboard';
-        Doc.ActivePresentation = undefined;
         const contextMenuScripts = [reqdBtnScript.onClick];
         if (Cast(Doc.MyTrails.contextMenuScripts, listSpec(ScriptField), null)?.length !== contextMenuScripts.length) {
             Doc.MyTrails.contextMenuScripts = new List<ScriptField>(contextMenuScripts.map(script => ScriptField.MakeFunction(script)!));
         }
-    };
+    }
 }
 
 export function AddToList(MySharedDocs: Doc, arg1: string, dash: any) {