Merge pull request #109 from TripInfoWeb/dev_informations

코드 정리 및 오류 수정
TripInfoWeb · Jul 9, 2024 · 5884b90 · 5884b90
2 parents 443b370 + b5efade
commit 5884b90
Show file tree

Hide file tree

Showing 76 changed files with 668 additions and 1,391 deletions.
diff --git a/src/app/api/informations/route.ts b/src/app/api/informations/route.ts
@@ -1,41 +1,39 @@
-import { InformationRequestDto } from "@/types/InformationDto";
 import { revalidateTag } from "next/cache";
-import { redirect } from "next/navigation";
 import { NextRequest } from "next/server";
 
 // 정보 글 작성
-// TODO: 수정 필요, multipart 방식
 export async function POST(request: NextRequest) {
   try {
-    //const data = (await request.json()) as InformationRequestDto;
+    const formData = await request.formData();
 
-    try {
-    } catch (e) {}
+    // TODO: 삭제 필요
+    console.log("TEST 정보 글 작성");
+    console.log(formData);
 
-    // 외부 API 호출
     /*
+    // Back-end API 호출
     const response = await fetch(
-      `${process.env.API_BASE_URL}/api/information/write`,
+      `${process.env.BACKEND_URL}/api/informations`,
       {
         method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify({}),
+        body: formData,
         cache: "no-store",
       },
     );
-  
-    // 외부 API의 응답을 JSON 형식으로 변환
-    const data = await response.json();
-    */
+
+    if (!response.ok) {
+      throw new Error("Internal Server Error");
+    }
 
     // Revalidate the cache for the list page and redirect the user.
     // TODO: 수정 필요
     revalidateTag("getInformationList");
-    redirect("/");
 
-    /*
+    // 외부 API의 응답을 JSON 형식으로 변환
+    return response;
+    */
+
+    // TODO: 삭제 필요
     return new Response(
       JSON.stringify({ title: "1", content: "2", tips: ["3", "4"] }),
       {
@@ -45,7 +43,6 @@ export async function POST(request: NextRequest) {
         },
       },
     );
-    */
   } catch (e) {
     return new Response(JSON.stringify({ error: "Failed to write data." }), {
       status: 500, // Internal Server Error

diff --git a/src/components/auth/AuthLoading.tsx b/src/components/auth/AuthLoading.tsx
@@ -5,7 +5,7 @@ const AuthLoading = () => {
   return (
     <div
       className={
-        "fixed left-0 top-0 z-50 flex flex-col h-[100vh] w-[100vw] items-center justify-center bg-white"
+        "fixed left-0 top-0 z-50 flex h-[100vh] w-[100vw] flex-col items-center justify-center bg-white"
       }
     >
       <div className={"relative h-[245px] w-[275px]"}>

diff --git a/src/components/auth/SignUp.tsx b/src/components/auth/SignUp.tsx
@@ -52,7 +52,9 @@ const SignUp = () => {
             fill={true}
           />
         </div>
-        <span className="text-sm font-semibold text-black">구글로 1초만에 시작하기</span>
+        <span className="text-sm font-semibold text-black">
+          구글로 1초만에 시작하기
+        </span>
       </Link>
       <div className={"relative flex w-full justify-center"}>
         <p

diff --git a/src/components/common/BackButton.tsx b/src/components/common/BackButton.tsx
@@ -1,10 +1,10 @@
 import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
 
-type MyProps = {
+interface Props {
   router: AppRouterInstance;
-};
+}
 
-const BackButton = ({ router }: MyProps) => {
+const BackButton = ({ router }: Props) => {
   return (
     <button
       className="h-[2.625rem] w-[9.4375rem] rounded-full bg-main text-white hover:scale-105"

diff --git a/src/components/common/Banner.tsx b/src/components/common/Banner.tsx
@@ -3,11 +3,11 @@ import Image from "next/image";
 import Link from "next/link";
 import LottieComponent from "./lottie/LottieComponent";
 
-type MyProps = {
+interface Props {
   content: string[];
   buttonText: string;
   category: "정보" | "모임";
-};
+}
 
 const bannerImage = {
   정보: "/banner-image.png",
@@ -20,7 +20,7 @@ const buttonPath = {
 };
 
 // todo
-const Banner = ({ content, buttonText, category }: MyProps) => {
+const Banner = ({ content, buttonText, category }: Props) => {
   return (
     <div
       className={`-mt-20 flex h-[31.25rem] w-full flex-row items-center justify-center max-[744px]:h-[36rem] ${category == "모임" ? "bg-gradient-to-br from-[#E7FCE0] to-[#C3E9FF]" : "bg-gradient-to-br from-[#CBF6FF] to-[#EBE0FA]"} dark:opacity-65`}
@@ -50,7 +50,7 @@ const Banner = ({ content, buttonText, category }: MyProps) => {
             {category === "정보" && (
               <div className="flex h-[13.4375rem] w-[24.8125rem] flex-col max-[1024px]:h-[10.6875rem] max-[1024px]:w-[19.8125rem]">
                 <div className="flex justify-end pr-6">
-                  <div className="animate-bannerImage1 relative h-[5.8125rem] w-[11.75rem] max-[1024px]:h-[5.0625rem] max-[1024px]:w-[10.1875rem]">
+                  <div className="relative h-[5.8125rem] w-[11.75rem] animate-bannerImage1 max-[1024px]:h-[5.0625rem] max-[1024px]:w-[10.1875rem]">
                     <Image
                       src="/banner-image1.png"
                       alt="banner-image1"
@@ -61,7 +61,7 @@ const Banner = ({ content, buttonText, category }: MyProps) => {
                     />
                   </div>
                 </div>
-                <div className="animate-bannerImage2 relative z-10 -mt-[1.875rem] h-[5.75rem] w-[14.375rem] max-[1024px]:h-[4.5625rem] max-[1024px]:w-[11.5rem]">
+                <div className="relative z-10 -mt-[1.875rem] h-[5.75rem] w-[14.375rem] animate-bannerImage2 max-[1024px]:h-[4.5625rem] max-[1024px]:w-[11.5rem]">
                   <Image
                     src="/banner-image2.png"
                     alt="banner-image2"
@@ -72,7 +72,7 @@ const Banner = ({ content, buttonText, category }: MyProps) => {
                   />
                 </div>
                 <div className="-mt-8 flex justify-end">
-                  <div className="animate-bannerImage3 relative h-[5.8125rem] w-[14.75rem] max-[1024px]:h-[4.625rem] max-[1024px]:w-[11.75rem]">
+                  <div className="relative h-[5.8125rem] w-[14.75rem] animate-bannerImage3 max-[1024px]:h-[4.625rem] max-[1024px]:w-[11.75rem]">
                     <Image
                       src="/banner-image3.png"
                       alt="banner-image3"

diff --git a/src/components/common/FloatingButton.tsx b/src/components/common/FloatingButton.tsx
@@ -3,13 +3,13 @@ import Link from "next/link";
 import { IoIosArrowUp } from "react-icons/io";
 import { MdClose } from "react-icons/md";
 
-type MyProps = {
+interface Props {
   visible: boolean;
   onClick: () => void;
   onScrollToTop: () => void;
-};
+}
 
-const FloatingButton = ({ visible, onClick, onScrollToTop }: MyProps) => {
+const FloatingButton = ({ visible, onClick, onScrollToTop }: Props) => {
   return (
     <div className="fixed bottom-8 right-0 z-40 flex w-24 flex-col items-center gap-3">
       {visible && (

diff --git a/src/components/common/Header.tsx b/src/components/common/Header.tsx
@@ -3,15 +3,15 @@ import Link from "next/link";
 import { MdOutlineMenu } from "react-icons/md";
 import HeaderSidebar from "./HeaderSidebar";
 
-type MyProps = {
+interface Props {
   pathname: string;
   visible: boolean;
   transparent: boolean;
   onMenuClicked: () => void;
   onClose: () => void;
   logoutHandler: () => void;
   nickName?: string;
-};
+}
 
 const Header = ({
   pathname,
@@ -21,7 +21,7 @@ const Header = ({
   onClose,
   nickName,
   logoutHandler,
-}: MyProps) => {
+}: Props) => {
   return (
     <header className="flex w-full flex-row justify-center">
       {visible && <HeaderSidebar onClose={onClose} />}

diff --git a/src/components/common/HeaderSidebar.tsx b/src/components/common/HeaderSidebar.tsx
@@ -7,11 +7,11 @@ import { MdClose } from "react-icons/md";
 import { RiLoginBoxLine } from "react-icons/ri";
 import Image from "next/image";
 
-type MyProps = {
+interface Props {
   onClose: () => void;
-};
+}
 
-const HeaderSidebar = ({ onClose }: MyProps) => {
+const HeaderSidebar = ({ onClose }: Props) => {
   return (
     <aside className="fixed left-0 top-0 z-50 flex h-full w-[200%] animate-sidebarFadeIn">
       <div className="bg-black/25">

diff --git a/src/components/common/InformationItem.tsx b/src/components/common/InformationItem.tsx
@@ -5,15 +5,15 @@ import { CiBookmark } from "react-icons/ci";
 import { FaRegHeart } from "react-icons/fa";
 import { TiLocation } from "react-icons/ti";
 
-type MyProps = {
+interface Props {
   id: number;
   category: string;
   title: string;
   image: string;
-};
+}
 
 // todo
-const InformationItem = ({ id, category, title, image }: MyProps) => {
+const InformationItem = ({ id, category, title, image }: Props) => {
   let style = "";
   switch (category) {
     case "restaurant":

diff --git a/src/components/common/MeetingItem.tsx b/src/components/common/MeetingItem.tsx
@@ -6,7 +6,7 @@ import { FaRegHeart } from "react-icons/fa";
 import { IoBookmark } from "react-icons/io5";
 import { TiLocation } from "react-icons/ti";
 
-type MyProps = {
+interface Props {
   id: number;
   category: string;
   bookmark: boolean;
@@ -20,7 +20,7 @@ type MyProps = {
   qualification: string;
   likes: number;
   views: number;
-};
+}
 
 // todo
 const MeetingItem = ({
@@ -37,7 +37,7 @@ const MeetingItem = ({
   qualification,
   likes,
   views,
-}: MyProps) => {
+}: Props) => {
   let style = "";
   switch (category) {
     case "취향":
@@ -82,7 +82,7 @@ const MeetingItem = ({
         </p>
       </div>
       <div className="flex flex-col gap-5">
-        <div className="flex flex-col text-sm font-medium ">
+        <div className="flex flex-col text-sm font-medium">
           <div
             className={
               "grid w-full grid-cols-[15rem_auto] gap-y-[.5rem] max-[520px]:flex max-[520px]:flex-col"

diff --git a/src/components/common/TopList.tsx b/src/components/common/TopList.tsx
@@ -1,8 +1,8 @@
 import Link from "next/link";
 
-type MyProps = {
+interface Props {
   title: "여행" | "모임";
-};
+}
 
 const titleList: { [key: string]: string[] } = {
   여행: [
@@ -21,7 +21,7 @@ const titleList: { [key: string]: string[] } = {
   ],
 };
 
-const TopList = async ({ title }: MyProps) => {
+const TopList = async ({ title }: Props) => {
   await new Promise((resolve) => setTimeout(resolve, 1000));
 
   return (

diff --git a/src/components/examples/AuthForm.tsx b/src/components/examples/AuthForm.tsx
diff --git a/src/components/home/HomeCarousel.tsx b/src/components/home/HomeCarousel.tsx
@@ -1,13 +1,13 @@
 import Image from "next/image";
 import Link from "next/link";
 
-type MyProps = {
+interface Props {
   images: string[];
   currentIndex: number;
   onClick: (index: number) => void;
-};
+}
 
-const HomeCarousel = ({ images, currentIndex, onClick }: MyProps) => {
+const HomeCarousel = ({ images, currentIndex, onClick }: Props) => {
   return (
     <div className="relative -mt-20 flex h-[37.5rem] w-full items-center justify-center max-[1024px]:h-80 dark:opacity-65">
       <Image

diff --git a/src/components/home/NewMeetingList.tsx b/src/components/home/NewMeetingList.tsx
@@ -105,7 +105,7 @@ const NewMeetingList = async () => {
   ];
 
   return (
-    <div className="mt-6 flex w-fit flex-wrap items-center justify-center gap-4 p-1 max-[744px]:flex-row max-[744px]:flex-nowrap">
+    <div className="mt-6 flex w-fit flex-wrap items-center justify-center gap-4 p-[0.125rem] max-[744px]:flex-row max-[744px]:flex-nowrap">
       {data.map((post, index) => (
         <MeetingItem
           key={index}

diff --git a/src/components/informations/common/ItemTag.tsx b/src/components/informations/common/ItemTag.tsx
@@ -1,11 +1,11 @@
-type MyProps = {
+interface Props {
   tag: string;
   borderColor?: string;
   textColor?: string;
   cursorPointer?: boolean;
   hover?: string;
   onClick?: () => void;
-};
+}
 
 const ItemTag = ({
   tag,
@@ -14,7 +14,7 @@ const ItemTag = ({
   cursorPointer,
   hover,
   onClick,
-}: MyProps) => {
+}: Props) => {
   return (
     <div
       className={`rounded-full border-[0.0625rem] ${borderColor} ${cursorPointer ? "cursor-pointer" : ""} ${hover}`}