Feat : 리스트 생성 페이지 구현 및 API 연결 (#16)

* Feat: 리스트생성 다음 버튼 활성화 기능

* Feat: 템플릿으로 리스트 바로 생성 기능

* Feat: 리스트 생성 API 연결

* Feat: 리스트 생성 구현 및 컴포넌트 분리

* Feat: 이미지 요청, 리스트생성 요청 데이터  분리

* HOTFIX: CI test 빌드에러 해결 - 파일명 대소문자 다름 이슈

* Refactor: 서영님 리뷰 반영 - error rules 상 수화 및 css 파일 디테일 수정

.env

@@ -0,0 +1 @@
+NEXT_PUBLIC_BASE_URL = "https://dev.api.listywave.com"

src/app/[userNickname]/collabolist/page.tsx

@@ -5,7 +5,7 @@
  - [ ] 반응형 UI 구현
  */
 
-import '@/styles/globalStyles.css';
+import '@/styles/GlobalStyles.css';
 
 import { USER_DATA_ME } from '../mockData/user'; // 삭제 예정
 

src/app/[userNickname]/mylist/page.tsx

@@ -5,7 +5,7 @@
  - [ ] 반응형 UI 구현
  */
 
-import '@/styles/globalStyles.css';
+import '@/styles/GlobalStyles.css';
 
 import { USER_DATA_ME } from '../mockData/user'; // 삭제 예정
 

src/app/_api/category/getCategories.ts

@@ -1,8 +1,8 @@
 import axiosInstance from '@/lib/axios/axiosInstance';
-import { CategoriesType } from '@/lib/types/categoriesType';
+import { CategoryType } from '@/lib/types/categoriesType';
 
 export const getCategories = async () => {
-  const response = await axiosInstance.get<CategoriesType>('/categories');
+  const response = await axiosInstance.get<CategoryType[]>('/categories');
 
   return response.data;
 };

src/app/_api/list/createList.ts

@@ -1 +1,8 @@
-// 리스트 생성 api
+import axiosInstance from '@/lib/axios/axiosInstance';
+import { ListCreateType } from '@/lib/types/listType';
+
+export const createList = async (data: ListCreateType) => {
+  const response = await axiosInstance.post<ListCreateType>('/lists', data);
+
+  return response.data;
+};

src/app/_api/user/getUsers.ts

@@ -0,0 +1,8 @@
+import axiosInstance from '@/lib/axios/axiosInstance';
+import { UserProfilesType } from '@/lib/types/userProfileType';
+
+export const getUsers = async () => {
+  const response = await axiosInstance.get<UserProfilesType>('/users');
+
+  return response.data;
+};

src/app/create/_components/CreateItem.tsx

@@ -1,14 +1,15 @@
 import { useFormContext } from 'react-hook-form';
 
 import BackIcon from '/public/icons/back.svg';
-import Items from './Items';
+import Items from './item/Items';
 import * as styles from './CreateItem.css';
 
 interface CreateItemProps {
   onBackClick: () => void;
+  onSubmit: () => void;
 }
 
-export default function CreateItem({ onBackClick }: CreateItemProps) {
+export default function CreateItem({ onBackClick, onSubmit }: CreateItemProps) {
   const {
     formState: { isValid },
   } = useFormContext();
@@ -21,9 +22,7 @@ export default function CreateItem({ onBackClick }: CreateItemProps) {
         </button>
         <h1 className={styles.headerTitle}>리스트 생성</h1>
         <button
-          onClick={() => {
-            console.log('제출');
-          }}
+          onClick={onSubmit}
           className={isValid ? styles.headerNextButton : styles.headerNextButtonDisabled}
           disabled={!isValid ? true : false}
         >