Add sleep duration, heartrate on /profile

pages/components/Fitbit/Heartrate.js

@@ -0,0 +1,36 @@
+// Data fetching
+import useSwr from 'swr'
+
+// Font Awesome
+import { faHeartbeat } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+
+// Data fetching implements
+const fetcher = (url) => fetch(url).then((res) => res.json())
+
+function App (props) {
+  const { data, error } = useSwr(
+    '/api/Fitbit/Heartrate',
+    fetcher
+  )
+  
+  if (error) {
+    return (
+      <>エラーが発生しました。</>
+    )
+  } else {
+    if (!data) {
+      return (
+        <>読み込み中...</>
+      )
+    } else {
+        return (
+            <>
+                <FontAwesomeIcon icon={faHeartbeat} className="w-5 h-5 inline ml-3"/> {data.heartrate}
+            </>
+        )
+    }
+  }
+}
+
+export default App;

pages/components/Fitbit/Sleep.js

@@ -0,0 +1,42 @@
+// Data fetching
+import useSwr from 'swr'
+
+// Font Awesome
+import { faBed } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+
+// Data fetching implements
+const fetcher = (url) => fetch(url).then((res) => res.json())
+
+function App (props) {
+  const { data, error } = useSwr(
+    '/api/Fitbit/Sleep',
+    fetcher
+  )
+  
+  if (error) {
+    return (
+      <>エラーが発生しました。</>
+    )
+  } else {
+    if (!data) {
+      return (
+        <>読み込み中...</>
+      )
+    } else {
+        const duration = data.duration
+        const hours = Math.floor(duration / 60)
+        let minutes = duration % 60
+        if (minutes <= 9) {
+            minutes = '0' + minutes
+        }
+        return (
+            <>
+                <FontAwesomeIcon icon={faBed} className="w-5 h-5 inline"/> {hours}:{minutes}
+            </>
+        )
+    }
+  }
+}
+
+export default App;