feat: 기록 생성 시, 수영장 정보를 쿠키에 저장하는 로직 구현

app/record/page.tsx

@@ -1,13 +1,28 @@
 import { cookies } from 'next/headers';
 import { Suspense } from 'react';
 
-import { Form, RecordHeaderBar, RecordWarning } from '@/features/record';
+import {
+  Form,
+  PoolInfoDataProps,
+  RecordHeaderBar,
+  RecordWarning,
+  SwimTimeDataProps,
+} from '@/features/record';
 import { css } from '@/styled-system/css';
 import { flex } from '@/styled-system/patterns';
 
 export default function RecordPage() {
-  const prevSwimStartTime = cookies().get('swimStartTime')?.value;
-  const prevSwimEndTime = cookies().get('swimEndTime')?.value;
+  const savedSwimTimeData = cookies().get('swimTime')
+    ? (JSON.parse(
+        cookies().get('swimTime')?.value as string,
+      ) as SwimTimeDataProps)
+    : undefined;
+  const savedPoolInfoData = cookies().get('poolInfo')
+    ? (JSON.parse(
+        cookies().get('poolInfo')?.value as string,
+      ) as PoolInfoDataProps)
+    : undefined;
+
   return (
     <div>
       <RecordHeaderBar title="수영 기록하기" />
@@ -19,8 +34,8 @@ export default function RecordPage() {
       <h1 className={titleStyles.form}>기본정보</h1>
       <Suspense>
         <Form
-          prevSwimStartTime={prevSwimStartTime}
-          prevSwimEndTime={prevSwimEndTime}
+          savedSwimTimeData={savedSwimTimeData}
+          savedPoolInfoData={savedPoolInfoData}
         />
       </Suspense>
     </div>

features/record/components/organisms/form.tsx

@@ -32,9 +32,10 @@ import {
   usePullEditMemory,
 } from '../../apis';
 import { useRecordForm } from '../../hooks';
-import { saveSwimTime } from '../../server-actions';
+import { saveSwimData } from '../../server-actions';
 import { formSubInfoState } from '../../store/form-sub-info';
 import { formSectionStyles } from '../../styles/form-section';
+import { PoolInfoDataProps, SwimTimeDataProps } from '../../types';
 import { isFuture } from '../../utils';
 import { DiarySection } from './diary-section';
 import { DistancePageModal } from './distance-page-modal';
@@ -46,13 +47,13 @@ import { SubInfoSection } from './sub-info-section';
 import { TimeBottomSheet } from './time-bottom-sheet';
 
 interface FormProps {
-  prevSwimStartTime?: string;
-  prevSwimEndTime?: string;
+  savedSwimTimeData?: SwimTimeDataProps;
+  savedPoolInfoData?: PoolInfoDataProps;
 }
 
 //Todo: 코드 개선
 //Todo: 수정모드일 시, 불러온 기록 데이터에서 차이가 없을 때는 버튼 disabled
-export function Form({ prevSwimStartTime, prevSwimEndTime }: FormProps) {
+export function Form({ savedSwimTimeData, savedPoolInfoData }: FormProps) {
   const searchParams = useSearchParams();
   const date = searchParams.get('date');
   const memoryId = searchParams.get('memoryId');
@@ -68,9 +69,10 @@ export function Form({ prevSwimStartTime, prevSwimEndTime }: FormProps) {
   const methods = useForm<RecordRequestProps>({
     defaultValues: {
       recordAt: date ? formatDateToKorean(date) : getToday(),
-      startTime: prevSwimStartTime ? prevSwimStartTime : '',
-      endTime: prevSwimEndTime ? prevSwimEndTime : '',
-      poolName: '',
+      startTime: savedSwimTimeData ? savedSwimTimeData.start : '',
+      endTime: savedSwimTimeData ? savedSwimTimeData.end : '',
+      poolId: savedPoolInfoData ? savedPoolInfoData.id : undefined,
+      poolName: savedPoolInfoData ? savedPoolInfoData.name : '',
       laneMeter: '25m',
       lane: 25,
       totalDistance: '',
@@ -151,7 +153,7 @@ export function Form({ prevSwimStartTime, prevSwimEndTime }: FormProps) {
   });
 
   const { isLoading, modifySubmitData, modifyStrokesData, handlers } =
-    useRecordForm(lane, isEditMode, prevSwimStartTime);
+    useRecordForm(lane, isEditMode, savedSwimTimeData?.start);
 
   const handleRecordEditSuccess = () => {
     handlers.onChangeIsLoading(false);
@@ -236,7 +238,21 @@ export function Form({ prevSwimStartTime, prevSwimEndTime }: FormProps) {
     }
     //기록 생성 모드일 때
     else {
-      saveSwimTime(submitData.startTime, submitData.endTime);
+      saveSwimData({
+        swimTimeData: {
+          start: submitData.startTime,
+          end: submitData.endTime,
+        },
+        savedSwimTimeData,
+        poolInfoData:
+          submitData.poolId && data.poolName
+            ? {
+                id: submitData.poolId,
+                name: data.poolName,
+              }
+            : undefined,
+        savedPoolInfoData,
+      });
       //기록에서 이미지가 포함되었을 때
       if (formSubInfo.imageFiles.length > 0) {
         const getImagePresignedUrlRes = await getImagePresignedUrl([

features/record/server-actions/index.ts

@@ -1,2 +1,2 @@
 export * from './revalidate-record-detail';
-export * from './save-swim-time';
+export * from './save-swim-data';

features/record/server-actions/save-swim-data.ts

@@ -0,0 +1,58 @@
+'use server';
+
+import { cookies } from 'next/headers';
+
+import { PoolInfoDataProps, SwimTimeDataProps } from '../types';
+
+interface SaveSwimDataProps {
+  swimTimeData: SwimTimeDataProps;
+  savedSwimTimeData?: SwimTimeDataProps;
+  poolInfoData?: PoolInfoDataProps;
+  savedPoolInfoData?: PoolInfoDataProps;
+}
+
+//cookie에 가장 최근 수영 기록 정보를 저장하는 함수
+export const saveSwimData = ({
+  swimTimeData,
+  savedSwimTimeData,
+  poolInfoData,
+  savedPoolInfoData,
+}: SaveSwimDataProps) => {
+  if (
+    //저장된 수영 시간이 없거나
+    !savedSwimTimeData ||
+    //저장된 수영 시간이 있지만, 현재 생성한 기록의 수영 시간과 다르면
+    (savedSwimTimeData &&
+      (savedSwimTimeData.start !== swimTimeData.start ||
+        savedSwimTimeData.end !== swimTimeData.end))
+  )
+    cookies().set(
+      'swimTime',
+      JSON.stringify({ start: swimTimeData.start, end: swimTimeData.end }),
+      {
+        maxAge: Infinity,
+        httpOnly: true,
+        secure: true,
+      },
+    );
+
+  //현재 생성한 기록에 수영장 정보가 포함되어 있을 때
+  if (poolInfoData) {
+    //저장된 수영장 정보가 없거나
+    if (
+      !savedPoolInfoData ||
+      //저장된 수영장 정보가 있지만, 현재 생성한 기록의 수영장 정보와 다르다면
+      (savedPoolInfoData && savedPoolInfoData.id !== poolInfoData.id)
+    ) {
+      cookies().set(
+        'poolInfo',
+        JSON.stringify({ name: poolInfoData.name, id: poolInfoData.id }),
+        {
+          maxAge: Infinity,
+          httpOnly: true,
+          secure: true,
+        },
+      );
+    }
+  }
+};

features/record/types/index.ts

@@ -1,3 +1,4 @@
 export * from './form-section';
+export * from './saved-swim-data';
 export * from './stroke';
 export * from './time';

features/record/types/saved-swim-data.ts

@@ -0,0 +1,10 @@
+//cookie에 저장될 수 있는 수영 기록 정보 types
+export interface SwimTimeDataProps {
+  start: string;
+  end: string;
+}
+
+export interface PoolInfoDataProps {
+  name: string;
+  id: number;
+}