feat: ai 인삿말 홈 달력 헤더에 적용

app/api/greeting/route.ts

@@ -0,0 +1,13 @@
+import { NextResponse } from 'next/server';
+
+import { Response } from '@/apis';
+import { fetchData } from '@/apis/fetch-data';
+
+export async function GET() {
+  const data = await fetchData<Response<{ message: string }>>(
+    '/greeting',
+    'GET',
+  );
+
+  return NextResponse.json(data);
+}

features/main/components/calendar/organisms/user-calendar-profile.tsx

@@ -1,11 +1,8 @@
 'use client';
 
-import { useAtomValue } from 'jotai';
-
 import { Image } from '@/components/atoms';
-import { useCurrentMemberInfo } from '@/hooks';
+import { useCurrentMemberInfo, useGreetingText } from '@/hooks';
 import SwimieCharacterImage from '@/public/images/swimie-character.png';
-import { calendarSwimCountAtom } from '@/store';
 import { css, cx } from '@/styled-system/css';
 import { flex } from '@/styled-system/patterns';
 
@@ -14,8 +11,7 @@ import { Calendar } from '../molecules';
 
 export const UserCalendarProfile = () => {
   const { data, isLoading } = useCurrentMemberInfo();
-  const totalSwimCount = useAtomValue(calendarSwimCountAtom);
-  const isEmptyCount = totalSwimCount === 0;
+  const { data: greetingTextData } = useGreetingText();
 
   return (
     <>
@@ -33,9 +29,7 @@ export const UserCalendarProfile = () => {
           <div className={userInfoStyles}>
             <p className={nicknameStyles}>{data?.data.nickname}님,</p>
             <p className={descriptionStyles}>
-              {isEmptyCount
-                ? '이번달 수영 기록을 해볼까요?'
-                : `이번달 수영을 ${totalSwimCount}번 다녀왔어요!`}
+              {greetingTextData?.data.message}
             </p>
           </div>
         </div>

hooks/apis/index.ts

@@ -3,3 +3,4 @@ export * from './use-cheer-eligibility';
 export * from './use-current-member-info';
 export * from './use-follow-mutate';
 export * from './use-following-state';
+export * from './use-greeting-text';

hooks/apis/use-greeting-text.ts

@@ -0,0 +1,21 @@
+import { useQuery } from '@tanstack/react-query';
+
+import { Response } from '@/apis';
+
+export const getGreetingText = async () => {
+  const res = await fetch(`/api/greeting`, {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+  });
+
+  return res.json();
+};
+
+export const useGreetingText = () => {
+  return useQuery<Response<{ message: string }>>({
+    queryKey: ['greetingText'],
+    queryFn: () => getGreetingText(),
+  });
+};