Skip to content

Commit b2e8328

Browse files
guanquannguanquann
committed
Change to axios
1 parent 2589987 commit b2e8328

File tree

4 files changed

+64
-56
lines changed

4 files changed

+64
-56
lines changed

‎backend/question-service/.env.sample‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
MONGO_URI=MONGO_URI
22

33
FIREBASE_PROJECT_ID=FIREBASE_PROJECT_ID
4-
FIREBASE_PRIVATE_KEY=-FIREBASE_PRIVATE_KEY
4+
FIREBASE_PRIVATE_KEY=FIREBASE_PRIVATE_KEY
55
FIREBASE_CLIENT_EMAIL=FIREBASE_CLIENT_EMAIL
66
FIREBASE_STORAGE_BUCKET=FIREBASE_STORAGE_BUCKET

‎frontend/src/pages/NewQuestion/index.tsx‎

Lines changed: 32 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,11 @@ import { useState } from "react";
22
import { useNavigate } from "react-router-dom";
33
import { Autocomplete, Button, IconButton, Stack, TextField } from "@mui/material";
44
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
5+
import axios from "axios";
56
import { ToastContainer, toast } from "react-toastify";
67
import "react-toastify/dist/ReactToastify.css";
78

9+
import { questionClient } from "../../utils/api";
810
import { complexityList, categoryList } from "../../utils/constants";
911
import AppMargin from "../../components/AppMargin";
1012
import QuestionMarkdown from "../../components/QuestionMarkdown";
@@ -48,23 +50,26 @@ const NewQuestion = () => {
4850
}
4951

5052
try {
51-
const response = await fetch("http://localhost:3000/api/questions/images", {
52-
method: "POST",
53-
body: formData,
53+
const response = await questionClient.post("/images", formData, {
54+
headers: {
55+
"Content-Type": "multipart/form-data",
56+
},
57+
withCredentials: false,
5458
});
5559

56-
if (!response.ok) {
57-
throw new Error("Failed to upload image");
58-
}
59-
60-
const data = await response.json();
60+
const data = response.data;
6161
for (const imageUrl of data.imageUrls) {
6262
setUploadedImagesUrl((prev) => [...prev, imageUrl]);
6363
}
64+
6465
toast.success("File uploaded successfully");
6566
} catch (error) {
66-
console.error(error);
67-
toast.error("Error uploading file");
67+
if (axios.isAxiosError(error)) {
68+
toast.error(error.response?.data.message || "Error uploading file");
69+
} else {
70+
console.error(error);
71+
toast.error("Error uploading file");
72+
}
6873
}
6974
};
7075

@@ -75,29 +80,29 @@ const NewQuestion = () => {
7580
}
7681

7782
try {
78-
const response = await fetch("http://localhost:3000/api/questions", {
79-
method: "POST",
80-
headers: {
81-
"Content-Type": "application/json",
82-
},
83-
body: JSON.stringify({
83+
await questionClient.post(
84+
"/",
85+
{
8486
title,
8587
description: markdownText,
8688
complexity: selectedComplexity,
8789
category: selectedCategories,
88-
}),
89-
});
90-
91-
const data = await response.json();
92-
if (response.status === 400) {
93-
toast.error(data.message);
94-
return;
95-
}
96-
90+
},
91+
{
92+
withCredentials: false,
93+
headers: {
94+
"Content-Type": "application/json",
95+
},
96+
}
97+
);
9798
navigate("/questions");
9899
} catch (error) {
99-
console.error(error);
100-
toast.error("Failed to create question");
100+
if (axios.isAxiosError(error)) {
101+
const message = error.response?.data.message || "Failed to create question";
102+
toast.error(message);
103+
} else {
104+
toast.error("Failed to create question");
105+
}
101106
}
102107
};
103108

‎frontend/src/pages/QuestionEdit/index.tsx‎

Lines changed: 30 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,11 @@ import { useEffect, useState, useReducer } from "react";
22
import { useNavigate, useParams } from "react-router-dom";
33
import { Autocomplete, Button, IconButton, Stack, TextField } from "@mui/material";
44
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
5+
import axios from "axios";
56
import { ToastContainer, toast } from "react-toastify";
67
import "react-toastify/dist/ReactToastify.css";
78

9+
import { questionClient } from "../../utils/api";
810
import { complexityList, categoryList } from "../../utils/constants";
911
import reducer, { getQuestionById, initialState } from "../../reducers/questionReducer";
1012
import AppMargin from "../../components/AppMargin";
@@ -67,23 +69,26 @@ const QuestionEdit = () => {
6769
}
6870

6971
try {
70-
const response = await fetch("http://localhost:3000/api/questions/images", {
71-
method: "POST",
72-
body: formData,
72+
const response = await questionClient.post("/images", formData, {
73+
headers: {
74+
"Content-Type": "multipart/form-data",
75+
},
76+
withCredentials: false,
7377
});
7478

75-
if (!response.ok) {
76-
throw new Error("Failed to upload image");
77-
}
78-
79-
const data = await response.json();
79+
const data = response.data;
8080
for (const imageUrl of data.imageUrls) {
8181
setUploadedImagesUrl((prev) => [...prev, imageUrl]);
8282
}
83+
8384
toast.success("File uploaded successfully");
8485
} catch (error) {
85-
console.error(error);
86-
toast.error("Error uploading file");
86+
if (axios.isAxiosError(error)) {
87+
toast.error(error.response?.data.message || "Error uploading file");
88+
} else {
89+
console.error(error);
90+
toast.error("Error uploading file");
91+
}
8792
}
8893
};
8994

@@ -103,32 +108,30 @@ const QuestionEdit = () => {
103108
}
104109

105110
try {
106-
const response = await fetch(
107-
`http://localhost:3000/api/questions/${state.selectedQuestion.questionId}`,
111+
await questionClient.put(
112+
`/${state.selectedQuestion.questionId}`,
108113
{
109-
method: "PUT",
114+
title,
115+
description: markdownText,
116+
complexity: selectedComplexity,
117+
category: selectedCategories,
118+
},
119+
{
120+
withCredentials: false,
110121
headers: {
111122
"Content-Type": "application/json",
112123
},
113-
body: JSON.stringify({
114-
title,
115-
description: markdownText,
116-
complexity: selectedComplexity,
117-
category: selectedCategories,
118-
}),
119124
}
120125
);
121126

122-
const data = await response.json();
123-
if (response.status === 400) {
124-
toast.error(data.message);
125-
return;
126-
}
127-
128127
navigate("/questions");
129128
} catch (error) {
130-
console.error(error);
131-
toast.error("Failed to updated question");
129+
if (axios.isAxiosError(error)) {
130+
const message = error.response?.data.message || "Failed to update question";
131+
toast.error(message);
132+
} else {
133+
toast.error("Failed to update question");
134+
}
132135
}
133136
};
134137

‎frontend/src/utils/api.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import axios from "axios";
22

3-
const questionsUrl = "http://localhost:3001";
3+
const questionsUrl = "http://localhost:3000/api/questions";
44

55
export const questionClient = axios.create({
66
baseURL: questionsUrl,

0 commit comments

Comments
 (0)