Context Setup

Author: pktcodes

src/App.js

@@ -1,11 +1,21 @@
-import React from 'react'
-import { useGlobalContext } from './context'
+import React from "react";
+import { useGlobalContext } from "./context";
 
-import SetupForm from './SetupForm'
-import Loading from './Loading'
-import Modal from './Modal'
+import SetupForm from "./SetupForm";
+import Loading from "./Loading";
+import Modal from "./Modal";
 function App() {
-  return <h2>quiz starter</h2>
+  const { waiting, loading, questions, index, correct } = useGlobalContext();
+
+  if (waiting) {
+    return <SetupForm></SetupForm>;
+  }
+
+  if (loading) {
+    return <Loading></Loading>;
+  }
+
+  return <main>quiz app</main>;
 }
 
-export default App
+export default App;

src/context.js

@@ -17,7 +17,29 @@ const tempUrl =
 const AppContext = React.createContext();
 
 const AppProvider = ({ children }) => {
-  return <AppContext.Provider value="hello">{children}</AppContext.Provider>;
+  const [waiting, setWaiting] = useState(true);
+  const [loading, setLoading] = useState(false);
+  const [questions, setQuestions] = useState([]);
+  const [index, setIndex] = useState(0);
+  const [correct, setCorrect] = useState(0);
+  const [error, setError] = useState(false);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+
+  return (
+    <AppContext.Provider
+      value={{
+        waiting,
+        loading,
+        questions,
+        index,
+        correct,
+        error,
+        isModalOpen,
+      }}
+    >
+      {children}
+    </AppContext.Provider>
+  );
 };
 // make sure use
 export const useGlobalContext = () => {