[문지영] sprint7

src/App.jsx

@@ -1,48 +1,61 @@
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import GlobalStyle from './styles/GlobalStyle';
 import { ThemeProvider } from 'styled-components';
+import { AuthProvider } from './context/AuthContext';
 import theme from './styles/theme';
 import Header from './components/Layout/Header';
 import HomePage from './components/pages/HomePage';
 import LoginPage from './components/pages/LoginPage';
+import SignupPage from './components/pages/SignupPage';
 import MarketPage from './components/pages/MarketPage/MarketPage';
 import AddItemPage from './components/pages/AddItemPage/AddItemPage';
 import CommunityFeedPage from './components/pages/CommunityFeedPage';
+import ItemDetailPage from './components/pages/ItemDetailPage/ItemDetailPage';
 
 function App() {
   return (
     <>
-      <ThemeProvider theme={theme}>
-        <GlobalStyle />
-        <BrowserRouter>
-          <Header />
+      <AuthProvider>
+        <ThemeProvider theme={theme}>
+          <GlobalStyle />
+          <BrowserRouter>
+            <Header />
 
-          <div>
-            <Routes>
-              <Route
-                index
-                element={<HomePage />}
-              />
-              <Route
-                path="/login"
-                element={<LoginPage />}
-              />
-              <Route
-                path="/items"
-                element={<MarketPage />}
-              />
-              <Route
-                path="/additem"
-                element={<AddItemPage />}
-              />
-              <Route
-                path="/community"
-                element={<CommunityFeedPage />}
-              />
-            </Routes>
-          </div>
-        </BrowserRouter>
-      </ThemeProvider>
+            <div>
+              <Routes>
+                <Route
+                  index
+                  element={<HomePage />}
+                />
+                <Route
+                  path="/login"
+                  element={<LoginPage />}
+                />
+                <Route
+                  path="/signup"
+                  element={<SignupPage />}
+                />
+                <Route
+                  path="/items"
+                  element={<MarketPage />}
+                />
+                <Route
+                  path="/additem"
+                  element={<AddItemPage />}
+                />
+                <Route
+                  path="/community"
+                  element={<CommunityFeedPage />}
+                />
+                <Route
+                  path="/items/:productId"
+                  element={<ItemDetailPage />}
+                />
+              </Routes>
+            </div>
+          </BrowserRouter>
+        </ThemeProvider>
+      </AuthProvider>
     </>
   );
 }

src/api/api.js

@@ -13,3 +13,112 @@ export const getProducts = async ({ page = 1, pageSize = 10, orderBy = 'recent',
     throw error;
   }
 };
+
+export const getProductDetail = async (productId) => {
+  try {
+    const res = await axios.get(`${baseURL}/products/${productId}`);
+    return res.data;
+  } catch (error) {
+    console.log('상품 상세 정보 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const postProduct = async (product) => {
+  try {
+    const token = localStorage.getItem('token');
+    const res = await axios.post(`${baseURL}/products`, product, {
+      headers: {
+        Authorization: `Bearer ${token}`,
+        'Content-Type': 'application/json',
+      },
+    });
+    return res.data;
+  } catch (error) {
+    console.log('상품 등록 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const postComment = async (productId, content) => {
+  try {
+    const token = localStorage.getItem('token');
+    const res = await axios.post(
+      `${baseURL}/products/${productId}/comments`,
+      { content: content },
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+      }
+    );
+    return res.data;
+  } catch (error) {
+    console.log('상품 댓글 등록 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const getComments = async (productId, limit = 10, cursor = null) => {
+  try {
+    const res = await axios.get(`${baseURL}/products/${productId}/comments`, {
+      params: {
+        limit,
+        cursor,
+      },
+    });
+    return res.data;
+  } catch (error) {
+    console.log('상품 댓글 목록 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const patchComment = async (commentId, content) => {
+  try {
+    const res = await axios.patch(`${baseURL}/comments/${commentId}`, { content: content });
+    return res.data;
+  } catch (error) {
+    console.log('상품 댓글 수정 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const deleteComment = async (commentId) => {
+  try {
+    const res = await axios.delete(`${baseURL}/comments/${commentId}`);
+    return res.data;
+  } catch (error) {
+    console.log('상품 댓글 삭제 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const postSignup = async (email, password, nickname, passwordConfirmation) => {
+  try {
+    const res = await axios.post(`${baseURL}/auth/signup`, {
+      email,
+      password,
+      nickname,
+      passwordConfirmation,
+    });
+    return res.data;
+  } catch (error) {
+    console.log('회원가입 api 호출 실패 :', error.message);
+    throw error;
+  }
+};
+
+export const postLogin = async (email, password) => {
+  try {
+    const res = await axios.post(`${baseURL}/auth/signin`, {
+      email,
+      password,
+    });
+    return res.data;
+  } catch (error) {
+    console.log('로그인 api 호출 실패 :', error.message);
+    throw error;
+  }
+};