From e7738e80491fc95be55145ebb8514140ce32352d Mon Sep 17 00:00:00 2001
From: DawnMagnet <axccjqh@qq.com>
Date: Thu, 15 Aug 2024 15:19:36 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20(webview/frontend/CaseView.tsx):?=
 =?UTF-8?q?=20Fix=20UI=20issue=20by=20adding=20a=20"Set=20As=20Expected=20?=
 =?UTF-8?q?Output"=20button=20and=20related=20styles=20in=20app.css?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds a new button to the CaseView component that allows users to set the output text as the expected output. This button is represented by the "Set" label and is styled with a gray filter, positioning, padding, cursor, and hover effects defined in the app.css file. The purpose of this change is to improve user experience by providing an easy way for users to mark output text as the expected output.
---
 src/webview/frontend/CaseView.tsx | 10 ++++++++++
 src/webview/frontend/app.css      | 14 ++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/src/webview/frontend/CaseView.tsx b/src/webview/frontend/CaseView.tsx
index 545be40..5b96346 100644
--- a/src/webview/frontend/CaseView.tsx
+++ b/src/webview/frontend/CaseView.tsx
@@ -228,6 +228,16 @@ export default function CaseView(props: {
                             >
                                 Copy
                             </div>
+                            <div
+                                className="expectedoutput"
+                                onClick={() => {
+                                    setOutput(trunctateStdout(resultText));
+                                    props.notify('Set As Expected Output');
+                                }}
+                                title="Set As Expected Output"
+                            >
+                                Set
+                            </div>
                             <>
                                 <TextareaAutosize
                                     className="selectable received-textarea"
diff --git a/src/webview/frontend/app.css b/src/webview/frontend/app.css
index 4cd5934..8f666fe 100644
--- a/src/webview/frontend/app.css
+++ b/src/webview/frontend/app.css
@@ -402,6 +402,20 @@ button:disabled {
     opacity: 0.5;
     font-size: 80%;
 }
+.expectedoutput {
+    filter: grayscale(100%);
+    position: absolute;
+    top: 0px;
+    right: 35px;
+    padding: 4px;
+    cursor: pointer;
+    opacity: 0.5;
+    font-size: 80%;
+}
+
+.expectedoutput:hover {
+    opacity: 1;
+}
 
 .textarea-container {
     position: relative;