Handling multiple data files in subjectBrowser and allQuestions

src/pages/_app.js

@@ -2,11 +2,64 @@
 
 import '../defaultStyles.css'
 import Layout from '../components/layout'
+import constants from '../constants.json'
+
+var data = null
+
+function fetchData() {
+  return new Promise((resolve) => {
+    if (data) {
+      resolve(data)
+      return
+    }
+
+    console.info('Fetching data')
+    fetch(`${constants.apiUrl}getDbs`, {
+      credentials: 'include',
+    })
+      .then((resp) => {
+        return resp.json()
+      })
+      .then((data) => {
+        const promises = data.map((db) => {
+          return fetch(`${constants.apiUrl}${db.path}`, {
+            credentials: 'include',
+          }).then((resp) => {
+            return new Promise((resolve) => {
+              resp.json().then((jsonRes) => {
+                resolve({
+                  dbName: db.name,
+                  data: jsonRes,
+                })
+              })
+            })
+          })
+        })
+
+        Promise.all(promises).then((data) => {
+          const mergedData = data.reduce((acc, db) => {
+            return [
+              ...acc,
+              ...db.data.map((subj) => {
+                return {
+                  ...subj,
+                  Name: `${subj.Name} (${db.dbName})`,
+                }
+              }),
+            ]
+          }, [])
+
+          data = mergedData
+          resolve(mergedData)
+        })
+      })
+  })
+}
 
 function MyApp({ Component, pageProps, router }) {
   return (
     <Layout route={router.route}>
-      <Component {...pageProps} router={router} />
+      <Component {...pageProps} router={router} getData={fetchData} />
     </Layout>
   )
 }