[FIX] 질문에 대한 도메인 용어를 question에서 content로 수정

frontend/.husky/pre-push

@@ -5,8 +5,23 @@
 # 현재 브랜치 이름 가져오기
 current_branch=$(git rev-parse --abbrev-ref HEAD)
 
+
+# 브랜치 패턴을 변수로 선언
+branch_patterns=("feat/" "hotfix/" "fix/" "refactor/" "test/")
+
+# 브랜치가 패턴에 맞는지 확인하는 함수
+matches_pattern() {
+  local branch=$1
+  for pattern in "${branch_patterns[@]}"; do
+    if [[ $branch == $pattern* ]]; then
+      return 0
+    fi
+  done
+  return 1
+}
+
 # feat/ 로 시작하는 브랜치인지 확인
-if [[ $current_branch == feat/* ]] || [[ $current_branch == hotfix/* ]]; then
+if matches_pattern "$current_branch"; then
     echo "Feature branch detected: $current_branch"
     echo "Starting rebase process..."
 
@@ -31,4 +46,4 @@ if [[ $current_branch == feat/* ]] || [[ $current_branch == hotfix/* ]]; then
 else
     echo "Not a feature branch. Proceeding with normal push."
     exit 0
-fi
+fi

frontend/.husky/prepare-commit-msg

@@ -21,7 +21,7 @@ fi
 # 이슈 번호가 이미 커밋 메시지에 있는지 확인
 if ! echo "$COMMIT_MSG" | grep -q "#$ISSUE_NUMBER"; then
   # 이슈 번호가 없으면 커밋 메시지 끝에 추가
-  echo -n "$COMMIT_MSG" > $COMMIT_MSG_FILE
-  echo " #$ISSUE_NUMBER" >> $COMMIT_MSG_FILE
+  NEW_COMMIT_MSG="$COMMIT_MSG #$ISSUE_NUMBER"
+  echo "$NEW_COMMIT_MSG" > "$COMMIT_MSG_FILE"
   echo "Issue number #$ISSUE_NUMBER has been automatically added to the commit message."
-fi
+fi

frontend/src/apis/balanceContent.ts

@@ -0,0 +1,26 @@
+import fetcher from './fetcher';
+
+import { API_URL } from '@/constants/url';
+import { BalanceContent } from '@/types/balanceContent';
+
+export const fetchBalanceContent = async (roomId = 1): Promise<BalanceContent> => {
+  const res = await fetcher.get({ url: API_URL.balanceContent(roomId) });
+
+  const data = await res.json();
+
+  return data;
+};
+
+export const voteBalanceContent = async (optionId: number, roomId = 1, contentId = 1) => {
+  const res = await fetcher.post({
+    url: API_URL.vote(roomId, contentId),
+    body: {
+      memberId: 1,
+      optionId,
+    },
+  });
+
+  const data = await res.json();
+
+  return data;
+};

frontend/src/components/RoundVoteResult/RoundVoteResult.tsx

@@ -1,19 +1,19 @@
 import { layout, fontBold, voteContent } from './RoundVoteResult.styled';
 
-import useQuestionQuery from '@/hooks/useQuestionQuery';
+import useBalanceContentQuery from '@/hooks/useBalanceContentQuery';
 
 const RoundVoteResult = () => {
-  const { data: question } = useQuestionQuery();
+  const { balanceContent } = useBalanceContentQuery();
 
   return (
     <div css={layout({ percentage: 72 })}>
       <div css={voteContent}>
-        <div css={fontBold}>{question?.firstOption.content}</div>
+        <div css={fontBold}>{balanceContent?.firstOption.name}</div>
         <div css={fontBold}>72%</div>
       </div>
       <span>vs</span>
       <div css={voteContent}>
-        <div css={fontBold}>{question?.secondOption.content}</div>
+        <div css={fontBold}>{balanceContent?.secondOption.name}</div>
         <div>28%</div>
       </div>
     </div>

frontend/src/components/SelectContainer/SelectContainer.tsx

@@ -5,11 +5,11 @@ import { layout, selectSection } from './SelectContainer.styled';
 
 import Button from '@/components/common/Button/Button';
 import SelectOption from '@/components/SelectOption/SelectOption';
-import useQuestionQuery from '@/hooks/useQuestionQuery';
+import useBalanceContentQuery from '@/hooks/useBalanceContentQuery';
 
 const SelectContainer = () => {
   const navigate = useNavigate();
-  const { data: question, isLoading } = useQuestionQuery();
+  const { balanceContent, isLoading } = useBalanceContentQuery();
   const [selectedId, setSelectedId] = useState(0);
 
   const goToRoundResult = () => {
@@ -24,17 +24,17 @@ const SelectContainer = () => {
 
   return (
     <>
-      {question && (
+      {balanceContent && (
         <div css={layout}>
           <section css={selectSection}>
             <SelectOption
-              option={question.firstOption}
+              option={balanceContent.firstOption}
               selectedId={selectedId}
               handleSelectOption={handleSelectOption}
             />
             <span>VS</span>
             <SelectOption
-              option={question.secondOption}
+              option={balanceContent.secondOption}
               selectedId={selectedId}
               handleSelectOption={handleSelectOption}
             />

frontend/src/components/SelectOption/SelectOption.stories.tsx

@@ -21,15 +21,15 @@ type Story = StoryObj<typeof meta>;
 
 export const 선택되지_않은_옵션: Story = {
   args: {
-    option: { content: '100억 빚 송강', optionId: 1 },
+    option: { name: '100억 빚 송강', optionId: 1 },
     selectedId: 0,
   },
   render: ({ ...args }) => <SelectOption {...args} />,
 };
 
 export const 선택된_옵션: Story = {
   args: {
-    option: { content: '100억 빚 송강', optionId: 1 },
+    option: { name: '100억 빚 송강', optionId: 1 },
     selectedId: 1,
   },
 

frontend/src/components/SelectOption/SelectOption.tsx

@@ -1,9 +1,9 @@
 import { layout } from './SelectOption.styled';
 
-import { Question } from '@/types/question';
+import { BalanceContent } from '@/types/balanceContent';
 
 interface SelectOptionProps {
-  option: Question['firstOption'];
+  option: BalanceContent['firstOption'];
   selectedId: number;
   handleSelectOption: (selectedId: number) => void;
 }
@@ -14,7 +14,7 @@ const SelectOption = ({ option, selectedId, handleSelectOption }: SelectOptionPr
       css={layout(Boolean(selectedId === option.optionId))}
       onClick={() => handleSelectOption(option.optionId)}
     >
-      {option.content}
+      {option.name}
     </button>
   );
 };

frontend/src/components/TopicContainer/TopicContainer.tsx

@@ -1,14 +1,14 @@
 import { categoryText, topicLayout, topicText } from './TopicContainer.styled';
 
-import useQuestionQuery from '@/hooks/useQuestionQuery';
+import useBalanceContentQuery from '@/hooks/useBalanceContentQuery';
 
 const TopicContainer = () => {
-  const { data: question } = useQuestionQuery();
+  const { balanceContent } = useBalanceContentQuery();
 
   return (
     <section css={topicLayout}>
-      <span css={categoryText}>{question?.category}</span>
-      <span css={topicText}>{question?.title}</span>
+      <span css={categoryText}>{balanceContent?.category}</span>
+      <span css={topicText}>{balanceContent?.question}</span>
     </section>
   );
 };

frontend/src/constants/url.ts

@@ -1,12 +1,12 @@
 const BASE_URL = process.env.NODE_ENV === 'production' ? process.env.API_BASE_URL : '';
 
 export const API_URL = {
-  question: (roomId: number) => `${BASE_URL}/api/balances/rooms/${roomId}/question`,
-  vote: (roomId: number, questionId: number) =>
-    `${BASE_URL}/api/balances/rooms/${roomId}/questions/${questionId}/votes`,
+  balanceContent: (roomId: number) => `${BASE_URL}/api/balances/rooms/${roomId}/content`,
+  vote: (roomId: number, contentId: number) =>
+    `${BASE_URL}/api/balances/rooms/${roomId}/contents/${contentId}/votes`,
 };
 
 export const MOCK_API_URL = {
-  question: '/api/balances/rooms/:roomId/question',
-  vote: '/api/balances/rooms/:roomId/questions/:questionId/votes',
+  balanceContent: '/api/balances/rooms/:roomId/content',
+  vote: '/api/balances/rooms/:roomId/contents/:contentId/votes',
 };

frontend/src/hooks/useBalanceContentQuery.ts

@@ -0,0 +1,14 @@
+import { useQuery } from '@tanstack/react-query';
+
+import { fetchBalanceContent } from '@/apis/balanceContent';
+
+const useBalanceContentQuery = () => {
+  const balanceContentQuery = useQuery({
+    queryKey: ['balanceContent'],
+    queryFn: async () => await fetchBalanceContent(),
+  });
+
+  return { ...balanceContentQuery, balanceContent: balanceContentQuery.data };
+};
+
+export default useBalanceContentQuery;

frontend/src/mocks/data/balanceContent.json

@@ -0,0 +1,13 @@
+{
+  "contentId": 1,
+  "category": "연애",
+  "question": "당신의 결혼 상대는?",
+  "firstOption": {
+    "optionId": 1,
+    "name": "100억 빚 송강"
+  },
+  "secondOption": {
+    "optionId": 2,
+    "name": "100억 부자 송강호"
+  }
+}

frontend/src/mocks/handlers/balanceContentHandler.ts

@@ -0,0 +1,11 @@
+import { http, HttpResponse } from 'msw';
+
+import BALANCE_CONTENT from '../data/balanceContent.json';
+
+import { MOCK_API_URL } from '@/constants/url';
+
+const fetchBalanceContentHandler = () => {
+  return HttpResponse.json(BALANCE_CONTENT);
+};
+
+export const contentHandler = [http.get(MOCK_API_URL.balanceContent, fetchBalanceContentHandler)];

frontend/src/mocks/handlers/index.ts

@@ -1,4 +1,4 @@
-import { questionHandler } from './questionHandler';
+import { contentHandler } from './balanceContentHandler';
 import { voteHandler } from './voteHandler';
 
-export const handlers = [...questionHandler, ...voteHandler];
+export const handlers = [...contentHandler, ...voteHandler];

frontend/src/mocks/handlers/voteHandler.ts

@@ -2,7 +2,7 @@ import { http, HttpResponse } from 'msw';
 
 import { MOCK_API_URL } from '@/constants/url';
 
-const voteQuestionHandler = async ({ request }: { request: Request }) => {
+const voteBalanceContentHandler = async ({ request }: { request: Request }) => {
   const body = await request.json();
 
   return HttpResponse.json(
@@ -13,4 +13,4 @@ const voteQuestionHandler = async ({ request }: { request: Request }) => {
   );
 };
 
-export const voteHandler = [http.post(MOCK_API_URL.vote, voteQuestionHandler)];
+export const voteHandler = [http.post(MOCK_API_URL.vote, voteBalanceContentHandler)];

frontend/src/types/question.ts → frontend/src/types/balanceContent.ts

@@ -1,13 +1,13 @@
-export interface Question {
-  questionId: number;
-  title: string;
+export interface BalanceContent {
+  contentId: number;
   category: string;
+  question: string;
   firstOption: {
-    content: string;
     optionId: number;
+    name: string;
   };
   secondOption: {
-    content: string;
     optionId: number;
+    name: string;
   };
 }