added types display

2 files changed, 44 insertions, 10 deletions

diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss
index 6a6ea7fa0..e444b832b 100644
--- a/src/client/views/linking/LinkMenuItem.scss
+++ b/src/client/views/linking/LinkMenuItem.scss
@@ -29,13 +29,27 @@
             }
 
 
-            .linkMenu-destination-title {
-                text-decoration: none;
-                color: rgb(85, 120, 196);
-                font-size: 14px;
-                padding-bottom: 2px;
-                padding-right: 4px;
-                margin-right: 4px;
+            .linkMenu-title-wrapper {
+
+                display: flex;
+
+                .destination-icon {
+                    float: left;
+                    width: 12px;
+                    height: 12px;
+                    padding-right: 3px;
+                    margin-right: 3px;
+                }
+
+                .linkMenu-destination-title {
+                    text-decoration: none;
+                    color: rgb(85, 120, 196);
+                    font-size: 14px;
+                    padding-bottom: 2px;
+                    padding-right: 4px;
+                    margin-right: 4px;
+                    float: right;
+                }
             }
 
             .linkMenu-description {
diff --git a/src/client/views/linking/LinkMenuItem.tsx b/src/client/views/linking/LinkMenuItem.tsx
index b7cd50b7e..d2363c7d3 100644
--- a/src/client/views/linking/LinkMenuItem.tsx
+++ b/src/client/views/linking/LinkMenuItem.tsx
@@ -181,9 +181,26 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
 
         const eyeIcon = this.props.linkDoc.shown ? "eye-slash" : "eye";
 
+        const destinationIcon = this.props.destinationDoc.type === "image" ? "image" :
+            this.props.destinationDoc.type === "comparison" ? "columns" :
+                this.props.destinationDoc.type === "rtf" ? "font" :
+                    this.props.destinationDoc.type === "collection" ? "folder" :
+                        this.props.destinationDoc.type === "web" ? "globe-asia" :
+                            this.props.destinationDoc.type === "screenshot" ? "photo-video" :
+                                this.props.destinationDoc.type === "webcam" ? "video" :
+                                    this.props.destinationDoc.type === "audio" ? "microphone" :
+                                        this.props.destinationDoc.type === "button" ? "lightning" :
+                                            this.props.destinationDoc.type === "presentation" ? "tv" :
+                                                this.props.destinationDoc.type === "query" ? "search" :
+                                                    this.props.destinationDoc.type === "script" ? "terminal" :
+                                                        this.props.destinationDoc.type === "import" ? "cloud-upload-alt" :
+                                                            this.props.destinationDoc.type === "docholder" ? "expand" : "question";
+
+
         return (
             <div className="linkMenu-item">
                 <div className={canExpand ? "linkMenu-item-content expand-three" : "linkMenu-item-content expand-two"}>
+
                     <div ref={this._drag} className="linkMenu-name" //title="drag to view target. click to customize."
                         onPointerLeave={action(() => LinkDocPreview.LinkInfo = undefined)}
                         onPointerEnter={action(e => this.props.linkDoc && (LinkDocPreview.LinkInfo = {
@@ -197,9 +214,12 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
                         <div className="linkMenu-text">
                             {this.props.linkDoc.linkedText ? <p className="linkMenu-source-title">
                                 Source: <b>{StrCast(this.props.linkDoc.linkedText)}</b></p> : null}
-                            <p className="linkMenu-destination-title"
-                                onPointerDown={this.followDefault}>
-                                {StrCast(this.props.destinationDoc.title)}</p>
+                            <div className="linkMenu-title-wrapper">
+                                <FontAwesomeIcon className="destination-icon" icon={destinationIcon} size="sm" />
+                                <p className="linkMenu-destination-title"
+                                    onPointerDown={this.followDefault}>
+                                    {StrCast(this.props.destinationDoc.title)}</p>
+                            </div>
                             {this.props.linkDoc.description !== "" ? <p className="linkMenu-description">
                                 {StrCast(this.props.linkDoc.description)}</p> : null} </div>