From db31bede84295fcf85f915b0267b69f0db831269 Mon Sep 17 00:00:00 2001
From: anika <anika.ahluwalia@gmail.com>
Date: Thu, 7 Jan 2021 11:23:48 -0600
Subject: shift to right

---
 src/client/views/PropertiesView.tsx                | 45 ++++++++++++++++++++--
 .../views/collections/CollectionTreeView.tsx       |  5 ++-
 src/client/views/nodes/FilterBox.scss              |  9 ++---
 src/client/views/nodes/FilterBox.tsx               |  4 +-
 4 files changed, 51 insertions(+), 12 deletions(-)

(limited to 'src')

diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 6e33b5c2f..a8b65c114 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -11,7 +11,7 @@ import { InkField } from "../../fields/InkField";
 import { ComputedField } from "../../fields/ScriptField";
 import { Cast, NumCast, StrCast } from "../../fields/Types";
 import { denormalizeEmail, GetEffectiveAcl, SharingPermissions } from "../../fields/util";
-import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse } from "../../Utils";
+import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../Utils";
 import { DocumentType } from "../documents/DocumentTypes";
 import { DocumentManager } from "../util/DocumentManager";
 import { SelectionManager } from "../util/SelectionManager";
@@ -29,6 +29,7 @@ import { PropertiesButtons } from "./PropertiesButtons";
 import { PropertiesDocContextSelector } from "./PropertiesDocContextSelector";
 import "./PropertiesView.scss";
 import { DefaultStyleProvider } from "./StyleProvider";
+import { FilterBox } from "./nodes/FilterBox";
 const higflyout = require("@hig/flyout");
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
@@ -67,6 +68,8 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     @observable openContexts: boolean = true;
     @observable openAppearance: boolean = true;
     @observable openTransform: boolean = true;
+    @observable openFilters: boolean = true;
+
     // @observable selectedUser: string = "";
     // @observable addButtonPressed: boolean = false;
     @observable layoutDocAcls: boolean = false;
@@ -510,8 +513,6 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         }
     }
 
-
-
     @computed
     get controlPointsButton() {
         const formatInstance = InkStrokeProperties.Instance;
@@ -907,6 +908,44 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
                             </div>}
                     </div>
 
+                    <div className="propertiesView-settings">
+                        <div className="propertiesView-settings-title"
+                            onPointerDown={action(() => this.openFilters = !this.openFilters)}
+                            style={{ backgroundColor: this.openFilters ? "black" : "" }}>
+                            Filters
+                        <div className="propertiesView-settings-title-icon">
+                                <FontAwesomeIcon icon={this.openFilters ? "caret-down" : "caret-right"} size="lg" color="white" />
+                            </div>
+                        </div>
+                        {!this.openFilters ? (null) :
+                            <div className="propertiesView-settings-content">
+                                <DocumentView
+                                    Document={Doc.UserDoc().myFilter as any as Doc}
+                                    DataDoc={undefined}
+                                    addDocument={undefined}
+                                    addDocTab={returnFalse}
+                                    pinToPres={emptyFunction}
+                                    rootSelected={returnTrue}
+                                    removeDocument={returnFalse}
+                                    ScreenToLocalTransform={this.getTransform}
+                                    PanelWidth={this.docWidth}
+                                    PanelHeight={this.docHeight}
+                                    renderDepth={0}
+                                    scriptContext={CollectionDockingView.Instance.props.Document}
+                                    focus={emptyFunction}
+                                    styleProvider={DefaultStyleProvider}
+                                    parentActive={returnTrue}
+                                    whenActiveChanged={emptyFunction}
+                                    bringToFront={emptyFunction}
+                                    docFilters={returnEmptyFilter}
+                                    docRangeFilters={returnEmptyFilter}
+                                    searchFilterDocs={returnEmptyDoclist}
+                                    ContainingCollectionView={undefined}
+                                    ContainingCollectionDoc={undefined}
+                                />
+                            </div>}
+                    </div>
+
                     {!this.isInk ? (null) :
                         <div className="propertiesView-appearance">
                             <div className="propertiesView-appearance-title"
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index d1e0a0f02..b9ad1680a 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -35,7 +35,8 @@ export type collectionTreeViewProps = {
 };
 
 @observer
-export class CollectionTreeView extends CollectionSubView<Document, Partial<collectionTreeViewProps>>(Document) {
+export class
+    CollectionTreeView extends CollectionSubView<Document, Partial<collectionTreeViewProps>>(Document) {
     private treedropDisposer?: DragManager.DragDropDisposer;
     private _isChildActive = false;
     private _mainEle?: HTMLDivElement;
@@ -212,7 +213,7 @@ export class CollectionTreeView extends CollectionSubView<Document, Partial<coll
     render() {
         TraceMobx();
         if (!(this.doc instanceof Doc)) return (null);
-        const background = this.props.treeViewHideTitle && this.props.treeViewHideHeaderFields ? "#D3D3D3" : this.props.styleProvider?.(this.doc, this.props, StyleProp.BackgroundColor);
+        const background = this.props.treeViewHideTitle && this.props.treeViewHideHeaderFields ? "#9F9F9F" : this.props.styleProvider?.(this.doc, this.props, StyleProp.BackgroundColor);
         const paddingX = `${NumCast(this.doc._xPadding, 15)}px`;
         const paddingTop = `${NumCast(this.doc._yPadding, 20)}px`;
         const pointerEvents = !this.props.active() && !SnappingManager.GetIsDragging() && !this._isChildActive ? "none" : undefined;
diff --git a/src/client/views/nodes/FilterBox.scss b/src/client/views/nodes/FilterBox.scss
index d19fc07d3..8ebc7820a 100644
--- a/src/client/views/nodes/FilterBox.scss
+++ b/src/client/views/nodes/FilterBox.scss
@@ -28,9 +28,9 @@
 }
 
 .filterBox-bottom {
-    position: fixed;
-    bottom: 0;
-    width: 100%;
+    // position: fixed;
+    // bottom: 0;
+    // width: 100%;
 }
 
 
@@ -147,9 +147,8 @@
     position: absolute;
     right: 0;
     top: 0;
-    border-left: solid 1px;
     z-index: 1;
-    background-color: #D3D3D3;
+    background-color: #9F9F9F;
 
     .filterBox-addfacet {
         display: inline-block;
diff --git a/src/client/views/nodes/FilterBox.tsx b/src/client/views/nodes/FilterBox.tsx
index d81fd9fe7..cea1e6742 100644
--- a/src/client/views/nodes/FilterBox.tsx
+++ b/src/client/views/nodes/FilterBox.tsx
@@ -210,13 +210,13 @@ export class FilterBox extends ViewBoxBaseComponent<FieldViewProps, FilterBoxDoc
         return this.props.dontRegisterView ? (null) : <div className="filterBox-treeView" style={{ width: "100%" }}>
 
             {/* <div className="filterBox-top"> */}
-            <div className="filter-bookmark">
+            {/* <div className="filter-bookmark">
                 <FontAwesomeIcon className="filter-bookmark-icon" icon={"bookmark"} size={"lg"} />
             </div>
 
             <div className="filterBox-title">
                 <span className="filterBox-span">Choose Filters</span>
-            </div>
+            </div> */}
 
             <div className="filterBox-select-bool">
                 <select className="filterBox-selection" onChange={e => this.changeBool(e)}>
-- 
cgit v1.2.3-70-g09d2