From 91a86ccee43671c3cfb974da229a20dd10a22a47 Mon Sep 17 00:00:00 2001
From: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Date: Tue, 7 Dec 2021 15:17:56 -0600
Subject: [PATCH] Query and Policy UI: Cursor placed at end of input field
 (#3224)

---
 .../components/PolicyForm/PolicyForm.tsx       | 18 ++++++++++++++++++
 .../components/QueryForm/QueryForm.tsx         | 12 ++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/frontend/pages/policies/PolicyPage/components/PolicyForm/PolicyForm.tsx b/frontend/pages/policies/PolicyPage/components/PolicyForm/PolicyForm.tsx
index 4bc1372f17..5d25c0612c 100644
--- a/frontend/pages/policies/PolicyPage/components/PolicyForm/PolicyForm.tsx
+++ b/frontend/pages/policies/PolicyPage/components/PolicyForm/PolicyForm.tsx
@@ -315,6 +315,12 @@ const PolicyForm = ({
             onChange={setLastEditedQueryName}
             inputOptions={{
               autoFocus: true,
+              onFocus: (e: React.FocusEvent<HTMLInputElement>) => {
+                // sets cursor to end of inputfield
+                const val = e.target.value;
+                e.target.value = "";
+                e.target.value = val;
+              },
             }}
           />
         );
@@ -355,6 +361,12 @@ const PolicyForm = ({
             onChange={setLastEditedQueryDescription}
             inputOptions={{
               autoFocus: true,
+              onFocus: (e: React.FocusEvent<HTMLInputElement>) => {
+                // sets cursor to end of inputfield
+                const val = e.target.value;
+                e.target.value = "";
+                e.target.value = val;
+              },
             }}
           />
         );
@@ -398,6 +410,12 @@ const PolicyForm = ({
               onChange={setLastEditedQueryResolution}
               inputOptions={{
                 autoFocus: true,
+                onFocus: (e: React.FocusEvent<HTMLInputElement>) => {
+                  // sets cursor to end of inputfield
+                  const val = e.target.value;
+                  e.target.value = "";
+                  e.target.value = val;
+                },
               }}
             />
           </div>
diff --git a/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx b/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx
index 32564e5d8a..9dd33924b8 100644
--- a/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx
+++ b/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx
@@ -307,6 +307,12 @@ const QueryForm = ({
             onChange={setLastEditedQueryName}
             inputOptions={{
               autoFocus: true,
+              onFocus: (e: React.FocusEvent<HTMLInputElement>) => {
+                // sets cursor to end of inputfield
+                const val = e.target.value;
+                e.target.value = "";
+                e.target.value = val;
+              },
             }}
           />
         );
@@ -347,6 +353,12 @@ const QueryForm = ({
             onChange={setLastEditedQueryDescription}
             inputOptions={{
               autoFocus: true,
+              onFocus: (e: React.FocusEvent<HTMLInputElement>) => {
+                // sets cursor to end of inputfield
+                const val = e.target.value;
+                e.target.value = "";
+                e.target.value = val;
+              },
             }}
           />
         );