Move componets and make it so escape clicks the back button for you

src/app/game/berry-dash/icon-marketplace/upload/page.tsx

@@ -1,18 +1,19 @@
 'use client'
 
-import { BackButton } from '@/app/components/BackButton'
-import { ReloadButton } from '@/app/components/ReloadButton'
+import { BackButton } from '@/components/BackButton'
+import { ReloadButton } from '@/components/ReloadButton'
 import { getCookie } from '@/util/cookie'
 import { Turnstile } from '@marsidev/react-turnstile'
 import axios from 'axios'
 import { useRouter } from 'next/navigation'
-import { useEffect, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 
 export default function BerryDashSubmitIcon () {
   const [token, setToken] = useState<string | null>(null)
   const [result, setResult] = useState<number>(-1)
   const [loading, setLoading] = useState<boolean>(true)
   const router = useRouter()
+  const backButtonRef = useRef<HTMLAnchorElement>(null)
 
   const [name, setName] = useState<string>('')
   const [price, setPrice] = useState<number>(10)
@@ -27,12 +28,24 @@ export default function BerryDashSubmitIcon () {
       router.push(
         '/account/login?redirect=/game/berry-dash/icon-marketplace/upload'
       )
-    } else setLoading(false)
-  }, [])
+    } else setTimeout(() => setLoading(false), 0)
+
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') {
+        backButtonRef.current?.click()
+      }
+    }
+
+    window.addEventListener('keydown', handleKeyDown)
+    return () => window.removeEventListener('keydown', handleKeyDown)
+  }, [router])
 
   return (
     <div className='box'>
-      <BackButton href='/game/berry-dash/icon-marketplace' />
+      <BackButton
+        href='/game/berry-dash/icon-marketplace'
+        refLink={backButtonRef}
+      />
       <ReloadButton action={() => window.location.reload()} />
       <p className={`px-8 ${loading ? '-my-2' : 'mb-4 -mt-2'} text-center`}>
         {loading