Merge pull request #76 from KUIT-Space/feat#51-chat_detail

Feat#51 chat detail

.gitignore

@@ -24,3 +24,5 @@ dist-ssr
 *.sw?
 localhost-key.pem
 localhost.pem
+.env
+*_mockChat.tsx

src/apis/ChatroomCreateApi.ts

@@ -0,0 +1,46 @@
+import { createRequestOptionsFORM_AUTH, fetchApi } from "@/apis/_createRequestOptions";
+
+interface CreateChatroomApiResponseType {
+  code: number;
+  status: number;
+  message: string;
+  result: {
+    chatRoomId: number;
+  };
+}
+
+interface CreateChatroomApiRequestType {
+  img?: File | null; // 이미지 파일은 선택적
+  name: string;
+  memberList: number[];
+}
+
+const createChatroomFormData = (body: CreateChatroomApiRequestType): FormData => {
+  const formData = new FormData();
+  formData.append("name", body.name);
+
+  if (body.img) {
+    formData.append("img", body.img);
+  }
+
+  body.memberList.forEach((memberId) => {
+    formData.append("memberList", memberId.toString());
+  });
+
+  return formData;
+};
+
+export const createChatroomApi = async (
+  spaceId: number,
+  name: string,
+  memberList: number[],
+  img?: File | null,
+) => {
+  const formData = createChatroomFormData({ name, memberList, img: img || null });
+  const requestOptions = createRequestOptionsFORM_AUTH("POST", formData);
+
+  if (!requestOptions) return null;
+
+  const url = `${import.meta.env.VITE_API_BACK_URL}/space/${spaceId}/chat/chatroom`;
+  return await fetchApi<CreateChatroomApiResponseType>(url, requestOptions);
+};

src/apis/ChatroomSearchAllApi.ts

@@ -0,0 +1,25 @@
+import { createRequestOptionsJSON_AUTH, fetchApi } from "@/apis/_createRequestOptions";
+
+export interface Chatroom {
+  id: number;
+  name: string;
+  imgUrl: string;
+  lastMsg: string;
+  lastTime: string;
+  unreadMsgCount: number;
+}
+
+interface ChatroomSearchApiResponse {
+  code: number;
+  status: number;
+  message: string;
+  result: { chatRoomList: Chatroom[] };
+}
+
+export const chatroomSearchAllApi = async (spaceId: number) => {
+  const requestOptions = createRequestOptionsJSON_AUTH("GET");
+  if (!requestOptions) return null;
+
+  const url = `${import.meta.env.VITE_API_BACK_URL}/space/${spaceId}/chat/chatroom`;
+  return await fetchApi<ChatroomSearchApiResponse>(url, requestOptions);
+};

src/apis/LoginApi.ts

