From ce02e5a8550b243bb10f611dc7aa7399a56e49b1 Mon Sep 17 00:00:00 2001
From: BorysLevytskyi <borys.levytskyi@gmail.com>
Date: Fri, 12 May 2023 14:54:36 +0200
Subject: [PATCH] Change hashlink icon, copy to clip board on click

---
 src/shell/components/DisplayResultView.tsx | 24 +++++++++++++++++-----
 1 file changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/shell/components/DisplayResultView.tsx b/src/shell/components/DisplayResultView.tsx
index 743f943..d082e85 100644
--- a/src/shell/components/DisplayResultView.tsx
+++ b/src/shell/components/DisplayResultView.tsx
@@ -1,7 +1,8 @@
-import { faTrashAlt, faHashtag } from '@fortawesome/free-solid-svg-icons';
+import { faTrashAlt, faHashtag, faLink, faCheck } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import React from 'react';
+import React, { useState } from 'react';
 import AppState from '../AppState';
+import loglevel from 'loglevel';
 
 
 type DisplayResultProps = {
@@ -16,15 +17,28 @@ type DisplayResultProps = {
 
 const DisplayResultView: React.FunctionComponent<DisplayResultProps> = (props) => {
 
-        const resultKey : number = props.resultKey;
         const appState = props.appState;
+        const link = window.location.origin + window.location.pathname + '#' + props.inputHash;
+        const [copied, setCopied] = useState(false);
+
+        async function copyLink(e: any) {
+            try {
+                await navigator.clipboard.writeText(link);
+                setCopied(true);
+                setTimeout(() => setCopied(false), 2000);
+                return false;
+              } catch (err) {
+                loglevel.debug(err);
+                return true;
+              }
+        }
 
         return <div className="result">
                         <div className="input mono">
                                 <span className="cur">&gt;</span>
                                 <span className="input-string">{props.input}</span>
-                                    <a className="hashLink" title="Link for this expression" href={window.location.pathname + '#' + props.inputHash}>
-                                        <FontAwesomeIcon className="icon" icon={faHashtag} size="xs" />
+                                    <a className="hashLink" title="Copy link link for this expression" onClick={async (e) => {return await copyLink(e)}} href={link}>
+                                        <FontAwesomeIcon className="icon" icon={copied ? faCheck : faLink} size="xs" />
                                     </a>
                                     <button className="hashLink" title="Remove this result" onClick={() => appState.removeResult(props.resultIndex)}>
                                         <FontAwesomeIcon className="icon" icon={faTrashAlt} size="xs" />