From c13c54f4ab45ab098efe991a403f8fc0a2467704 Mon Sep 17 00:00:00 2001
From: eperelm2 <emily_perelman@brown.edu>
Date: Tue, 18 Jul 2023 12:35:52 -0400
Subject: merged with master for component library

---
 src/client/views/FilterPanel.scss       | 10 ++---
 src/client/views/FilterPanel.tsx        |  5 ++-
 src/client/views/PropertiesSection.scss |  2 +-
 src/client/views/PropertiesSection.tsx  | 27 ++++++++++---
 src/client/views/PropertiesView.tsx     | 72 ++++++++++++++-------------------
 5 files changed, 60 insertions(+), 56 deletions(-)

(limited to 'src')

diff --git a/src/client/views/FilterPanel.scss b/src/client/views/FilterPanel.scss
index 34d06ea23..4f0460659 100644
--- a/src/client/views/FilterPanel.scss
+++ b/src/client/views/FilterPanel.scss
@@ -199,11 +199,11 @@
    // float:right;
 
    .filterBox-facetHeader-collapse{
-    float: right;
-                justify-items: right;
-                align-items: flex-end;
-                margin-left: auto;
-                margin-right: 9px;
+        float: right;
+        justify-items: right;
+        align-items: flex-end;
+        margin-left: auto;
+        margin-right: 9px;
     }
 
 }
diff --git a/src/client/views/FilterPanel.tsx b/src/client/views/FilterPanel.tsx
index b10fafb57..68d29942b 100644
--- a/src/client/views/FilterPanel.tsx
+++ b/src/client/views/FilterPanel.tsx
@@ -177,7 +177,8 @@ export class FilterPanel extends React.Component<filterProps> {
                     <div style={{ width: '100%' }}>
                         <Select placeholder="Add a filter..." options={options} isMulti={false} onChange={val => this.facetClick((val as UserOptions).value)} onKeyDown={e => e.stopPropagation()} value={null} closeMenuOnSelect={true} />
                     </div>
-                    {/* <div className="filterBox-select-bool">
+                    {/* THE FOLLOWING CODE SHOULD BE DEVELOPER FOR BOOLEAN EXPRESSION (AND / OR) */}
+                    {/* <div className="filterBox-select-bool"> 
                         <select className="filterBox-selection" onChange={action(e => this.targetDoc && (this.targetDoc._childFilters_boolean = (e.target as any).value))} defaultValue={StrCast(this.targetDoc?.childFilters_boolean)}>
                             {['AND', 'OR'].map(bool => (
                                 <option value={bool} key={bool}>
@@ -197,7 +198,7 @@ export class FilterPanel extends React.Component<filterProps> {
                                 
                                 <div className = "filterBox-facetHeader-collapse"> 
                                  <AiOutlineMinusSquare/>
-                                 <CiCircleRemove/>
+                                 {/* <CiCircleRemove/> */}
                                   </div>
                                
                             </div>
diff --git a/src/client/views/PropertiesSection.scss b/src/client/views/PropertiesSection.scss
index 79479a4ce..321b6300c 100644
--- a/src/client/views/PropertiesSection.scss
+++ b/src/client/views/PropertiesSection.scss
@@ -9,7 +9,7 @@
     .propertiesView-sectionTitle {
         text-align: center;
         display: flex;
-        padding: 10px;
+        padding: 3px 10px;
         font-size: 14px;
         font-weight: bold;
         justify-content: space-between;
diff --git a/src/client/views/PropertiesSection.tsx b/src/client/views/PropertiesSection.tsx
index b900d17ca..ec8043ffe 100644
--- a/src/client/views/PropertiesSection.tsx
+++ b/src/client/views/PropertiesSection.tsx
@@ -1,6 +1,6 @@
 import React = require('react');
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
-import { action, computed } from "mobx"
+import { action, computed, observable } from "mobx"
 import { observer } from "mobx-react"
 import './PropertiesSection.scss'
 import { Doc } from '../../fields/Doc';
@@ -12,7 +12,8 @@ export interface PropertiesSectionProps {
     isOpen: boolean,
     setIsOpen: (bool: boolean) => any 
     inSection?: boolean,
-    setInSection?: (bool: boolean) => any 
+    setInSection?: (bool: boolean) => any
+    onDoubleClick?: () => void
 }
 
 @observer
@@ -28,14 +29,28 @@ export class PropertiesSection extends React.Component<PropertiesSectionProps> {
     @computed get variantColor() {
         return StrCast(Doc.UserDoc().userVariantColor);
     }
+
+    @observable isDouble: boolean = false;
+
     render() {
         console.log(this.props.title, this.props.content)
         if (this.props.content === undefined || this.props.content === null) return null
         else return <div className="propertiesView-section" onPointerEnter={action(() => (this.props.setInSection && this.props.setInSection(true)))} onPointerLeave={action(() => (this.props.setInSection && this.props.setInSection(false)))}>
-        <div className="propertiesView-sectionTitle" onPointerDown={action(() => (this.props.setIsOpen(!this.props.isOpen)))} style={{ 
-            background: this.props.isOpen ?  this.variantColor : this.backgroundColor,
-            color: this.color
-        }}>
+        <div className="propertiesView-sectionTitle" 
+            onDoubleClick={action((e) => {
+                this.isDouble = true;
+                this.props.onDoubleClick && this.props.onDoubleClick()
+                console.log("open options")
+                this.props.setIsOpen(true)
+                setTimeout(() => this.isDouble = false, 300)
+            })}
+            onClick={action((e) => {
+                this.props.setIsOpen(!this.props.isOpen)
+            })} 
+            style={{ 
+                background: this.props.isOpen ?  this.variantColor : this.backgroundColor,
+                color: this.color
+            }}>
             {this.props.title}
             <div className="propertiesView-sectionTitle-icon">
                 <FontAwesomeIcon icon={this.props.isOpen ? 'caret-down' : 'caret-right'} size="lg"  />
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 31c03de4c..cb0663554 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -575,19 +575,29 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         );
     }
 
-    @computed get type() {
-        const type = Utils.cleanDocumentType(StrCast(this.selectedDoc?.type) as DocumentType);
-        return (
-            <Button
-                formLabel={"Type"}
-                text={type}
-                type={Type.SEC}
-                color={this.color}
-                align='flex-start'
-                fillWidth
-            />
-        );
-    }
+    @computed get currentType() {
+        // console.log("current type " + this.selectedDoc?.type)
+ 
+         const documentType = StrCast(this.selectedDoc?.type)
+         var currentType: string = documentType;
+         var capitalizedDocType = Utils.cleanDocumentType(currentType as DocumentType);
+ 
+         return (
+             <div>
+                 <div className = "propertiesView-wordType">Type</div>  
+                 <div className= "currentType"> 
+                 <div className='currentType-icon'>
+                      {this.currentComponent}
+                 </div>
+                
+                   {capitalizedDocType} 
+                
+                 </div>
+                
+             </div>
+           
+         )
+     }
 
     @computed get currentComponent() {
 
@@ -607,30 +617,6 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         }
     }
 
-    @computed get currentType() {
-       // console.log("current type " + this.selectedDoc?.type)
-
-        const documentType = StrCast(this.selectedDoc?.type)
-        var currentType: string = documentType;
-        var capitalizedDocType = currentType.charAt(0).toUpperCase() + currentType.slice(1)
-
-        return (
-            <div>
-                <div className = "propertiesView-wordType">Type</div>  
-                <div className= "currentType"> 
-                <div className='currentType-icon'>
-                     {this.currentComponent}
-                </div>
-               
-                  {capitalizedDocType} 
-               
-                </div>
-               
-            </div>
-          
-        )
-    }
-
     @undoBatch
     @action
     setTitle = (value: string | number) => {
@@ -1183,6 +1169,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
             </>}
             isOpen={this.openSharing}
             setIsOpen={(bool) => this.openSharing = bool}
+            onDoubleClick={() => this.onDoubleClick()}
         />
     }
 
