From baf6955c9c4d4dc79df072778449f882aa63d68e Mon Sep 17 00:00:00 2001
From: eperelm2 <emily_perelman@brown.edu>
Date: Thu, 8 Jun 2023 13:37:37 -0400
Subject: got icon through string working but broke something in links

---
 src/client/views/PropertiesView.tsx | 78 +++++++++++++++++++++----------------
 1 file changed, 45 insertions(+), 33 deletions(-)

(limited to 'src/client/views/PropertiesView.tsx')

diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 5ba71b815..a6c94d0d9 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -35,12 +35,14 @@ 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 { AiFillFileText } from "react-icons/ai" //* as Icons from "react-icons/ai" //
+import * as Icons from "react-icons/bs" //{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 { FaFileVideo } from 'react-icons/fa'; //* as Icons from "react-icons/fa"; //
 import { IconButton } from 'browndash-components';
+import { IconBase } from 'react-icons';
+import { MdOutlineMedicalServices } from 'react-icons/md';
 const higflyout = require('@hig/flyout');
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
@@ -268,8 +270,16 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
 
     @computed get linkCount(){
         const selAnchor =  this.selectedDocumentView?.anchorViewDoc ?? LinkManager.currentLinkAnchor ?? this.selectedDoc;
+      
+        if (this.links === null){
+            console.log("this is where i want to be")
+        }
+        console.log("this is based on links() " + this.links?.key)
+
         if (selAnchor != undefined){
+            console.log("thsi si selAnchr " + selAnchor.links)
             const links = DocListCast(selAnchor.links)
+            console.log("we linkin yo " + links)
             return links.length
         } else{
             return 0
@@ -481,42 +491,43 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         );
     }
 
+    @computed get currentComponent() {
+
+        var iconName = StrCast(this.selectedDoc?.systemIcon)
+
+        // if (this.selectedDoc?.type === DocumentType.COL){
+        //     console.log("i did it!")
+        // }
+       
+
+        if (iconName){
+            const Icon = Icons[iconName as keyof typeof Icons];
+            return <Icon />;
+        } else{
+          return <Icons.BsFillCollectionFill/>
+
+        }
+    }
+
     @computed get currentType() {
-       // const layoutField = this.selectedDoc?.[Doc.LayoutFieldKey(this.selectedDoc)];
+        console.log("current type " + this.selectedDoc?.type)
+
         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/>
-        // }
+        var currentType: string = documentType;
+        var capitalizedDocType = currentType.charAt(0).toUpperCase() + currentType.slice(1)
 
         return (
             <div>
-                <div className = "propertiesView-wordType">Type</div>
-                
+                <div className = "propertiesView-wordType">Type</div>  
                 <div className= "currentType"> 
-
-                {/* <Icon iconName = "AiFillFileText"></Icon> */}
-                {/* <IconButton icon={StrCast(this.selectedDoc?.systemIcon)}></IconButton> */}
-                {/* {currentTypeComponent} */}
-                {currentType} 
+                <div className='currentType-icon'>
+                     {this.currentComponent}
+                </div>
+               
+                  {capitalizedDocType} 
+               
                 </div>
+               
             </div>
           
         )
@@ -1207,7 +1218,8 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
                         <FontAwesomeIcon icon={this.openLinks ? 'caret-down' : 'caret-right'} size="lg" color="white" />
                     </div>
                 </div>
-                {!this.openLinks ? null : this.linkCount > 0 ? <div className="propertiesView-contexts-content">{this.links}</div> : <div className="propertiesView-contexts-content">There are no current links.</div>}
+                {/* {!this.openLinks ? null : this.linkCount > 0 ? <div className="propertiesView-contexts-content">{this.links}</div> : <div className="propertiesView-contexts-content">There are no current links.</div>} */}
+                {!this.openLinks ? null : <div className="propertiesView-contexts-content">{this.links}</div>}
             </div>
         );
     }
-- 
cgit v1.2.3-70-g09d2