In-progress link popup

1 files changed, 23 insertions, 3 deletions

diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
index 5c4640fdf..89d5b7272 100644
--- a/src/client/views/linking/LinkPopup.tsx
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -23,6 +23,8 @@ import { DefaultStyleProvider } from '../StyleProvider';
 import { Transform } from '../../util/Transform';
 import { DocUtils } from '../../documents/Documents';
 import { SearchBox } from '../search/SearchBox';
+import { EditorView } from 'prosemirror-view';
+import { FormattedTextBox } from '../nodes/formattedText/FormattedTextBox';
 
 interface LinkPopupProps {
     showPopup: boolean;
@@ -38,6 +40,24 @@ interface LinkPopupProps {
 
 @observer
 export class LinkPopup extends React.Component<LinkPopupProps> {
+    @observable private linkURL: string = "";
+    @observable public view?: EditorView;
+    private Instance: LinkPopup = this;
+
+
+
+    // TODO: should check for valid URL
+    @undoBatch
+    makeLinkToURL = (target: string, lcoation: string) => {
+        ((this as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
+    }
+
+    @action
+    onLinkChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        this.linkURL = e.target.value;
+        console.log(this.linkURL)
+    }
+
 
     getPWidth = () => 500;
     getPHeight = () => 500;
@@ -47,9 +67,9 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
         return (
             <div className="linkPopup-container" style={{ display: popupVisibility }}>
                 <div className="linkPopup-url-container">
-                    <input defaultValue={""} autoComplete="off" type="text" placeholder="Enter URL..." id="url-input"
-                        className="linkPopup-searchBox searchBox-input" />
-                    <button style={{ display: "block", margin: "10px auto", }}>Apply hyperlink</button>
+                    <input autoComplete="off" type="text" value={this.linkURL} placeholder="Enter URL..." onChange={this.onLinkChange} />
+                    <button onPointerDown={e => this.makeLinkToURL(this.linkURL, "add:right")}
+                        style={{ display: "block", margin: "10px auto", }}>Apply hyperlink</button>
                 </div>
                 <div className="divider">
                     <div className="line"></div>