@@ -1218,7 +1205,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
             </div>}
             isOpen={this.openFilters}
             setIsOpen={(bool) => this.openFilters = bool}
-            onDoubleClick={() => this.onDoubleClick()}
+             onDoubleClick={() => this.onDoubleClick()}
         />
     }
 
@@ -1232,7 +1219,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
                     content={this.isInk ? this.appearanceEditor : null}
                     isOpen={this.openAppearance}
                     setIsOpen={(bool) => this.openAppearance = bool}
-                    onDoubleClick={() => this.onDoubleClick()}
+                     onDoubleClick={() => this.onDoubleClick()}
                 />
                 <PropertiesSection
                     title="Transform"
@@ -1260,7 +1247,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     @computed get contextsSubMenu() {
         return <PropertiesSection
             title="Other Contexts"
-            content={this.contexts}
+            content={this.contextCount > 0 ? this.contexts : "There are no other contexts."}
             isOpen={this.openContexts}
             setIsOpen={(bool) => this.openContexts = bool}
             onDoubleClick={() => this.onDoubleClick()}
@@ -1269,10 +1256,12 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
 
 
 
+
+
     @computed get linksSubMenu() {
         return <PropertiesSection
             title="Linked To"
-            content={this.links}
+            content={this.linkCount > 0 ? this.links : "There are no current links." }
             isOpen={this.openLinks}
             setIsOpen={(bool) => this.openLinks = bool}
             onDoubleClick={() => this.onDoubleClick()}
@@ -1753,7 +1742,6 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
                         
                         <div className="propertiesView-name">{this.editableTitle}</div>
                         <div className = "propertiesView-type"> {this.currentType} </div>
-                        <div className="propertiesView-type">{this.type}</div>
                         {this.contextsSubMenu}
                         {this.linksSubMenu}
                         {!this.selectedDoc || !LinkManager.currentLink || (!hasSelectedAnchor && this.selectedDoc !== LinkManager.currentLink) ? null : (
-- 
cgit v1.2.3-70-g09d2