From ee690830907a1b0ffb428bb1b628dde60d67add6 Mon Sep 17 00:00:00 2001
From: nzambello <nzambello@protonmail.com>
Date: Mon, 10 Feb 2020 19:58:38 +0100
Subject: [PATCH] added focus on load

---
 .editorconfig | 12 ++++++++++++
 package.json  |  2 +-
 src/App.js    | 37 ++++++++++++++++++++++++++++---------
 3 files changed, 41 insertions(+), 10 deletions(-)
 create mode 100644 .editorconfig

diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000..7d0f474
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,12 @@
+[*]
+indent_style = space
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+charset = utf-8
+
+[{*.css,*.scss}]
+indent_size = 4
+
+[{*.js,*.json}]
+indent_size = 2
\ No newline at end of file
diff --git a/package.json b/package.json
index d5b5456..9a9677a 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,7 @@
   },
   "scripts": {
     "start": "react-scripts start",
-    "build": "react-scripts build",
+    "build": "INLINE_RUNTIME_CHUNK=false react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
diff --git a/src/App.js b/src/App.js
index d59abe4..3d15e94 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,4 +1,4 @@
-import React, {useState} from 'react';
+import React, {useState, useEffect} from 'react';
 import './App.css';
 
 const parseTime = time => {
@@ -8,18 +8,37 @@ const parseTime = time => {
 };
 
 const App = () => {
-  const [hours, setHours] = useState(0)
-  const [minutes, setMinutes] = useState(0)
-  const [seconds, setSeconds] = useState(0)
+  const [hours, setHours] = useState(0);
+  const [minutes, setMinutes] = useState(0);
+  const [seconds, setSeconds] = useState(0);
 
-  const result = hours + minutes / 60 + seconds / (60 * 60)
+  useEffect(() => {
+    document.getElementById('hours').focus();
+  }, []);
+
+  const result = hours + minutes / 60 + seconds / (60 * 60);
 
   return (
     <div className="App">
       <div>
-        <input id="hours" type="text" value={hours} onChange={e => setHours(parseTime(e.target.value, 10))} />
-        <input id="minutes" type="text" value={minutes} onChange={e => setMinutes(parseTime(e.target.value, 10))} />
-        <input id="seconds" type="text" value={seconds} onChange={e => setSeconds(parseTime(e.target.value, 10))} />
+        <input
+          id="hours"
+          type="text"
+          value={hours}
+          onChange={e => setHours(parseTime(e.target.value, 10))}
+        />
+        <input
+          id="minutes"
+          type="text"
+          value={minutes}
+          onChange={e => setMinutes(parseTime(e.target.value, 10))}
+        />
+        <input
+          id="seconds"
+          type="text"
+          value={seconds}
+          onChange={e => setSeconds(parseTime(e.target.value, 10))}
+        />
       </div>
       <br />
       <div>
@@ -27,6 +46,6 @@ const App = () => {
       </div>
     </div>
   );
-}
+};
 
 export default App;