need to pull

1 files changed, 33 insertions, 45 deletions

diff --git a/src/client/views/DashboardView.tsx b/src/client/views/DashboardView.tsx
index ae55c8ebf..d6c7b43d5 100644
--- a/src/client/views/DashboardView.tsx
+++ b/src/client/views/DashboardView.tsx
@@ -43,7 +43,7 @@ export class DashboardView extends React.Component {
     @observable private selectedDashboardGroup = DashboardGroup.MyDashboards;
 
     @observable private newDashboardName: string | undefined = undefined;
-    @observable private newDashboardColor: string | undefined = "#AFAFAF";
+    @observable private newDashboardColor: string | undefined = '#AFAFAF';
     @action abortCreateNewDashboard = () => {
         this.newDashboardName = undefined;
     };
@@ -100,24 +100,17 @@ export class DashboardView extends React.Component {
         const dashboardCount = DocListCast(Doc.MyDashboards.data).length + 1;
         const placeholder = `Dashboard ${dashboardCount}`;
         return (
-            <div className="new-dashboard"
-                style={{ 
+            <div
+                className="new-dashboard"
+                style={{
                     background: StrCast(Doc.UserDoc().userBackgroundColor),
-                    color: StrCast(Doc.UserDoc().userColor)
-                }}
-            >
+                    color: StrCast(Doc.UserDoc().userColor),
+                }}>
                 <div className="header">Create New Dashboard</div>
-                <EditableText 
-                    formLabel='Title'
-                    placeholder={placeholder}
-                    type={Type.SEC}
-                    color={StrCast(Doc.UserDoc().userColor)}
-                    setVal={val => this.setNewDashboardName(val as string)}
-                    fillWidth
-                />
+                <EditableText formLabel="Title" placeholder={placeholder} type={Type.SEC} color={StrCast(Doc.UserDoc().userColor)} setVal={val => this.setNewDashboardName(val as string)} fillWidth />
                 <ColorPicker
-                    formLabel='Background'
-                    colorPickerType='github'
+                    formLabel="Background"
+                    colorPickerType="github"
                     type={Type.TERT}
                     selectedColor={this.newDashboardColor}
                     setSelectedColor={color => {
@@ -165,21 +158,14 @@ export class DashboardView extends React.Component {
     };
 
     render() {
-        const color = StrCast(Doc.UserDoc().userColor)
-        const variant = StrCast(Doc.UserDoc().userVariantColor)
+        const color = StrCast(Doc.UserDoc().userColor);
+        const variant = StrCast(Doc.UserDoc().userVariantColor);
         return (
             <>
                 <div className="dashboard-view">
                     <div className="left-menu">
-                        <Button 
-                            text={'My Dashboards'}
-                            active={this.selectedDashboardGroup === DashboardGroup.MyDashboards}
-                            color={color}
-                            align={'flex-start'}
-                            onClick={() => this.selectDashboardGroup(DashboardGroup.MyDashboards)}
-                            fillWidth
-                        />
-                        <Button 
+                        <Button text={'My Dashboards'} active={this.selectedDashboardGroup === DashboardGroup.MyDashboards} color={color} align={'flex-start'} onClick={() => this.selectDashboardGroup(DashboardGroup.MyDashboards)} fillWidth />
+                        <Button
                             text={'Shared Dashboards' + ' (' + this.getDashboards(DashboardGroup.SharedDashboards).length + ')'}
                             active={this.selectedDashboardGroup === DashboardGroup.SharedDashboards}
                             color={this.getDashboards(DashboardGroup.SharedDashboards).some(dash => !DocListCast(Doc.MySharedDocs.viewed).includes(dash)) ? 'green' : color}
@@ -196,11 +182,11 @@ export class DashboardView extends React.Component {
                                 .filter(key => key !== `acl-${Doc.CurrentUserEmailNormalized}` && !['acl-Me', 'acl-Guest'].includes(key))
                                 .some(key => dashboard[DocAcl][key] !== AclPrivate);
                             return (
-                                <div 
-                                    className="dashboard-container" 
-                                    key={dashboard[Id]} 
+                                <div
+                                    className="dashboard-container"
+                                    key={dashboard[Id]}
                                     style={{ background: this.isUnviewedSharedDashboard(dashboard) && this.selectedDashboardGroup === DashboardGroup.SharedDashboards ? '#6CB982' : shared ? variant : '' }}
-                                    onContextMenu={e => this.onContextMenu(dashboard, e)} 
+                                    onContextMenu={e => this.onContextMenu(dashboard, e)}
                                     onClick={e => this.clickDashboard(e, dashboard)}>
                                     <img
                                         src={
@@ -208,12 +194,7 @@ export class DashboardView extends React.Component {
                                         }
                                     />
                                     <div className="info">
-                                        <EditableText 
-                                            type={Type.PRIM}
-                                            color={color}
-                                            val={StrCast(dashboard.title)} 
-                                            setVal={val => (Doc.GetProto(dashboard).title = val)}
-                                        />
+                                        <EditableText type={Type.PRIM} color={color} val={StrCast(dashboard.title)} setVal={val => (Doc.GetProto(dashboard).title = val)} />
                                         {this.selectedDashboardGroup === DashboardGroup.SharedDashboards && this.isUnviewedSharedDashboard(dashboard) ? <div>unviewed</div> : <div></div>}
                                         <div
                                             className="more"
@@ -229,10 +210,13 @@ export class DashboardView extends React.Component {
                                             <Button size={Size.SMALL} color={color} icon={<FontAwesomeIcon color={color} icon="bars" />} />
                                         </div>
                                     </div>
-                                    <div className={`background`} style={{
-                                        background: StrCast(Doc.UserDoc().userColor),
-                                        filter: 'opacity(0.2)'
-                                    }}/>
+                                    <div
+                                        className={`background`}
+                                        style={{
+                                            background: StrCast(Doc.UserDoc().userColor),
+                                            filter: 'opacity(0.2)',
+                                        }}
+                                    />
                                     <div className={'dashboard-status' + (shared ? '-shared' : '')}>{shared ? 'shared' : ''}</div>
                                 </div>
                             );
@@ -243,10 +227,13 @@ export class DashboardView extends React.Component {
                                 this.setNewDashboardName('');
                             }}>
                             +
-                            <div className={`background`} style={{
-                                background: StrCast(Doc.UserDoc().userColor),
-                                filter: 'opacity(0.2)'
-                            }}/>
+                            <div
+                                className={`background`}
+                                style={{
+                                    background: StrCast(Doc.UserDoc().userColor),
+                                    filter: 'opacity(0.2)',
+                                }}
+                            />
                         </div>
                     </div>
                 </div>
@@ -416,6 +403,7 @@ export class DashboardView extends React.Component {
             backgroundColor: background,
             title: `Untitled Tab 1`,
         };
+
         const title = name ? name : `Dashboard ${dashboardCount}`;
         const freeformDoc = Doc.GuestTarget || Docs.Create.FreeformDocument([], freeformOptions);
         const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: title }, id, 'row');