Refactor/component

sentry.client.config.ts

@@ -1,28 +1,15 @@
-// This file configures the initialization of Sentry on the client.
-// The config you add here will be used whenever a users loads a page in their browser.
-// https://docs.sentry.io/platforms/javascript/guides/nextjs/
 import * as Sentry from "@sentry/nextjs";
 
 Sentry.init({
   dsn: process.env.SENTRY_DSN || "",
   environment: process.env.SENTRY_ENVIRONMENT || "development",
+  tracesSampleRate: 1.0,
 
-  // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
-
-  // Setting this option to true will print useful information to the console while you're setting up Sentry.
-  debug: false,
-
-  replaysOnErrorSampleRate: 1.0,
-
-  // This sets the sample rate to be 10%. You may want this to be 100% while
-  // in development and sample at a lower rate in production
-  replaysSessionSampleRate: 0.1,
-
-  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
   integrations: [
+    Sentry.browserTracingIntegration({
+      tracePropagationTargets: ["localhost", /^https:\/\/(www\.)?solid\-connection\.com/],
+    }),
     Sentry.replayIntegration({
-      // Additional Replay configuration goes in here, for example:
       maskAllText: true,
       blockAllMedia: true,
     }),

src/api/article/client/useGetArticleList.ts

@@ -0,0 +1,40 @@
+import { useEffect, useState } from "react";
+
+import useFetch from "@/utils/apiUtils";
+
+import { ArticleResponse } from "../type/response";
+
+/* ---------- 타입 ---------- */
+
+interface ArticleListResponse {
+  news: ArticleResponse[]; // 최대 5개
+}
+
+const useGetArticleList = (userId: number | null) => {
+  const { result, loading, error, fetchData } = useFetch<ArticleListResponse>();
+
+  const [articleList, setArticleList] = useState<ArticleResponse[]>([]);
+
+  /* 페이지 변경 시 데이터 요청 */
+  useEffect(() => {
+    if (userId === null) return;
+
+    fetchData({
+      method: "get",
+      url: `/news?site-user-id=${userId}`,
+      body: undefined,
+      isToken: true,
+    });
+  }, [userId, fetchData]);
+
+  /* 응답 처리 */
+  useEffect(() => {
+    if (result) {
+      setArticleList(result.data.news);
+    }
+  }, [result]);
+
+  return { articleList, loading, error };
+};
+
+export default useGetArticleList;

src/api/mentor/client/useGetMyMentorProfile.ts

@@ -12,7 +12,11 @@ interface UseGetMyMentorDataReturn {
 
 const useGetMyMentorProfile = (): UseGetMyMentorDataReturn => {
   const { result, loading, error, fetchData } = useFetch<MentorCardPreview>();
+<<<<<<< HEAD
+  const [myMentorProfile, setMyMentorProfile] = useState<MentorCardPreview>(null);
+=======
   const [myMentorProfile, setMyMentorProfile] = useState<MentorCardPreview>({} as MentorCardPreview);
+>>>>>>> main
 
   useEffect(() => {
     fetchData({

src/api/mentor/type/response.ts

@@ -30,7 +30,7 @@ export interface MentorCardBase {
 }
 
 /** 리스트(미리보기) 용 – passTip / isApplied 없이 사용 */
-export type MentorCardPreview = MentorCardBase & { studyStatus: "24-1" | "24-2" }; // 학업 상태 (예: "24-1")
+export type MentorCardPreview = (MentorCardBase & { studyStatus: "24-1" | "24-2" }) | null; // 학업 상태 (예: "24-1")
 
 /** 상세 뷰 용 – 추가 정보 포함 */
 export interface MentorCardDetail extends MentorCardBase {

src/app/application/ScorePageContent.tsx

@@ -3,9 +3,9 @@
 import { useRouter } from "next/navigation";
 import { useEffect, useRef, useState } from "react";
 
-import CloudSpinnerPage from "@/components/loading/CloudSpinnerPage";
 import ConfirmCancelModal from "@/components/modal/ConfirmCancelModal";
 import ButtonTab from "@/components/ui/ButtonTab";
+import CloudSpinnerPage from "@/components/ui/CloudSpinnerPage";
 import Tab from "@/components/ui/Tab";
 
 import ScoreSearchBar from "./ScoreSearchBar";

src/app/community/[boardCode]/CommunityPageContent.tsx

@@ -3,8 +3,8 @@
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 
-import CloudSpinnerPage from "@/components/loading/CloudSpinnerPage";
 import ButtonTab from "@/components/ui/ButtonTab";
+import CloudSpinnerPage from "@/components/ui/CloudSpinnerPage";
 
 import CommunityRegionSelector from "./CommunityRegionSelector";
 import PostCards from "./PostCards";

src/app/community/[boardCode]/[postId]/PostPageContent.tsx

@@ -4,7 +4,7 @@ import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 
 import TopDetailNavigation from "@/components/layout/TopDetailNavigation";
-import CloudSpinnerPage from "@/components/loading/CloudSpinnerPage";
+import CloudSpinnerPage from "@/components/ui/CloudSpinnerPage";
 
 import CommentSection from "./CommentSection";
 import Content from "./Content";

src/app/community/[boardCode]/[postId]/modify/PostModifyContent.tsx

@@ -3,7 +3,7 @@
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 
-import CloudSpinnerPage from "@/components/loading/CloudSpinnerPage";
+import CloudSpinnerPage from "@/components/ui/CloudSpinnerPage";
 
 import PostModifyForm from "./PostModifyForm";
 

src/app/layout.tsx

@@ -2,15 +2,13 @@ import type { Metadata, Viewport } from "next";
 import { Inter } from "next/font/google";
 import localFont from "next/font/local";
 
-import AppleScriptLoader from "@/components/layout/AppleScriptLoader";
-import KakaoScriptLoader from "@/components/layout/KakaoScriptLoader";
-import Layout from "@/components/layout/Layout";
-import RootModal from "@/components/layout/RootModal";
+import GlobalLayout from "@/components/layout/GlobalLayout";
 
 import "../styles/globals.css";
 
 import { AlertProvider } from "@/context/AlertContext";
-import { LayoutProvider } from "@/context/LayoutContext";
+import AppleScriptLoader from "@/lib/ScriptLoader/AppleScriptLoader";
+import KakaoScriptLoader from "@/lib/ScriptLoader/KakaoScriptLoader";
 import { GoogleAnalytics } from "@next/third-parties/google";
 
 export const metadata: Metadata = {
@@ -46,17 +44,14 @@ export const viewport: Viewport = {
 
 const RootLayout = ({ children }: { children: React.ReactNode }) => (
   <AlertProvider>
-    <LayoutProvider>
-      <html lang="ko" className="font-serif">
-        <KakaoScriptLoader />
-        <AppleScriptLoader />
-        <GoogleAnalytics gaId="G-V1KLYZC1DS" />
-        <body className={`${pretendard.className} ${inter.className}`}>
-          <Layout>{children}</Layout>
-          <RootModal />
-        </body>
-      </html>
-    </LayoutProvider>
+    <html lang="ko" className="font-serif">
+      <KakaoScriptLoader />
+      <AppleScriptLoader />
+      <GoogleAnalytics gaId="G-V1KLYZC1DS" />
+      <body className={`${pretendard.className} ${inter.className}`}>
+        <GlobalLayout>{children}</GlobalLayout>
+      </body>
+    </html>
   </AlertProvider>
 );
 

src/app/login/LoginContent.tsx

@@ -15,21 +15,14 @@ import KakaoLoginButton from "./KakaoLoginButton";
 import { appleOAuth2CodeResponse } from "@/types/auth";
 
 import { emailAuthApi } from "@/api/auth";
-import { useLayout } from "@/context/LayoutContext";
 import { IconSolidConnectionFullBlackLogo } from "@/public/svgs";
 
 const LoginContent = () => {
   const router = useRouter();
-  const { setHideBottomNavigation } = useLayout();
 
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
 
-  useEffect(() => {
-    setHideBottomNavigation(true);
-    return () => setHideBottomNavigation(false);
-  }, [setHideBottomNavigation]);
-
   const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
     if (e.key === "Enter") {
       handleEmailLogin();

src/app/login/apple/callback/AppleLoginCallbackPage.tsx

@@ -7,11 +7,10 @@ import axios from "axios";
 
 import { saveAccessToken, saveRefreshToken } from "@/utils/localStorage";
 
-import CloudSpinnerPage from "@/components/loading/CloudSpinnerPage";
 import SignupSurvey from "@/components/login/signup/SignupSurvey";
+import CloudSpinnerPage from "@/components/ui/CloudSpinnerPage";
 
 import { appleAuthApi } from "@/api/auth";
-import { useLayout } from "@/context/LayoutContext";
 
 const AppleLoginCallbackPage = () => {
   const router = useRouter();
@@ -20,13 +19,6 @@ const AppleLoginCallbackPage = () => {
   // const [signUpToken, setSignUpToken] = useState<string>("");
   // const [email, setEmail] = useState<string>("");
 
-  const { setHideBottomNavigation } = useLayout();
-
-  useEffect(() => {
-    setHideBottomNavigation(true);
-    return () => setHideBottomNavigation(false); // 컴포넌트 언마운트 시 다시 보이게 설정
-  }, [setHideBottomNavigation]);
-
   useEffect(() => {
     const code = searchParams?.get("code");
     if (code) {

src/app/login/kakao/callback/KakaoLoginCallbackPage.tsx

@@ -7,11 +7,10 @@ import axios from "axios";
 
 import { saveAccessToken, saveRefreshToken } from "@/utils/localStorage";
 
-import CloudSpinnerPage from "@/components/loading/CloudSpinnerPage";
 import SignupSurvey from "@/components/login/signup/SignupSurvey";
+import CloudSpinnerPage from "@/components/ui/CloudSpinnerPage";
 
 import { kakaoAuthApi } from "@/api/auth";
-import { useLayout } from "@/context/LayoutContext";
 
 const KakaoLoginCallbackPage = () => {
   const router = useRouter();
@@ -22,13 +21,6 @@ const KakaoLoginCallbackPage = () => {
   // const [kakaoEmail, setKakaoEmail] = useState<string>("");
   // const [kakaoProfileImageUrl, setKakaoProfileImageUrl] = useState<string>("");
 
-  const { setHideBottomNavigation } = useLayout();
-
-  useEffect(() => {
-    setHideBottomNavigation(true);
-    return () => setHideBottomNavigation(false); // 컴포넌트 언마운트 시 다시 보이게 설정
-  }, [setHideBottomNavigation]);
-
   useEffect(() => {
     const code = searchParams?.get("code");
     if (code) {

src/app/mentor/[id]/_ui/MentorDetialContent/_ui/MentorArticle/index.tsx

@@ -5,9 +5,22 @@ import { useState } from "react";
 
 import { ArticleResponse } from "@/api/article/type/response";
 import { IconLikeFill, IconLikeNotFill } from "@/public/svgs/mentor";
+<<<<<<< HEAD
 
+<<<<<<< HEAD
 interface MentorArticleProps {
   article: ArticleResponse;
+=======
+import { IconLikeFill, IconLkieNotFill } from "@/public/svgs/mentor";
+
+interface MentorArticleProps {
+  article: Article;
+>>>>>>> upstream/main
+=======
+
+interface MentorArticleProps {
+  article: ArticleResponse;
+>>>>>>> main
 }
 
 const MentorArticle = ({ article }: MentorArticleProps) => {

src/app/mentor/[id]/_ui/MentorDetialContent/index.tsx

@@ -7,7 +7,7 @@ import ProfileWithBadge from "@/components/ui/ProfileWithBadge";
 
 import MentorArticle from "./_ui/MentorArticle";
 
-import useGetArticleList from "@/api/article/client/useGetAriticleList";
+import useGetArticleList from "@/api/article/client/useGetArticleList";
 import useGetMentorDetailPage from "@/api/mentor/client/useGetMentorDetailPage";
 import { ChannelType } from "@/api/mentor/type/response";
 import { customConfirm } from "@/lib/zustand/useConfirmModalStore";

src/app/mentor/_ui/MentorClient/_ui/MentorFindSection/index.tsx

@@ -13,11 +13,31 @@ import useGetMentorList from "@/api/mentor/client/useGetMentorList";
 
 const MentorFindSection = () => {
   const [selectedFilter, setSelectedFilter] = useState<FilterTab>(FilterTab.ALL);
+<<<<<<< HEAD
+<<<<<<< HEAD
+=======
+>>>>>>> main
   const { page, lastElementRef } = useInfinityScroll();
   const { mentorList } = useGetMentorList({
     page,
     region: selectedFilter !== FilterTab.ALL ? selectedFilter : undefined,
   });
+<<<<<<< HEAD
+=======
+  const mentorListData = getMentorListData();
+
+  const filteredMentors = useMemo(() => {
+    return mentorListData.filter((mentor) => {
+      if (selectedFilter === FilterTab.ALL) return true;
+      if (selectedFilter === FilterTab.EUROPE) return mentor.country === FilterTab.EUROPE;
+      if (selectedFilter === FilterTab.AMERICAS) return mentor.country === FilterTab.AMERICAS;
+      if (selectedFilter === FilterTab.ASIA) return mentor.country === FilterTab.ASIA;
+      return false;
+    });
+  }, [mentorListData, selectedFilter]);
+>>>>>>> upstream/main
+=======
+>>>>>>> main
 
   return (
     <div className="px-4">

src/app/mentor/_ui/MentorClient/_ui/MyMentorSection/index.tsx

@@ -11,7 +11,7 @@ const MyMentorSection = () => {
     <>
       <h2 className="text-lg font-bold text-gray-900">나의 멘토 페이지</h2>
       <div className="mt-[14px]">
-        <MentorCard key={myMentorProfile.id} isMine mentor={myMentorProfile} />
+        <MentorCard key={myMentorProfile?.id} isMine mentor={myMentorProfile} />
       </div>
     </>
   );

src/app/mentor/_ui/MentorClient/index.tsx

@@ -7,7 +7,15 @@ const MentorClient = () => {
   const isMentor = false;
   return (
     <>
+<<<<<<< HEAD
+<<<<<<< HEAD
       {isMentor ? (
+=======
+      {!isMentor ? (
+>>>>>>> upstream/main
+=======
+      {isMentor ? (
+>>>>>>> main
         // 멘토페이지
         <>
           {/* 나의 멘토 - 멘티 탭 및 채팅카드 */}

src/app/mentor/chat/[chatId]/_ui/ChatContent/index.tsx

@@ -5,7 +5,7 @@ import { useForm } from "react-hook-form";
 
 import ProfileWithBadge from "@/components/ui/ProfileWithBadge";
 
-import ChatMessageBox from "./_components/ChatMessageBox";
+import ChatMessageBox from "./_ui/ChatMessageBox";
 
 import { ChatMessage } from "@/types/mentor";
 
@@ -131,7 +131,7 @@ const ChatContent = () => {
       </div>
 
       {/* 메시지 입력 영역 - 하단 고정 */}
-      <div className="shadow-top w-full border-b border-t border-k-50 bg-k-0">
+      <div className="w-full border-b border-t border-k-50 bg-k-0 shadow-top">
         <form onSubmit={handleSubmit(onSubmit)} className="flex items-center gap-2 p-4">
           <button className="h-[18px] w-5">
             <IconCamera />

src/app/mentor/chat/[chatId]/page.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
-import ChatContent from "./_components/ChatContent";
-import ChatNavBar from "./_components/ChatNavBar";
+import ChatContent from "./_ui/ChatContent";
+import ChatNavBar from "./_ui/ChatNavBar";
 
 export const metadata: Metadata = {
   title: "멘토와 채팅 | Solid Connect",