@@ -1,4 +1,4 @@
-import { createRequestOptionsJSON, RequestOptions } from "./_createRequestOptions";
+import { createRequestOptionsJSON, RequestOptions } from "@/apis/_createRequestOptions";
 
 interface LoginApiResponseType {
   code: number;

src/apis/SpaceCreateApi.ts

@@ -0,0 +1,51 @@
+/* POST /space
+ * @summary Create a Space
+ * @body json이 아닌 form-data로 전송해야 함
+ * * spaceName	Text(String)	1~10 자 이내의 문자열
+ * * spaceProfileImg	File	nullable / 이미지 파일 확장자 형식을 지키는 이미지 파일
+ * @return status OK - success response
+ */
+import { createRequestOptionsFORM_AUTH, RequestOptions } from "@/apis/_createRequestOptions";
+
+interface CreateSpaceApiResponseType {
+  code: number;
+  message: string;
+  status: string;
+  timestamp?: string;
+}
+
+interface CreateSpaceApiRequestType {
+  spaceName: string;
+  spaceProfileImg?: File | null; // 이미지 파일은 선택적
+}
+
+const fetchCreateSpaceApi = async (url: string, options: RequestOptions) => {
+  const response: CreateSpaceApiResponseType = await fetch(url, options)
+    .then((res) => res.json())
+    .catch((err) => {
+      console.error("[fetch error]", err);
+      throw err;
+    });
+
+  return response;
+};
+
+export const createSpaceApi = async (spaceName: string, spaceProfileImg?: File | null) => {
+  const body: CreateSpaceApiRequestType = {
+    spaceName: spaceName,
+    spaceProfileImg: spaceProfileImg || null,
+  };
+
+  const formData = new FormData();
+  formData.append("spaceName", body.spaceName);
+  if (body.spaceProfileImg) {
+    formData.append("spaceProfileImg", body.spaceProfileImg);
+  }
+
+  const requestOptions = createRequestOptionsFORM_AUTH("POST", formData);
+  const result = requestOptions
+    ? await fetchCreateSpaceApi(`${import.meta.env.VITE_API_BACK_URL}/space`, requestOptions)
+    : null;
+
+  return result;
+};

src/apis/SpaceSearchAllUserApi.ts

@@ -0,0 +1,28 @@
+import { createRequestOptionsJSON_AUTH, fetchApi } from "@/apis/_createRequestOptions";
+
+// 인터페이스 정의
+export interface UserInfoInSpace {
+  userId: number;
+  userName: string;
+  profileImgUrl: string | null;
+  userAuth: "manager" | "normal";
+}
+
+interface SpaceSearchAllUserApiResponseType {
+  code: number;
+  status: number;
+  message: string;
+  result: {
+    userInfoInSpaceList: UserInfoInSpace[];
+  };
+}
+
+// API 함수 정의
+export const spaceSearchAllUserApi = async (spaceId: number) => {
+  const requestOptions = createRequestOptionsJSON_AUTH("GET");
+
+  if (!requestOptions) return null;
+
+  const url = `${import.meta.env.VITE_API_BACK_URL}/space/${spaceId}/all-member`;
+  return await fetchApi<SpaceSearchAllUserApiResponseType>(url, requestOptions);
+};

src/apis/_createRequestOptions.ts

@@ -1,5 +1,5 @@
 export interface RequestOptions {
-  method: "GET" | "POST" | "PATCH";
+  method: "GET" | "POST" | "PATCH" | "PUT" | "DELETE";
   body?: BodyInit;
   headers?: HeadersInit;
   redirect?: RequestRedirect;
@@ -30,6 +30,24 @@ export const createRequestOptionsJSON = (
 //   },
 // });
 
+export const createRequestOptionsFORM_AUTH = (
+  method: RequestOptions["method"],
+  body?: FormData,
+) => {
+  const token = localStorage.getItem("Authorization");
+
+  return token
+    ? ({
+        method: method,
+        body: body,
+        redirect: "follow",
+        headers: {
+          Authorization: token,
+        },
+      } as RequestOptions)
+    : null;
+};
+
 export const createRequestOptionsJSON_AUTH = (
   method: RequestOptions["method"],
   body?: RequestOptions["body"],
@@ -48,3 +66,24 @@ export const createRequestOptionsJSON_AUTH = (
       }
     : null;
 };
+
+/** Generic fetch API
+ *
+ */
+export const fetchApi = async <T>(url: string, options: RequestOptions): Promise<T> => {
+  const response: T = await fetch(url, options)
+    .then((res) => {
+      // 401 Unauthorized 시 재로그인 요청
+      if (res.status === 401) {
+        alert("로그인이 필요합니다.");
+      }
+
+      return res.json();
+    })
+    .catch((err) => {
+      console.error("[fetch error]", err);
+      throw err;
+    });
+
+  return response;
+};

src/apis/index.ts

@@ -1 +1,4 @@
 export * from "@/apis/LoginApi";
+export * from "@/apis/ChatroomSearchAllApi";
+export * from "@/apis/ChatroomCreateApi";
+export * from "@/apis/SpaceCreateApi";