Adjust text input size

Author: nicolelim02

frontend/src/components/QuestionCategoryAutoComplete/index.tsx

@@ -26,7 +26,6 @@ const QuestionCategoryAutoComplete: React.FC<
       multiple
       freeSolo
       options={state.questionCategories}
-      size="small"
       sx={{ marginTop: 2 }}
       value={selectedCategories}
       onChange={(_e, newCategoriesSelected) => {

frontend/src/pages/NewQuestion/index.tsx

@@ -34,7 +34,7 @@ const NewQuestion = () => {
   const [title, setTitle] = useState<string>("");
   const [markdownText, setMarkdownText] = useState<string>("");
   const [selectedComplexity, setselectedComplexity] = useState<string | null>(
-    null,
+    null
   );
   const [selectedCategories, setSelectedCategories] = useState<string[]>([]);
   const [uploadedImagesUrl, setUploadedImagesUrl] = useState<string[]>([]);
@@ -49,7 +49,7 @@ const NewQuestion = () => {
     ) {
       if (
         !confirm(
-          "Are you sure you want to leave this page? All process will be lost.",
+          "Are you sure you want to leave this page? All process will be lost."
         )
       ) {
         return;
@@ -76,7 +76,7 @@ const NewQuestion = () => {
         complexity: selectedComplexity,
         categories: selectedCategories,
       },
-      dispatch,
+      dispatch
     );
 
     if (result) {
@@ -105,7 +105,6 @@ const NewQuestion = () => {
           <TextField
             label="Title"
             variant="outlined"
-            size="small"
             fullWidth
             autoComplete="off"
             value={title}
@@ -115,7 +114,6 @@ const NewQuestion = () => {
 
           <Autocomplete
             options={complexityList}
-            size="small"
             sx={{ marginTop: 2 }}
             onChange={(_e, newcomplexitySelected) => {
               setselectedComplexity(newcomplexitySelected);

frontend/src/pages/QuestionEdit/index.tsx

@@ -37,7 +37,7 @@ const QuestionEdit = () => {
   const [title, setTitle] = useState<string>("");
   const [markdownText, setMarkdownText] = useState<string>("");
   const [selectedComplexity, setselectedComplexity] = useState<string | null>(
-    null,
+    null
   );
   const [selectedCategories, setSelectedCategories] = useState<string[]>([]);
   const [uploadedImagesUrl, setUploadedImagesUrl] = useState<string[]>([]);
@@ -63,7 +63,7 @@ const QuestionEdit = () => {
   const handleBack = () => {
     if (
       !confirm(
-        "Are you sure you want to leave this page? All process will be lost.",
+        "Are you sure you want to leave this page? All process will be lost."
       )
     ) {
       return;
@@ -104,7 +104,7 @@ const QuestionEdit = () => {
         complexity: selectedComplexity,
         categories: selectedCategories,
       },
-      dispatch,
+      dispatch
     );
 
     if (result) {
@@ -133,7 +133,6 @@ const QuestionEdit = () => {
           <TextField
             label="Title"
             variant="outlined"
-            size="small"
             fullWidth
             autoComplete="off"
             value={title}
@@ -143,7 +142,6 @@ const QuestionEdit = () => {
 
           <Autocomplete
             options={complexityList}
-            size="small"
             sx={{ marginTop: 2 }}
             value={selectedComplexity}
             onChange={(_e, newcomplexitySelected) => {

frontend/src/theme.ts

@@ -26,6 +26,8 @@ const theme = createTheme({
         },
       },
     },
+    MuiTextField: { defaultProps: { size: "small" } },
+    MuiAutocomplete: { defaultProps: { size: "small" } },
     MuiCssBaseline: {
       styleOverrides: {
         html: {

frontend/vite.config.ts

@@ -5,4 +5,5 @@ import svgr from "vite-plugin-svgr";
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [react(), svgr()],
+  optimizeDeps: { include: ["@mui/material", "@mui/icons-material"] },
 });