got icon through string working but broke something in links

2 files changed, 54 insertions, 42 deletions

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index f877f2598..e5168c882 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -430,7 +430,7 @@ export namespace Docs {
                         nativeHeightUnfrozen: true,
                         layout_forceReflow: true,
                         defaultDoubleClick: 'ignore',
-                        systemIcon: 'AiFillFileText'
+                        systemIcon : 'BsFileEarmarkTextFill'
                     }, 
                 },
             ],
@@ -452,21 +452,21 @@ export namespace Docs {
                 DocumentType.IMG,
                 {
                     layout: { view: ImageBox, dataField: defaultDataKey },
-                    options: { freeform: '' },
+                    options: { freeform: '', systemIcon: 'BsFileEarmarkImageFill' },
                 },
             ],
             [
                 DocumentType.WEB,
                 {
                     layout: { view: WebBox, dataField: defaultDataKey },
-                    options: { _height: 300, _layout_fitWidth: true, nativeDimModifiable: true, nativeHeightUnfrozen: true, waitForDoubleClickToClick: 'always' },
+                    options: { _height: 300, _layout_fitWidth: true, nativeDimModifiable: true, nativeHeightUnfrozen: true, waitForDoubleClickToClick: 'always', systemIcon: 'BsGlobe' },
                 },
             ],
             [
                 DocumentType.COL,
                 {
                     layout: { view: CollectionView, dataField: defaultDataKey },
-                    options: { _layout_fitWidth: true, freeform: '', _freeform_panX: 0, _freeform_panY: 0, _freeform_scale: 1 },
+                    options: { _layout_fitWidth: true, freeform: '', _freeform_panX: 0, _freeform_panY: 0, _freeform_scale: 1, systemIcon: 'BsFillCollectionFill' },
                 },
             ],
             [
@@ -480,35 +480,35 @@ export namespace Docs {
                 DocumentType.VID,
                 {
                     layout: { view: VideoBox, dataField: defaultDataKey },
-                    options: { _layout_currentTimecode: 0 },
+                    options: { _layout_currentTimecode: 0, systemIcon: 'BsFileEarmarkPlayFill' },
                 },
             ],
             [
                 DocumentType.AUDIO,
                 {
                     layout: { view: AudioBox, dataField: defaultDataKey },
-                    options: { _height: 100, layout_fitWidth: true, layout_forceReflow: true, nativeDimModifiable: true },
+                    options: { _height: 100, layout_fitWidth: true, layout_forceReflow: true, nativeDimModifiable: true, systemIcon: 'BsFillVolumeUpFill' },
                 },
             ],
             [
                 DocumentType.REC,
                 {
                     layout: { view: VideoBox, dataField: defaultDataKey },
-                    options: { _height: 100, backgroundColor: 'pink' },
+                    options: { _height: 100, backgroundColor: 'pink', systemIcon: 'BsFillMicFill' },
                 },
             ],
             [
                 DocumentType.PDF,
                 {
                     layout: { view: PDFBox, dataField: defaultDataKey },
-                    options: { _layout_curPage: 1, _layout_fitWidth: true, nativeDimModifiable: true, nativeHeightUnfrozen: true },
+                    options: { _layout_curPage: 1, _layout_fitWidth: true, nativeDimModifiable: true, nativeHeightUnfrozen: true, systemIcon: 'BsFileEarmarkPdfFill' },
                 },
             ],
             [
                 DocumentType.MAP,
                 {
                     layout: { view: MapBox, dataField: defaultDataKey },
-                    options: { _height: 600, _width: 800, nativeDimModifiable: true },
+                    options: { _height: 600, _width: 800, nativeDimModifiable: true, systemIcon: 'BsFillPinMapFill' },
                 },
             ],
             [
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>
         );
     }