From 6707f6ad559b463e514bdbbd634ded25bae4a5f7 Mon Sep 17 00:00:00 2001
From: eperelm2 <emily_perelman@brown.edu>
Date: Wed, 7 Jun 2023 13:35:24 -0400
Subject: got types but trying to get icon

---
 src/client/documents/DocumentTypes.ts |  2 +-
 src/client/documents/Documents.ts     |  3 +-
 src/client/views/PropertiesView.scss  | 27 ++++++++++++++++-
 src/client/views/PropertiesView.tsx   | 55 ++++++++++++++++++++++++++++++++---
 4 files changed, 80 insertions(+), 7 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/DocumentTypes.ts b/src/client/documents/DocumentTypes.ts
index cdc8c275c..bd71281fa 100644
--- a/src/client/documents/DocumentTypes.ts
+++ b/src/client/documents/DocumentTypes.ts
@@ -2,7 +2,7 @@ export enum DocumentType {
     NONE = 'none',
 
     // core data types
-    RTF = 'rtf',
+    RTF = 'rich text',
     IMG = 'image',
     WEB = 'web',
     COL = 'collection',
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 515a870b5..f877f2598 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -430,7 +430,8 @@ export namespace Docs {
                         nativeHeightUnfrozen: true,
                         layout_forceReflow: true,
                         defaultDoubleClick: 'ignore',
-                    },
+                        systemIcon: 'AiFillFileText'
+                    }, 
                 },
             ],
             [
diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss
index 5e6bd85e6..b3d16d82a 100644
--- a/src/client/views/PropertiesView.scss
+++ b/src/client/views/PropertiesView.scss
@@ -41,7 +41,7 @@
     }
 
     .propertiesView-name {
-        border-bottom: 1px solid black;
+       // border-bottom: 1px solid black;
         padding: 8.5px;
         font-size: 12.5px;
 
@@ -50,6 +50,11 @@
         }
     }
 
+    .propertiesView-type{
+        padding: 8.5px;
+        font-size: 12.5px;
+    }
+
     .propertiesView-settings {
         //border-bottom: 1px solid black;
         //padding: 8.5px;
@@ -848,6 +853,26 @@
     }
 }
 
+.propertiesView-wordType{
+    color:silver;
+    font-weight:200;
+}
+
+.currentType{
+    text-decoration: underline;
+    display: flex;
+    align-items:center;
+    // border: solid 1px #323232;
+    // padding-left: 5px;
+    // padding-top: 4px;
+    // border-radius: 4px;
+    // height: fit-content;
+}
+
+.currentType-icon{
+    margin-right:5px;
+}
+
 .properties-flyout {
     grid-column: 2/4;
 }
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 3c473498e..c5dd0eaf5 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -2,7 +2,7 @@ import React = require('react');
 import { IconLookup } from '@fortawesome/fontawesome-svg-core';
 import { faAnchor, faArrowRight, faWindowMaximize } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Checkbox, Tooltip } from '@material-ui/core';
+import { Checkbox, Icon, Tooltip } from '@material-ui/core';
 import { intersection } from 'lodash';
 import { action, computed, Lambda, observable } from 'mobx';
 import { observer } from 'mobx-react';
@@ -34,6 +34,13 @@ import { PropertiesDocBacklinksSelector } from './PropertiesDocBacklinksSelector
 import { PropertiesDocContextSelector } from './PropertiesDocContextSelector';
 import './PropertiesView.scss';
 import { DefaultStyleProvider } from './StyleProvider';
+import { RichTextField } from '../../fields/RichTextField';
+import { AiFillFileText } from "react-icons/ai"
+import {BsCollectionFill, BsFillFileEarmarkImageFill} from "react-icons/bs"
+import { CgBrowser} from "react-icons/cg"
+import { ImageField, VideoField, WebField } from '../../fields/URLField';
+import { FaFileVideo } from 'react-icons/fa';
+import { IconButton } from 'browndash-components';
 const higflyout = require('@hig/flyout');
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
@@ -255,10 +262,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get links() {
-        console.log("this is selected doc" + this.selectedDoc)
-        // console.log("this is selected doc" + this.selectedDoc)
         const selAnchor = this.selectedDocumentView?.anchorViewDoc ?? LinkManager.currentLinkAnchor ?? this.selectedDoc;
-        console.log("this is selAnchor" + selAnchor)
         return !selAnchor ? null : <PropertiesDocBacklinksSelector Document={selAnchor} hideTitle={true} addDocTab={this.props.addDocTab} />;
     }
 
@@ -462,6 +466,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     };
 
     @computed get editableTitle() {
+
         const titles = new Set<string>();
         SelectionManager.Views().forEach(dv => titles.add(StrCast(dv.rootDoc.title)));
         const title = Array.from(titles.keys()).length > 1 ? '--multiple selected--' : StrCast(this.selectedDoc?.title);
@@ -476,6 +481,45 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         );
     }
 
+    @computed get currentType() {
+       // const layoutField = this.selectedDoc?.[Doc.LayoutFieldKey(this.selectedDoc)];
+        const documentType = StrCast(this.selectedDoc?.type)
+        //console.log("this is tyoe " + typezzz)
+        var currentType: string = "";
+        var currentTypeComponent =  <BsFillFileEarmarkImageFill/>;
+    
+            currentType = documentType
+           // currentTypeComponent = //c
+         //}// else if (layoutField instanceof ImageField){
+        //     currentType = 'Image'
+        //     currentTypeComponent = <BsFillFileEarmarkImageFill/>
+        // } else if(layoutField instanceof WebField){
+        //     currentType = 'Website'
+        //     currentTypeComponent = <CgBrowser/>
+        // } else if (layoutField instanceof VideoField){
+        //     currentType = 'Video'
+        //     currentTypeComponent = <FaFileVideo/>
+        // }
+        
+        // else{
+        // currentType = 'Collection'
+        // currentTypeComponent = <BsCollectionFill/>
+        // }
+
+        return (
+            <div>
+                <div className = "propertiesView-wordType">Type</div>
+                
+                <div className= "currentType"> 
+                {/* <Icon iconName = "AiFillFileText"></Icon> */}
+                {/* <IconButton icon={StrCast(this.selectedDoc?.systemIcon)}></IconButton> */}
+                {currentType} 
+                </div>
+            </div>
+          
+        )
+    }
+
     @undoBatch
     @action
     setTitle = (value: string) => {
@@ -1420,6 +1464,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
                         </div>
                         <div className="propertiesView-name">{this.editableTitle}</div>
 
+                        <div className = "propertiesView-type"> {this.currentType} </div>
+                        
+
                         {this.contextsSubMenu}
 
                         {this.linksSubMenu}
-- 
cgit v1.2.3-70-g09d2