aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/StyleProvider.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/StyleProvider.tsx')
-rw-r--r--src/client/views/StyleProvider.tsx37
1 files changed, 29 insertions, 8 deletions
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index bd0539069..def0eeef7 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -3,14 +3,14 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Shadows } from 'browndash-components';
import { action, runInAction } from 'mobx';
import { extname } from 'path';
-import { Doc, Opt } from '../../fields/Doc';
+import { Doc, Opt, StrListCast } from '../../fields/Doc';
import { BoolCast, Cast, ImageCast, NumCast, StrCast } from '../../fields/Types';
-import { DashColor, lightOrDark } from '../../Utils';
+import { DashColor, lightOrDark, Utils } from '../../Utils';
import { CollectionViewType, DocumentType } from '../documents/DocumentTypes';
import { DocFocusOrOpen } from '../util/DocumentManager';
import { LinkManager } from '../util/LinkManager';
import { SelectionManager } from '../util/SelectionManager';
-import { ColorScheme } from '../util/SettingsManager';
+import { ColorScheme, SettingsManager } from '../util/SettingsManager';
import { undoBatch, UndoManager } from '../util/UndoManager';
import { TreeSort } from './collections/TreeView';
import { Colors } from './global/globalEnums';
@@ -301,13 +301,34 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
if (props?.isDocumentActive?.()) return isInk ? 'visiblePainted' : 'all';
return undefined; // fixes problem with tree view elements getting pointer events when the tree view is not active
case StyleProp.Decorations:
- if (props?.ContainingCollectionDoc?._viewType === CollectionViewType.Freeform) {
- return doc?.pointerEvents !== 'none' ? null : (
- <div className="styleProvider-lock" onClick={() => toggleLockedPosition(doc)}>
- <FontAwesomeIcon icon={'lock'} style={{ color: 'red' }} size="lg" />
+ const lock = () => {
+ if (props?.ContainingCollectionDoc?._viewType === CollectionViewType.Freeform) {
+ return doc?.pointerEvents !== 'none' ? null : (
+ <div className="styleProvider-lock" onClick={() => toggleLockedPosition(doc)}>
+ <FontAwesomeIcon icon={'lock'} style={{ color: 'red' }} size="lg" />
+ </div>
+ );
+ }
+ };
+ const filter = () => {
+ const showFilterIcon =
+ StrListCast(doc?._docFilters).length || StrListCast(doc?._docRangeFilters).length
+ ? '#18c718bd' //'hasFilter'
+ : docProps?.docFilters?.().filter(f => Utils.IsRecursiveFilter(f) && f !== Utils.noDragsDocFilter).length || docProps?.docRangeFilters().length
+ ? 'orange' //'inheritsFilter'
+ : undefined;
+ return !showFilterIcon ? null : (
+ <div className="styleProvider-filter" onClick={action(() => (SettingsManager.propertiesWidth = 250))}>
+ <FontAwesomeIcon icon={'filter'} size="lg" style={{ position: 'absolute', top: '1%', right: '1%', cursor: 'pointer', padding: 1, color: showFilterIcon, zIndex: 1 }} />
</div>
);
- }
+ };
+ return (
+ <>
+ {lock()}
+ {filter()}
+ </>
+ );
}
}