From 56ced02eff9a15cf9185dae487423ee145c68aec Mon Sep 17 00:00:00 2001
From: daniel-schwartz-k <daniel.schwartz@kaltura.com>
Date: Thu, 27 Jul 2023 14:21:50 +0300
Subject: [PATCH] focusing on encoded jwt on startup

---
 src/components/encoded/encoded.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/encoded/encoded.tsx b/src/components/encoded/encoded.tsx
index 7e1d646..b66b71f 100644
--- a/src/components/encoded/encoded.tsx
+++ b/src/components/encoded/encoded.tsx
@@ -1,5 +1,5 @@
 import { StyledCard, StyledHeader } from '../common/common'
-import { useMemo } from 'react'
+import { useMemo, useState } from 'react'
 import TextFieldCopy from '../common/textFieldCopy'
 
 export interface IEncodedProps {
@@ -14,6 +14,12 @@ function isValid(encoded: string): boolean {
 export default function Encoded(props: IEncodedProps) {
   const { value, onChange } = props
   const error = useMemo(() => !!value && !isValid(value), [value])
+  const [isAppStart, setIsAppStart] = useState(true)
+
+  const onBlur = () => {
+    setIsAppStart(false)
+  }
+
   return (
     <>
       <StyledHeader variant="h4">{'Encoded'}</StyledHeader>
@@ -25,6 +31,8 @@ export default function Encoded(props: IEncodedProps) {
           error={error}
           onChange={onChange}
           ariaLabel="encoded input"
+          inputRef={(input) => isAppStart && input?.focus()}
+          onBlur={onBlur}
         />
       </StyledCard>
     </>