Fix types, dont you love typescript

S33G · Mar 7, 2024 · 89b2966 · 89b2966
1 parent f82013d
commit 89b2966
Showing 1 changed file with 19 additions and 1 deletion.
diff --git a/src/App.tsx b/src/App.tsx
@@ -59,6 +59,24 @@ function App() {
       .catch(error => setError(error.message))
   }, [sightingId])
 
+  // Fix: Add type assertion to event target
+  if (!sightingId) return (
+    <form onSubmit={(e) => {
+      setSightingId((e.currentTarget.elements[0] as HTMLInputElement).value)
+      e.preventDefault()
+    }}>
+      <h1>Enter a Sighting ID</h1>
+      <input
+        type="text"
+        defaultValue={'a1816a52-da0a-11ee-9685-3030f93453f4'}
+        width={100}
+      />
+      <input type="submit" value="Submit" />
+      <input type="button" value="Demo" onClick={() => setSightingId('a1816a52-da0a-11ee-9685-3030f93453f4')} />
+      <input type="button" value="Demo (error)" onClick={() => setSightingId('404-404-404')} />
+    </form>
+  )
+
   useEffect(() => {
     if (sighting) {
       console.log(sighting)
@@ -68,7 +86,7 @@ function App() {
   if (!isOnline) return <div>Please connect to the internet</div>
   if (!sightingId) return (
     <form onSubmit={(e) => {
-      setSightingId(e.currentTarget.elements[0].value)
+      setSightingId((e.currentTarget.elements[0] as HTMLInputElement).value)
       e.preventDefault()
     }}>
       <h1>Enter a Sighting ID</h1>