Add comments to new question frontend, clean code

Author: guanquann

frontend/src/App.tsx

@@ -1,14 +1,14 @@
-import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
+import { BrowserRouter, Routes, Route } from "react-router-dom";
 import NewQuestion from "./pages/NewQuestion";
 
 function App() {
   return (
-    <Router>
+    <BrowserRouter>
       <Routes>
         <Route path="/question" element={<>question page list</>} />
         <Route path="/question/new" element={<NewQuestion />} />
       </Routes>
-    </Router>
+    </BrowserRouter>
   );
 }
 

frontend/src/components/question/QuestionImage.tsx renamed to frontend/src/components/NewQuestion/QuestionImage.tsx

@@ -1,3 +1,5 @@
+// technically this should be in the backend...
+
 import { initializeApp } from "firebase/app";
 import { getStorage } from "firebase/storage";
 

frontend/src/components/question/QuestionImageContainer.tsx renamed to frontend/src/components/NewQuestion/QuestionImageContainer.tsx

@@ -1,33 +1,8 @@
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import App from "./App.tsx";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-
-const theme = createTheme({
-  palette: {
-    primary: {
-      main: "#8FB8ED",
-      contrastText: "#FFFFFF",
-    },
-    secondary: {
-      main: "#ECECEC",
-      contrastText: "#757575",
-    },
-  },
-  components: {
-    MuiButton: {
-      styleOverrides: {
-        root: {
-          textTransform: "none",
-          fontWeight: "bold",
-          // ":hover": {
-          //   backgroundColor: "",
-          // },
-        },
-      },
-    },
-  },
-});
+import theme from "./theme";
+import { ThemeProvider } from "@mui/material/styles";
 
 createRoot(document.getElementById("root")!).render(
   <StrictMode>

frontend/src/components/question/QuestionImageDialog.tsx renamed to frontend/src/components/NewQuestion/QuestionImageDialog.tsx

@@ -9,8 +9,8 @@ import { v4 as uuidv4 } from "uuid";
 import { storage } from "../firebase";
 import { getDownloadURL, ref, uploadBytesResumable } from "firebase/storage";
 
-import QuestionMarkdown from "../components/question/QuestionMarkdown";
-import QuestionImageContainer from "../components/question/QuestionImageContainer";
+import QuestionMarkdown from "../components/NewQuestion/QuestionMarkdown";
+import QuestionImageContainer from "../components/NewQuestion/QuestionImageContainer";
 
 // hardcode for now
 const difficultyList: string[] = ["Easy", "Medium", "Hard"];

frontend/src/components/question/QuestionMarkdown.tsx renamed to frontend/src/components/NewQuestion/QuestionMarkdown.tsx

@@ -0,0 +1,26 @@
+import { createTheme } from "@mui/material/styles";
+
+const theme = createTheme({
+  palette: {
+    primary: {
+      main: "#8FB8ED",
+      contrastText: "#FFFFFF",
+    },
+    secondary: {
+      main: "#ECECEC",
+      contrastText: "#757575",
+    },
+  },
+  components: {
+    MuiButton: {
+      styleOverrides: {
+        root: {
+          textTransform: "none",
+          fontWeight: "bold",
+        },
+      },
+    },
+  },
+});
+
+export default theme;