From 0b2f88ae83b4951f597a3b45cb7d9dd81c7c727d Mon Sep 17 00:00:00 2001
From: olehp <opoliarush@digma.ai>
Date: Fri, 2 Feb 2024 19:05:02 +0200
Subject: [PATCH 1/3] Fix issue with render

---
 .../Insights/InsightJiraTicket/index.tsx      | 41 +++++++++++--------
 1 file changed, 25 insertions(+), 16 deletions(-)

diff --git a/src/components/Insights/InsightJiraTicket/index.tsx b/src/components/Insights/InsightJiraTicket/index.tsx
index 532b2b280..e45001d74 100644
--- a/src/components/Insights/InsightJiraTicket/index.tsx
+++ b/src/components/Insights/InsightJiraTicket/index.tsx
@@ -50,26 +50,35 @@ export const InsightJiraTicket = (props: InsightJiraTicketProps) => {
     });
   };
 
-  const handleInsightTicketLink = (data: unknown) => {
-    const linkTicketResponse = data as LinkTicketResponse;
+  useEffect(() => {
+    const handleInsightTicketLink = (data: unknown) => {
+      const linkTicketResponse = data as LinkTicketResponse;
 
-    if (linkTicketResponse.success) {
-      setTicketLink(linkTicketResponse.ticketLink);
-    } else {
-      setErrorMessage(linkTicketResponse.message);
-    }
+      if (linkTicketResponse.success) {
+        setTicketLink(linkTicketResponse.ticketLink);
+      } else {
+        setErrorMessage(linkTicketResponse.message);
+      }
 
-    window.sendMessageToDigma({
-      action: actions.GET_DATA
-    });
+      window.sendMessageToDigma({
+        action: actions.GET_DATA
+      });
 
-    props.onReloadSpanInsight && props.onReloadSpanInsight();
-  };
+      props.onReloadSpanInsight && props.onReloadSpanInsight();
+    };
 
-  dispatcher.addActionListener(
-    actions.SET_TICKET_LINK,
-    handleInsightTicketLink
-  );
+    dispatcher.addActionListener(
+      actions.SET_TICKET_LINK,
+      handleInsightTicketLink
+    );
+
+    return () => {
+      dispatcher.removeActionListener(
+        actions.SET_TICKET_LINK,
+        handleInsightTicketLink
+      );
+    };
+  }, []);
 
   useEffect(() => {
     if (props.relatedInsight) {

From 283059eca22dc63afaf171e8e6b6ab30e74c999c Mon Sep 17 00:00:00 2001
From: olehp <opoliarush@digma.ai>
Date: Fri, 2 Feb 2024 19:12:12 +0200
Subject: [PATCH 2/3] fix-selection

---
 src/components/common/JiraTicket/index.tsx | 131 +++++++++++----------
 src/components/common/JiraTicket/styles.ts |   4 +
 2 files changed, 72 insertions(+), 63 deletions(-)

diff --git a/src/components/common/JiraTicket/index.tsx b/src/components/common/JiraTicket/index.tsx
index 5e0e56eac..6f385f959 100644
--- a/src/components/common/JiraTicket/index.tsx
+++ b/src/components/common/JiraTicket/index.tsx
@@ -100,77 +100,82 @@ export const JiraTicket = (props: JiraTicketProps) => {
 
   return (
     <s.Container>
-      <s.Header>
-        <IconTag icon={JiraLogoIcon} size={"large"} />
-        <s.TitleContainer>
-          <s.Title>Create Jira Ticket</s.Title>
-          Bug details
-        </s.TitleContainer>
-        <Tooltip title={"Close"}>
-          <s.CloseButton onClick={handleCloseButtonClick}>
-            <CrossIcon color={"currentColor"} />
-          </s.CloseButton>
-        </Tooltip>
-      </s.Header>
-      <Field
-        key={"summary"}
-        label={"Summary"}
-        content={props.summary}
-        button={
-          <IconButton
-            icon={CopyIcon}
-            title={"Copy"}
-            onClick={() => copyToClipboard("summary", props.summary)}
-          />
-        }
-      />
-      <Field
-        key={"description"}
-        label={"Description"}
-        multiline={true}
-        content={
-          <div ref={descriptionContentRef}>
-            {props.description.isLoading ? (
-              <s.LoaderContainer>
-                <CircleLoader size={32} colors={getCircleLoaderColors(theme)} />
-              </s.LoaderContainer>
-            ) : (
-              props.description.content
-            )}
-          </div>
-        }
-        errorMessage={props.description.errorMessage}
-        button={
-          <IconButton
-            icon={CopyIcon}
-            title={"Copy"}
-            disabled={props.description.isLoading}
-            onClick={() =>
-              copyToClipboard("description", descriptionContentRef.current)
-            }
-          />
-        }
-      />
-      {props.attachment && (
+      <s.TicketInfo>
+        <s.Header>
+          <IconTag icon={JiraLogoIcon} size={"large"} />
+          <s.TitleContainer>
+            <s.Title>Create Jira Ticket</s.Title>
+            Bug details
+          </s.TitleContainer>
+          <Tooltip title={"Close"}>
+            <s.CloseButton onClick={handleCloseButtonClick}>
+              <CrossIcon color={"currentColor"} />
+            </s.CloseButton>
+          </Tooltip>
+        </s.Header>
         <Field
-          key={"attachments"}
-          label={"Attachments"}
-          content={
-            <AttachmentTag
-              icon={PaperclipIcon}
-              text={props.attachment.fileName}
+          key={"summary"}
+          label={"Summary"}
+          content={props.summary}
+          button={
+            <IconButton
+              icon={CopyIcon}
+              title={"Copy"}
+              onClick={() => copyToClipboard("summary", props.summary)}
             />
           }
+        />
+        <Field
+          key={"description"}
+          label={"Description"}
+          multiline={true}
+          content={
+            <div ref={descriptionContentRef}>
+              {props.description.isLoading ? (
+                <s.LoaderContainer>
+                  <CircleLoader
+                    size={32}
+                    colors={getCircleLoaderColors(theme)}
+                  />
+                </s.LoaderContainer>
+              ) : (
+                props.description.content
+              )}
+            </div>
+          }
+          errorMessage={props.description.errorMessage}
           button={
             <IconButton
-              icon={DownloadIcon}
-              title={"Download"}
-              onClick={handleDownloadButtonClick}
+              icon={CopyIcon}
+              title={"Copy"}
+              disabled={props.description.isLoading}
+              onClick={() =>
+                copyToClipboard("description", descriptionContentRef.current)
+              }
             />
           }
-          errorMessage={downloadErrorMessage}
         />
-      )}
+        {props.attachment && (
+          <Field
+            key={"attachments"}
+            label={"Attachments"}
+            content={
+              <AttachmentTag
+                icon={PaperclipIcon}
+                text={props.attachment.fileName}
+              />
+            }
+            button={
+              <IconButton
+                icon={DownloadIcon}
+                title={"Download"}
+                onClick={handleDownloadButtonClick}
+              />
+            }
+            errorMessage={downloadErrorMessage}
+          />
+        )}
+      </s.TicketInfo>
       {props.showLinkButton && (
         <TicketLinkButton
           ticketLink={props.ticketLink}
diff --git a/src/components/common/JiraTicket/styles.ts b/src/components/common/JiraTicket/styles.ts
index a6c84d9eb..4681540c8 100644
--- a/src/components/common/JiraTicket/styles.ts
+++ b/src/components/common/JiraTicket/styles.ts
@@ -14,6 +14,10 @@ export const Container = styled.div`
   box-sizing: border-box;
 `;
 
+export const TicketInfo = styled.div`
+  user-select: none;
+`;
+
 export const Header = styled.div`
   display: flex;
   gap: 12px;

From 2370b8ead95fabe0bf5e93560e67f911408871b4 Mon Sep 17 00:00:00 2001
From: olehp <opoliarush@digma.ai>
Date: Fri, 2 Feb 2024 19:37:48 +0200
Subject: [PATCH 3/3] Fix selection

---
 .../common/JiraTicket/Field/index.tsx         |   2 +-
 .../common/JiraTicket/Field/styles.ts         |   5 +-
 .../common/JiraTicket/Field/types.ts          |   5 +
 src/components/common/JiraTicket/index.tsx    | 133 +++++++++---------
 src/components/common/JiraTicket/styles.ts    |   4 -
 5 files changed, 74 insertions(+), 75 deletions(-)

diff --git a/src/components/common/JiraTicket/Field/index.tsx b/src/components/common/JiraTicket/Field/index.tsx
index 891200984..891419311 100644
--- a/src/components/common/JiraTicket/Field/index.tsx
+++ b/src/components/common/JiraTicket/Field/index.tsx
@@ -28,7 +28,7 @@ export const Field = (props: FieldProps) => {
     props.multiline === true ? "top" : "center";
 
   return (
-    <s.Container>
+    <s.Container $selectable={props.selectable}>
       <s.Label>{props.label}</s.Label>
       <s.ContentContainer>
         <s.Content ref={getContentRef} $multiline={props.multiline}>
diff --git a/src/components/common/JiraTicket/Field/styles.ts b/src/components/common/JiraTicket/Field/styles.ts
index 076cedf73..81c93784a 100644
--- a/src/components/common/JiraTicket/Field/styles.ts
+++ b/src/components/common/JiraTicket/Field/styles.ts
@@ -1,11 +1,12 @@
 import styled from "styled-components";
 import { redScale } from "../../../common/App/getTheme";
-import { ButtonContainerProps, ContentProps } from "./types";
+import { ButtonContainerProps, ContainerProps, ContentProps } from "./types";
 
-export const Container = styled.div`
+export const Container = styled.div<ContainerProps>`
   display: flex;
   flex-direction: column;
   gap: 6px;
+  ${({ $selectable }) => (!$selectable ? "user-select: none;" : "")}
 `;
 
 export const Label = styled.label`
diff --git a/src/components/common/JiraTicket/Field/types.ts b/src/components/common/JiraTicket/Field/types.ts
index d3e635fd4..dd14d5a7a 100644
--- a/src/components/common/JiraTicket/Field/types.ts
+++ b/src/components/common/JiraTicket/Field/types.ts
@@ -14,6 +14,7 @@ export interface FieldProps {
   button: ReactNode;
   multiline?: boolean;
   errorMessage?: string;
+  selectable?: boolean;
 }
 
 export interface ButtonContainerProps {
@@ -24,3 +25,7 @@ export interface ButtonContainerProps {
 export interface ContentProps {
   $multiline?: boolean;
 }
+
+export interface ContainerProps {
+  $selectable?: boolean;
+}
diff --git a/src/components/common/JiraTicket/index.tsx b/src/components/common/JiraTicket/index.tsx
index 6f385f959..a1bfdfdaf 100644
--- a/src/components/common/JiraTicket/index.tsx
+++ b/src/components/common/JiraTicket/index.tsx
@@ -100,82 +100,79 @@ export const JiraTicket = (props: JiraTicketProps) => {
 
   return (
     <s.Container>
-      <s.TicketInfo>
-        <s.Header>
-          <IconTag icon={JiraLogoIcon} size={"large"} />
-          <s.TitleContainer>
-            <s.Title>Create Jira Ticket</s.Title>
-            Bug details
-          </s.TitleContainer>
-          <Tooltip title={"Close"}>
-            <s.CloseButton onClick={handleCloseButtonClick}>
-              <CrossIcon color={"currentColor"} />
-            </s.CloseButton>
-          </Tooltip>
-        </s.Header>
-        <Field
-          key={"summary"}
-          label={"Summary"}
-          content={props.summary}
-          button={
-            <IconButton
-              icon={CopyIcon}
-              title={"Copy"}
-              onClick={() => copyToClipboard("summary", props.summary)}
-            />
-          }
-        />
+      <s.Header>
+        <IconTag icon={JiraLogoIcon} size={"large"} />
+        <s.TitleContainer>
+          <s.Title>Create Jira Ticket</s.Title>
+          Bug details
+        </s.TitleContainer>
+        <Tooltip title={"Close"}>
+          <s.CloseButton onClick={handleCloseButtonClick}>
+            <CrossIcon color={"currentColor"} />
+          </s.CloseButton>
+        </Tooltip>
+      </s.Header>
+      <Field
+        key={"summary"}
+        label={"Summary"}
+        content={props.summary}
+        button={
+          <IconButton
+            icon={CopyIcon}
+            title={"Copy"}
+            onClick={() => copyToClipboard("summary", props.summary)}
+          />
+        }
+        selectable={false}
+      />
+      <Field
+        key={"description"}
+        label={"Description"}
+        multiline={true}
+        selectable={false}
+        content={
+          <div ref={descriptionContentRef}>
+            {props.description.isLoading ? (
+              <s.LoaderContainer>
+                <CircleLoader size={32} colors={getCircleLoaderColors(theme)} />
+              </s.LoaderContainer>
+            ) : (
+              props.description.content
+            )}
+          </div>
+        }
+        errorMessage={props.description.errorMessage}
+        button={
+          <IconButton
+            icon={CopyIcon}
+            title={"Copy"}
+            disabled={props.description.isLoading}
+            onClick={() =>
+              copyToClipboard("description", descriptionContentRef.current)
+            }
+          />
+        }
+      />
+      {props.attachment && (
         <Field
-          key={"description"}
-          label={"Description"}
-          multiline={true}
+          key={"attachments"}
+          label={"Attachments"}
           content={
-            <div ref={descriptionContentRef}>
-              {props.description.isLoading ? (
-                <s.LoaderContainer>
-                  <CircleLoader
-                    size={32}
-                    colors={getCircleLoaderColors(theme)}
-                  />
-                </s.LoaderContainer>
-              ) : (
-                props.description.content
-              )}
-            </div>
+            <AttachmentTag
+              icon={PaperclipIcon}
+              text={props.attachment.fileName}
+            />
           }
-          errorMessage={props.description.errorMessage}
           button={
             <IconButton
-              icon={CopyIcon}
-              title={"Copy"}
-              disabled={props.description.isLoading}
-              onClick={() =>
-                copyToClipboard("description", descriptionContentRef.current)
-              }
+              icon={DownloadIcon}
+              title={"Download"}
+              onClick={handleDownloadButtonClick}
             />
           }
+          errorMessage={downloadErrorMessage}
         />
-        {props.attachment && (
-          <Field
-            key={"attachments"}
-            label={"Attachments"}
-            content={
-              <AttachmentTag
-                icon={PaperclipIcon}
-                text={props.attachment.fileName}
-              />
-            }
-            button={
-              <IconButton
-                icon={DownloadIcon}
-                title={"Download"}
-                onClick={handleDownloadButtonClick}
-              />
-            }
-            errorMessage={downloadErrorMessage}
-          />
-        )}
-      </s.TicketInfo>
+      )}
       {props.showLinkButton && (
         <TicketLinkButton
           ticketLink={props.ticketLink}
diff --git a/src/components/common/JiraTicket/styles.ts b/src/components/common/JiraTicket/styles.ts
index 4681540c8..a6c84d9eb 100644
--- a/src/components/common/JiraTicket/styles.ts
+++ b/src/components/common/JiraTicket/styles.ts
@@ -14,10 +14,6 @@ export const Container = styled.div`
   box-sizing: border-box;
 `;
 
-export const TicketInfo = styled.div`
-  user-select: none;
-`;
-
 export const Header = styled.div`
   display: flex;
   gap: 12px;