Merge branch 'master' into sophie-report-manager

1 files changed, 9 insertions, 8 deletions

diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index a030c7052..c7616a9ba 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -1,7 +1,7 @@
 import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Tooltip } from '@material-ui/core';
-import { Shadows } from 'browndash-components';
+import { IconButton, Shadows, Size } from 'browndash-components';
 import { action, runInAction } from 'mobx';
 import { extname } from 'path';
 import { Doc, Opt, StrListCast } from '../../fields/Doc';
@@ -323,18 +323,19 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
 }
 
 export function DashboardToggleButton(doc: Doc, field: string, onIcon: IconProp, offIcon: IconProp, clickFunc?: () => void) {
+    const color = StrCast(Doc.UserDoc().userColor);
     return (
-        <div
-            title={field}
-            className={`styleProvider-treeView-icon${doc[field] ? '-active' : ''}`}
+        <IconButton
+            size={Size.XSMALL}
+            color={color}
+            icon={<FontAwesomeIcon icon={(doc[field] ? (onIcon as any) : offIcon) as IconProp} />}
             onClick={undoBatch(
                 action((e: React.MouseEvent) => {
                     e.stopPropagation();
                     clickFunc ? clickFunc() : (doc[field] = doc[field] ? undefined : true);
                 })
-            )}>
-            <FontAwesomeIcon icon={(doc[field] ? (onIcon as any) : offIcon) as IconProp} size="sm" />
-        </div>
+            )}
+        />
     );
 }
 /**
@@ -342,7 +343,7 @@ export function DashboardToggleButton(doc: Doc, field: string, onIcon: IconProp,
  */
 export function DashboardStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps | DocumentViewProps>, property: string) {
     if (doc && property.split(':')[0] === StyleProp.Decorations) {
-        return doc._type_collection === CollectionViewType.Docking
+        return doc._type_collection === CollectionViewType.Docking || Doc.IsSystem(doc)
             ? null
             : DashboardToggleButton(doc, 'hidden', 'eye-slash', 'eye', () => DocFocusOrOpen(doc, { toggleTarget: true, willZoomCentered: true, zoomScale: 0 }, DocCast(doc?.embedContainer ?? doc?.annotationOn)));
     }