5 files changed, 29 insertions, 5 deletions
diff --git a/src/client/util/LinkManager.ts b/src/client/util/LinkManager.ts
index 1db686751..f2f3e51dd 100644
--- a/src/client/util/LinkManager.ts
+++ b/src/client/util/LinkManager.ts
@@ -75,6 +75,11 @@ export class LinkManager {
         return related;
     }
 
+    public deleteAllLinksOnAnchor(anchor: Doc) {
+        let related = LinkManager.Instance.getAllRelatedLinks(anchor);
+        related.forEach(linkDoc => LinkManager.Instance.deleteLink(linkDoc));
+    }
+
     public addGroupType(groupType: string): boolean {
         if (LinkManager.Instance.LinkManagerDoc) {
             LinkManager.Instance.LinkManagerDoc[groupType] = new List<string>([]);
diff --git a/src/client/views/nodes/LinkEditor.scss b/src/client/views/nodes/LinkEditor.scss
index 1424d7633..3c49c2212 100644
--- a/src/client/views/nodes/LinkEditor.scss
+++ b/src/client/views/nodes/LinkEditor.scss
@@ -47,8 +47,8 @@
     border-radius: 3px;
 
     .linkEditor-group-row {
-        display: flex;
-        margin-bottom: 6px;
+        // display: flex;
+        margin-bottom: 3px;
 
         .linkEditor-group-row-label {
             margin-right: 6px;
@@ -65,16 +65,16 @@
         }
 
         input {
-            width: calc(50% - 18px);
+            width: calc(50% - 16px);
             height: 20px;
         }
 
         button {
             width: 20px;
             height: 20px;
-            margin-left: 6px;
+            margin-left: 3px;
             padding: 0;
-            font-size: 14px;
+            font-size: 10px;
         }
     }
 }
@@ -85,6 +85,10 @@
     position: relative;
     z-index: 999;
 
+    input {
+        width: 100%;
+    }
+
     .linkEditor-options-wrapper {
         width: 100%;
         position: absolute;
diff --git a/src/client/views/nodes/LinkEditor.tsx b/src/client/views/nodes/LinkEditor.tsx
index 51efcc36d..22da732cf 100644
--- a/src/client/views/nodes/LinkEditor.tsx
+++ b/src/client/views/nodes/LinkEditor.tsx
@@ -278,6 +278,7 @@ export class LinkGroupEditor extends React.Component<LinkGroupEditorProps> {
                     <p className="linkEditor-group-row-label">type:</p>
                     <GroupTypesDropdown groupType={groupType} setGroupType={this.setGroupType} />
                 </div>
+                {this.renderMetadata().length > 0 ? <p className="linkEditor-group-row-label">metadata:</p> : <></>}
                 {this.renderMetadata()}
                 <div className="linkEditor-group-buttons">
                     {buttons}
diff --git a/src/client/views/nodes/LinkMenu.scss b/src/client/views/nodes/LinkMenu.scss
index 429977326..7cc11172b 100644
--- a/src/client/views/nodes/LinkMenu.scss
+++ b/src/client/views/nodes/LinkMenu.scss
@@ -131,4 +131,8 @@
     }
 }
 
+.linkEditor-clearButton {
+    float: right;
+}
+
 
diff --git a/src/client/views/nodes/LinkMenu.tsx b/src/client/views/nodes/LinkMenu.tsx
index 8ef899cfc..71384c368 100644
--- a/src/client/views/nodes/LinkMenu.tsx
+++ b/src/client/views/nodes/LinkMenu.tsx
@@ -7,6 +7,11 @@ import React = require("react");
 import { Doc } from "../../../new_fields/Doc";
 import { LinkManager } from "../../util/LinkManager";
 import { LinkMenuGroup } from "./LinkMenuGroup";
+import { faTrash } from '@fortawesome/free-solid-svg-icons';
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+library.add(faTrash)
 
 interface Props {
     docView: DocumentView;
@@ -23,6 +28,10 @@ export class LinkMenu extends React.Component<Props> {
         this._editingLink = undefined;
     }
 
+    clearAllLinks = () => {
+        LinkManager.Instance.deleteAllLinksOnAnchor(this.props.docView.props.Document);
+    }
+
     renderAllGroups = (groups: Map<string, Array<Doc>>): Array<JSX.Element> => {
         let linkItems: Array<JSX.Element> = [];
         groups.forEach((group, groupType) => {
@@ -43,6 +52,7 @@ export class LinkMenu extends React.Component<Props> {
         if (this._editingLink === undefined) {
             return (
                 <div className="linkMenu">
+                    <button className="linkEditor-button linkEditor-clearButton" onClick={() => this.clearAllLinks()} title="Clear all links"><FontAwesomeIcon icon="trash" size="sm" /></button>
                     {/* <input id="linkMenu-searchBar" type="text" placeholder="Search..."></input> */}
                     <div className="linkMenu-list">
                         {this.renderAllGroups(groups)}