Merge pull request #331 from depromeet/feat/330/muti-emo

회고 추천 이모지 추가

src/assets/svgs/template/list/index.ts

@@ -1 +1,10 @@
 export { default as ic_info } from "../../template/list/ic_info.svg?react";
+export { default as ic_emotion_share } from "../../template/list/ic_emotion_share.svg?react";
+export { default as ic_indi_share } from "../../template/list/ic_indi_share.svg?react";
+export { default as ic_team_share } from "../../template/list/ic_team_share.svg?react";
+export { default as ic_communication } from "../../template/list/ic_communication.svg?react";
+export { default as ic_improve_problem } from "../../template/list/ic_improve_problem.svg?react";
+export { default as ic_share_history } from "../../template/list/ic_share_history.svg?react";
+export { default as ic_pin } from "../../template/list/ic_pin.svg?react";
+
+export { default as ic_time_check } from "../../template/list/ic_time_check.svg?react";

src/component/common/button/FieldButton.tsx

@@ -11,9 +11,10 @@ type FieldButtonProps = {
   };
   isChecked?: boolean;
   onClick: () => void;
+  size?: number;
 };
 
-export function FieldButton({ field, onClick, isChecked = false }: FieldButtonProps) {
+export function FieldButton({ field, onClick, size, isChecked = false }: FieldButtonProps) {
   return (
     <div
       onClick={onClick}
@@ -34,7 +35,7 @@ export function FieldButton({ field, onClick, isChecked = false }: FieldButtonPr
       {field.icon_color && field.icon_white && (
         <Icon
           icon={isChecked ? field.icon_white : field.icon_color}
-          size={2.8}
+          size={size || 2.8}
           css={css`
             cursor: pointer;
             margin-right: 0.8rem;

src/component/retrospect/template/recommend/Purpose.tsx

@@ -39,7 +39,13 @@ export function Purpose({ onNext }: { onNext: (periodicValue: Pick<RecommendTemp
         `}
       >
         {purposeArr.map((item) => (
-          <FieldButton key={item} field={purposeMap[item]} onClick={() => handleButtonClick(item)} isChecked={selectedPurpose.includes(item)} />
+          <FieldButton
+            key={item}
+            field={purposeMap[item]}
+            onClick={() => handleButtonClick(item)}
+            isChecked={selectedPurpose.includes(item)}
+            size={1.8}
+          />
         ))}
       </div>
       <ButtonProvider>

src/component/retrospect/template/recommend/recommend.const.ts

@@ -1,3 +1,4 @@
+import { IconType } from "@/component/common/Icon/Icon";
 import { PeriodType, PurposeType } from "@/types/retrospectCreate/recommend";
 
 export const periodArr = ["WEEKLY", "MONTHLY", "QUARTERLY", "END_PROJECT"] as const;
@@ -23,14 +24,14 @@ export const purposeArr: PurposeType[] = [
 ] as const;
 
 export const purposeMap: {
-  [key in PurposeType]: { name: string };
+  [key in PurposeType]: { name: string; icon_white: IconType; icon_color: IconType };
 } = {
-  CHECK_PROGRESS: { name: "진행상황 점검" },
-  PERSONAL_GROWTH: { name: "개인의 성장" },
-  TEAM_GROWTH: { name: "팀의 성장" },
-  IMPROVE_COMMUNICATION: { name: "커뮤니케이션 개선" },
-  SHARE_EXPERIENCE: { name: "팀원간의 경험 공유" },
-  IMPROVE_PROBLEM: { name: "문제점 개선" },
-  SHARE_EMOTION: { name: "감정 공유" },
-  STRATEGY_SETTING: { name: "프로젝트 전략 설정" },
+  CHECK_PROGRESS: { name: "진행상황 점검", icon_white: "ic_time_check", icon_color: "ic_time_check" },
+  PERSONAL_GROWTH: { name: "개인의 성장", icon_white: "ic_indi_share", icon_color: "ic_indi_share" },
+  TEAM_GROWTH: { name: "팀의 성장", icon_white: "ic_team_share", icon_color: "ic_team_share" },
+  IMPROVE_COMMUNICATION: { name: "커뮤니케이션 개선", icon_white: "ic_communication", icon_color: "ic_communication" },
+  SHARE_EXPERIENCE: { name: "팀원간의 경험 공유", icon_white: "ic_share_history", icon_color: "ic_share_history" },
+  IMPROVE_PROBLEM: { name: "문제점 개선", icon_white: "ic_improve_problem", icon_color: "ic_improve_problem" },
+  SHARE_EMOTION: { name: "감정 공유", icon_white: "ic_emotion_share", icon_color: "ic_emotion_share" },
+  STRATEGY_SETTING: { name: "프로젝트 전략 설정", icon_white: "ic_pin", icon_color: "ic_pin" },
 };