test

src/entities/payment/api/use-payment-notification-data-mutation.ts

@@ -13,7 +13,7 @@ import {
 
 export const paymentNotificationData = (params: PaymentNotificationDataParams) => {
   return resultify(
-    axios.post<PaymentNotificationDataResponse>(API_URL_PAYMENT.paymentnotificationData(), params),
+    axios.post<PaymentNotificationDataResponse>(API_URL_PAYMENT.paymentNotificationData(), params),
   );
 };
 
@@ -26,4 +26,4 @@ export const usePaymentNotificationDataMutation = (options?: UseMutationOptions<
   return {
     ...mutation,
   };
-};
+};

src/entities/payment/model/types.ts

@@ -2,10 +2,15 @@ export enum PaymentTabKeys {
   Info = 'Info',
   DataNotification = 'DataNotification',
 };
+export enum PaymentInfoItemType {
+  Comission = 'Comission',
+  NoInterest = 'NoInterest'
+};
 export interface PaymentTabProps {
   activeTab: PaymentTabKeys;
 };
 export interface InfoItemProps {
+  type?: PaymentInfoItemType;
   payName?: string;
   payImage?: string;
   infoLink?: string;

src/entities/payment/ui/data-notification-wrap.tsx

@@ -1,4 +1,11 @@
-export const DataNotificationWrap = () => {
+import { PaymentNotificationDataResponse } from '../model/types';
+
+export interface DataNotificationWrapProps {
+  paymentNotificationData?: PaymentNotificationDataResponse;
+};
+export const DataNotificationWrap = ({
+  paymentNotificationData
+}: DataNotificationWrapProps) => {
 
   return (
     <>

src/entities/payment/ui/info-wrap.tsx

@@ -1,9 +1,19 @@
 import { IMAGE_ROOT } from "@/shared/constants/common";
 import { InfoItem } from "./info-item";
-import { InfoItemProps } from "../model/types";
+import { InfoItemProps, PaymentCardResponse, PaymentInfoItemType, PaymentInstallmentResponse, PaymentNonCardResponse } from "../model/types";
 
-export const InfoWrap = () => {
+export interface InfoWrapProp {
+  paymentCard?: PaymentCardResponse,
+  paymentNonCard?: PaymentNonCardResponse,
+  paymentInstallment?: PaymentInstallmentResponse
+};
+export const InfoWrap = ({
+  paymentCard,
+  paymentNonCard,
+  paymentInstallment
+}: InfoWrapProp) => {
   
+
   const list1 = [
     {payName: '신용카드', payImage: 'pay_01.svg', infoLink: ''},
     {payName: '카카오페이', payImage: 'pay_02.svg', infoLink: ''},
@@ -38,24 +48,33 @@ export const InfoWrap = () => {
     {payName: '삼성페이(카드)', payImage: 'pay_04.svg', infoLink: ''},
   ];
 
-  const getList = (type: 'comission' | 'NoInterest') => {
+  const getList = (type: PaymentInfoItemType) => {
     let rs = [];
-    let arr: Array<InfoItemProps> = [];
-    if(type === 'comission'){
-      arr = list1;
+    if(type === PaymentInfoItemType.Comission){
+      for(let i=0;i<list1.length;i++){
+        rs.push(
+          <InfoItem
+            type={ type }
+            payName={ list1[i]?.payName }
+            payImage={ IMAGE_ROOT + '/' + list1[i]?.payImage }
+            infoLink={ list1[i]?.infoLink }
+          ></InfoItem>
+        );
+      }
     }
-    else if(type === 'NoInterest'){
-      arr = list2; 
-    }
-    for(let i=0;i<arr.length;i++){
-      rs.push(
-        <InfoItem
-          payName={ arr[i]?.payName }
-          payImage={ IMAGE_ROOT + '/' + arr[i]?.payImage }
-          infoLink={ arr[i]?.infoLink }
-        ></InfoItem>
-      );
+    else if(type === PaymentInfoItemType.NoInterest){
+      for(let i=0;i<list2.length;i++){
+        rs.push(
+          <InfoItem
+            type={ type }
+            payName={ list2[i]?.payName }
+            payImage={ IMAGE_ROOT + '/' + list2[i]?.payImage }
+            infoLink={ list2[i]?.infoLink }
+          ></InfoItem>
+        );
+      }
     }
+    
     return rs;
   }
 
@@ -65,12 +84,12 @@ export const InfoWrap = () => {
       <div className="ing-list">
         <div className="ing-title">서비스 이용, 수수료 및 정산주기</div>
         <ul className="ing-card-list">
-          { getList('comission') }
+          { getList(PaymentInfoItemType.Comission) }
         </ul>
 
         <div className="ing-title">가맹점 분담 무이자 정보</div>
         <ul className="ing-card-list">
-          { getList('NoInterest') }
+          { getList(PaymentInfoItemType.NoInterest) }
         </ul>
       </div>
     </>