[feat/#54] modify API URL & pagination

src/components/Assignment.tsx

@@ -4,8 +4,7 @@ import "../style/home.css";
 import Modal from "../props/Modal";
 import Navbar from "./Navbar";
 import { navPropsType } from "./Navbar";
-import axios from "axios";
-import { stringify } from "querystring";
+import api from "../utils/api";
 
 const Assignment: FC = () => {
   interface UrlResp {
@@ -32,16 +31,16 @@ const Assignment: FC = () => {
   const [isProfessor, setIsProfessor] = useState<boolean>(false);
 
   useEffect(() => {
-    axios
-      .get("http://moaroom-back.duckdns.org:8080/url/" + user_id)
+    api.client
+      .get("/urls/" + user_id)
       .then((response) => {
         setUrl(response.data.containerAddress);
       });
   }, []);
 
   useEffect(() => {
-    axios
-      .get("http://moaroom-back.duckdns.org:8080/user/" + user_id)
+    api.client
+      .get("/users/" + user_id)
       .then((response) => {
         if (response.data.role == 2) {
           setIsProfessor(true);

src/components/AssignmentPage.tsx

@@ -1,13 +1,13 @@
 import React, { FC, useState, useCallback, useEffect } from "react";
 import { useNavigate, useLocation } from "react-router-dom";
 import { useForm } from "react-hook-form";
-import axios from "axios";
 import "../style/LecturePage.css";
 import Paging from "../components/Paging";
 import Assignment from "../props/Assignment";
 import AssignmentModal from "../props/AssignmentModal";
 import Navbar from "./Navbar";
 import { navPropsType } from "./Navbar";
+import api from "../utils/api";
 
 export type AssignmentType = {
   lecture_id: string;
@@ -56,8 +56,8 @@ const AssignmentPage: FC = () => {
   };
   const deleteAssignment = (data: any) => {
     const title = data.title;
-    axios
-      .delete("http://moaroom-back.duckdns.org:8080/assignment/" + title)
+    api.client
+      .delete("/assignments/" + title)
       .then(function(response) {
         if (response.data == "삭제 성공") {
           alert("과제가 삭제되었습니다.");
@@ -74,8 +74,8 @@ const AssignmentPage: FC = () => {
 
   useEffect(() => {
     var tmpList: AssignmentPropType[] = [];
-    axios
-      .get("http://moaroom-back.duckdns.org:8080/assignment/all/" + user_id)
+    api.client
+      .get("/assignments/users/" + user_id)
       .then((response) => {
         for (let i = 0; i < response.data.length; i++) {
           if (lecture_id == response.data[i].lecture_id) {
@@ -202,7 +202,7 @@ const AssignmentPage: FC = () => {
           )}
           {
             assignmentPropsList == null &&(
-              <Paging />
+              <Paging count={assignmentList.length}/>
             )
           }
         </div>

src/components/Home.tsx

@@ -5,8 +5,12 @@ import { navPropsType } from "./Navbar";
 import { useLocation } from "react-router-dom";
 const Home: FC = () => {
   const location = useLocation();
-  const user_id = location.state.user_id;
-  const isProfessor = location.state.isProfessor;
+  var user_id = null;
+  var isProfessor = null;
+  if(localStorage.getItem("isLogin")){
+    user_id = location.state.user_id;
+    isProfessor = location.state.isProfessor;
+  }
   return (
     <>
       <div className="background">

src/components/LecturePage.tsx

@@ -1,17 +1,17 @@
 import React, { FC, useEffect, useState } from "react";
 import { useLocation } from "react-router-dom";
 import "../style/LecturePage.css";
-import axios from "axios";
 import Lecture from "../props/Lecture";
 import Paging from "../components/Paging";
 import Navbar from "./Navbar";
 import { navPropsType } from "./Navbar";
+import api from "../utils/api";
 
 export type LectureType = {
   lecture_id: string;
   title: string;
-  professor_name: string;
   room: number;
+  professor_name: string;
   enroll: Boolean | null;
 };
 
@@ -21,8 +21,8 @@ const LecturePage: FC = () => {
   const [lectureList, setLectureList] = useState<LectureType[]>([]);
   const [isProfessor, setIsProfessor] = useState<Boolean>(true);
   useEffect(() => {
-    axios
-      .get("http://moaroom-back.duckdns.org:8080/lecture/all/" + user_id)
+    api.client
+      .get("/lectures/users/" + user_id)
       .then((response) => {
         setLectureList(response.data);
         if (response.data.length != 0 && response.data[0].enroll != null) {
@@ -73,7 +73,7 @@ const LecturePage: FC = () => {
             ))}
           {
             lectureList != null && (
-              <Paging />
+              <Paging count={lectureList.length} />
             )
           }
         </div>

src/components/#.tsx

@@ -1,12 +1,11 @@
 import React, { FC, useState, useEffect } from "react";
 import { useForm } from "react-hook-form";
 import "../style/home.css";
-import axios from "axios";
 import { ToastContainer, toast, Flip } from "react-toastify";
 import "react-toastify/dist/ReactToastify.min.css";
 import { useNavigate } from "react-router";
 import Navbar from "./Navbar";
-import navPropsType from "./Navbar";
+import api from "../utils/api";
 const Login: FC = (): JSX.Element => {
   const navigate = useNavigate();
   const [loginInfo, setLoginInfo] = useState({
@@ -33,8 +32,8 @@ const Login: FC = (): JSX.Element => {
     });
   };
   useEffect(() => {
-    axios
-      .get("http://moaroom-back.duckdns.org:8080/user/" + user_id)
+    api.client
+      .get("/users/" + user_id)
       .then((response) => {
         if (response.data.role == 2) {
           setIsProfessor(true);
@@ -49,9 +48,8 @@ const Login: FC = (): JSX.Element => {
     };
     console.log(params);
 
-    // TODO 서버 나오면 디버깅 필요
-    axios
-      .post("http://moaroom-back.duckdns.org:8080/#", params)
+    api.client
+      .post("/#", params)
       .then(function(response) {
         if (response.data === "") {
           alert("로그인 정보가 없습니다. 다시 로그인 해주세요.");