가맹점 정보, 일부 상수 및 공용 변경

src/entities/transaction/ui/detail-arrow.tsx

@@ -1,26 +0,0 @@
-import { useEffect, useState } from 'react';
-import { IMAGE_ROOT } from '@/shared/constants/common';
-import { 
-  AltMsgKeys,
-  DetailArrowProps 
-} from '@/entities/common/model/types';
-
-export const DetailArrow = ({ show }: DetailArrowProps) => {
-  const [altMsg, setAltMsg] = useState<AltMsgKeys>(AltMsgKeys.Fold);
-  const [className, setClassName] = useState<string>('ic20 rot-180');
-
-  useEffect(() => {
-    setAltMsg((show)? AltMsgKeys.Fold: AltMsgKeys.UnFold);
-    setClassName(`ic20 ${(show)? 'rot-180': ''}`);
-  }, [show]);
-
-  return (
-    <>
-      <img
-        className={ className }
-        src={ IMAGE_ROOT + '/select_arrow.svg' } 
-        alt={ altMsg }
-      />
-    </>
-  );
-};

src/entities/transaction/ui/info-wrap/amount-info-wrap.tsx

@@ -1,6 +1,6 @@
 import moment from 'moment';
 import { NumericFormat } from 'react-number-format';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { useDownloadConfirmationMutation } from '../../api/use-download-confirmation-mutation';
 import { InfoWrapKeys, DetailInfoProps } from '../../model/types';
 import { SlideDown } from 'react-slidedown';
@@ -9,10 +9,10 @@ import 'react-slidedown/lib/slidedown.css';
 export const AmountInfoWrap = ({
   transactionCategory, 
   amountInfo,
-  show,
+  isOpen,
   tid,
   serviceCode,
-  onClickToShowInfo
+  onClickToOpenInfo
 }: DetailInfoProps) => {
   const { mutateAsync: downloadConfirmation } = useDownloadConfirmationMutation();
 
@@ -34,7 +34,7 @@ export const AmountInfoWrap = ({
   };
   
   const showTop = ['01', '02', '03', '26'];
-  const showSubItems: Record<string, Array<string>> = {
+  const openSubItems: Record<string, Array<string>> = {
     // 신용카드
     '01': ['mid', 'cardAmount', 'pointAmount', 
       'couponAmount', 'escrowFee', 'kakaoMoney',
@@ -65,9 +65,9 @@ export const AmountInfoWrap = ({
   let newAmountInfo: Record<string, any> | undefined = amountInfo;
   const subLi = () => {
     let rs = [];
-    if(!!newAmountInfo && !!serviceCode && !!showSubItems[serviceCode]){
-      for(let i=0;i<showSubItems[serviceCode].length;i++){
-        let k = showSubItems[serviceCode][i];
+    if(!!newAmountInfo && !!serviceCode && !!openSubItems[serviceCode]){
+      for(let i=0;i<openSubItems[serviceCode].length;i++){
+        let k = openSubItems[serviceCode][i];
         if(!!k){
           rs.push(
             <li 
@@ -99,8 +99,8 @@ export const AmountInfoWrap = ({
   }
     
   const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.Amount);
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.Amount);
     }
   };
 
@@ -131,12 +131,12 @@ export const AmountInfoWrap = ({
             type="button"
             onClick={ () => onClickToSetShowInfo() }
           >
-            금액상세 <DetailArrow show={ show }></DetailArrow>
+            금액상세 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
           </button>
         </div>
 
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&
+        { !!isOpen &&
           <div className="amount-expand">
             <ul className="amount-list">
               { subLi() }

src/entities/transaction/ui/info-wrap/detail-info-wrap.tsx

@@ -1,5 +1,5 @@
 import moment from 'moment';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps } from '../../model/types';
 import { SlideDown } from 'react-slidedown';
 import 'react-slidedown/lib/slidedown.css';
@@ -7,13 +7,13 @@ import 'react-slidedown/lib/slidedown.css';
 export const DetailInfoWrap = ({
   transactionCategory,
   detailInfo,
-  show,
-  onClickToShowInfo
+  isOpen,
+  onClickToOpenInfo
 }: DetailInfoProps) => {
   
-  const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.Issue);
+  const onClickToSetOpenInfo = () => {
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.Issue);
     }
   };
   
@@ -22,12 +22,12 @@ export const DetailInfoWrap = ({
       <div className="txn-section">
         <div 
           className="section-title with-toggle"
-          onClick={ () => onClickToSetShowInfo() }
+          onClick={ () => onClickToSetOpenInfo() }
         >
-          상세 정보 <DetailArrow show={ show }></DetailArrow>
+          상세 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&
+        { !!isOpen &&
           <ul className="kv-list">
             <li className="kv-row">
               <span className="k">취소일자</span>

src/entities/transaction/ui/info-wrap/escrow-info-wrap.tsx

@@ -1,5 +1,5 @@
 import moment from 'moment';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps } from '../../model/types';
 import { SlideDown } from 'react-slidedown';
 import 'react-slidedown/lib/slidedown.css';
@@ -7,13 +7,13 @@ import 'react-slidedown/lib/slidedown.css';
 export const EscrowInfoWrap = ({
   transactionCategory,
   escrowInfo,
-  show,
-  onClickToShowInfo
+  isOpen,
+  onClickToOpenInfo
 }: DetailInfoProps) => {
   
-  const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.Escrow);
+  const onClickToSetOpenInfo = () => {
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.Escrow);
     }
   };
   
@@ -22,12 +22,12 @@ export const EscrowInfoWrap = ({
       <div className="txn-section">
         <div 
           className="section-title with-toggle"
-          onClick={ () => onClickToSetShowInfo() }
+          onClick={ () => onClickToSetOpenInfo() }
         >
-          정산 정보 <DetailArrow show={ show }></DetailArrow>
+          정산 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&
+        { !!isOpen &&
           <ul className="kv-list">
             <li className="kv-row">
               <span className="k">배송상태</span>

src/entities/transaction/ui/info-wrap/important-info-wrap.tsx

@@ -20,7 +20,7 @@ export const ImportantInfoWrap = ({
     productName: {name: '상품명', type: 'string'}
   };
   
-  const showSubItems: Record<string, Array<string>> = {
+  const openSubItems: Record<string, Array<string>> = {
     // 신용카드
     '01': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
       'approvalDate', 'cancelDate', 'productName'],
@@ -57,9 +57,9 @@ export const ImportantInfoWrap = ({
   const subLi = () => {
     let rs = [];
 
-    if(!!newImportantInfo && !!serviceCode && !!showSubItems[serviceCode]){
-      for(let i=0;i<showSubItems[serviceCode].length;i++){
-        let k = showSubItems[serviceCode][i];
+    if(!!newImportantInfo && !!serviceCode && !!openSubItems[serviceCode]){
+      for(let i=0;i<openSubItems[serviceCode].length;i++){
+        let k = openSubItems[serviceCode][i];
         if(!!k){
           rs.push(
             <li 

src/entities/transaction/ui/info-wrap/issue-info-wrap.tsx

@@ -1,4 +1,4 @@
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps } from '../../model/types';
 import moment from 'moment';
 

src/entities/transaction/ui/info-wrap/part-cancel-info-wrap.tsx

@@ -1,6 +1,6 @@
 import moment from 'moment';
 import { NumericFormat } from 'react-number-format';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps } from '../../model/types';
 import { SlideDown } from 'react-slidedown';
 import 'react-slidedown/lib/slidedown.css';
@@ -9,8 +9,8 @@ export const PartCancelInfoWrap = ({
   transactionCategory,
   partCancelInfo,
   serviceCode,
-  show,
-  onClickToShowInfo
+  isOpen,
+  onClickToOpenInfo
 }: DetailInfoProps) => {
   
   const subItems: Record<string, Record<string, string>> = {
@@ -21,7 +21,7 @@ export const PartCancelInfoWrap = ({
     remainingAmount: {name: (serviceCode === '05')? '재승인 금액': '부분취소 후 잔액', type: 'number'},
   };
   
-  const showSubItems: Record<string, Array<string>> = {
+  const openSubItems: Record<string, Array<string>> = {
     // 신용카드
     '01': ['originalTid', 'originalAmount', 'partCancelTid', 
       'partCancelAmount', 'remainingAmount'],
@@ -58,9 +58,9 @@ export const PartCancelInfoWrap = ({
   const subLi = () => {
     let rs = [];
 
-    if(!!newPartCancelInfo && !!serviceCode && !!showSubItems[serviceCode]){
-      for(let i=0;i<showSubItems[serviceCode].length;i++){
-        let k = showSubItems[serviceCode][i];
+    if(!!newPartCancelInfo && !!serviceCode && !!openSubItems[serviceCode]){
+      for(let i=0;i<openSubItems[serviceCode].length;i++){
+        let k = openSubItems[serviceCode][i];
         if(!!k){
           rs.push(
             <li 
@@ -92,9 +92,9 @@ export const PartCancelInfoWrap = ({
     return rs;
   };
 
-  const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.PartCancel);
+  const onClickToSetOpenInfo = () => {
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.PartCancel);
     }
   };
   
@@ -103,12 +103,12 @@ export const PartCancelInfoWrap = ({
       <div className="txn-section">
         <div 
           className="section-title with-toggle"
-          onClick={ () => onClickToSetShowInfo() }
+          onClick={ () => onClickToSetOpenInfo() }
         >
-          부분취소 정보 <DetailArrow show={ show }></DetailArrow>
+          부분취소 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&
+        { !!isOpen &&
           <ul className="kv-list">
           { subLi() }
           </ul>

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

@@ -1,6 +1,5 @@
 import moment from 'moment';
-import { motion } from 'framer-motion';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps, TransactionCategory } from '../../model/types';
 import { NumericFormat } from 'react-number-format';
 import { SlideDown } from 'react-slidedown';
@@ -10,8 +9,8 @@ export const PaymentInfoWrap = ({
   transactionCategory,
   paymentInfo,
   serviceCode,
-  show,
-  onClickToShowInfo
+  isOpen,
+  onClickToOpenInfo
 }: DetailInfoProps) => {
 
   const subItems: Record<string, Record<string, string>> = {
@@ -49,7 +48,7 @@ export const PaymentInfoWrap = ({
     culturelandId: {name: '컬처랜드ID', type: 'string'},
   };
 
-  const showSubItems: Record<string, Array<string>> = {
+  const openSubItems: Record<string, Array<string>> = {
     // 신용카드
     '01': ['approvalAcquire', 'approvalReturn', 'approvalReAcquire', 
       'approvalVAN', 'cancelAcquire', 'cancelReturn', 'cancelReAcquire',
@@ -82,9 +81,9 @@ export const PaymentInfoWrap = ({
   const subLi = () => {
     let rs = [];
 
-    if(!!newPaymentInfo && !!serviceCode && !!showSubItems[serviceCode]){
-      for(let i=0;i<showSubItems[serviceCode].length;i++){
-        let k = showSubItems[serviceCode][i];
+    if(!!newPaymentInfo && !!serviceCode && !!openSubItems[serviceCode]){
+      for(let i=0;i<openSubItems[serviceCode].length;i++){
+        let k = openSubItems[serviceCode][i];
         if(!!k){
           rs.push(
             <li 
@@ -116,9 +115,9 @@ export const PaymentInfoWrap = ({
     return rs;
   };
 
-  const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.Payment);
+  const onClickToSetOpenInfo = () => {
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.Payment);
     }
   };
   
@@ -127,12 +126,12 @@ export const PaymentInfoWrap = ({
       <div className="txn-section">
         <div 
           className="section-title with-toggle"
-          onClick={ () => onClickToSetShowInfo() }
+          onClick={ () => onClickToSetOpenInfo() }
         >
-          결제 정보 <DetailArrow show={ show }></DetailArrow>
+          결제 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&
+        { !!isOpen &&
           <ul className="kv-list">
             { (transactionCategory === TransactionCategory.AllTransaction) && 
               subLi()

src/entities/transaction/ui/info-wrap/settlement-info-wrap.tsx

@@ -1,6 +1,6 @@
 import moment from 'moment';
 import { NumericFormat } from 'react-number-format';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps } from '../../model/types';
 import { SlideDown } from 'react-slidedown';
 import 'react-slidedown/lib/slidedown.css';
@@ -9,8 +9,8 @@ export const SettlementInfoWrap = ({
   transactionCategory,
   settlementInfo,
   serviceCode,
-  show,
-  onClickToShowInfo
+  isOpen,
+  onClickToOpenInfo
 }: DetailInfoProps) => {
   
   const subItems: Record<string, Record<string, string>> = {
@@ -20,7 +20,7 @@ export const SettlementInfoWrap = ({
     cancelSettleAmount: {name: '취소정산금액', type: 'number'},
   };
 
-  const showSubItems: Record<string, Array<string>> = {
+  const openSubItems: Record<string, Array<string>> = {
     // 신용카드
     '01': ['approvalSettleDate', 'approvalSettleAmount', 
       'cancelSettleDate', 'cancelSettleAmount'],
@@ -57,9 +57,9 @@ export const SettlementInfoWrap = ({
   const subLi = () => {
     let rs = [];
 
-    if(!!newSettlementInfo && !!serviceCode && !!showSubItems[serviceCode]){
-      for(let i=0;i<showSubItems[serviceCode].length;i++){
-        let k = showSubItems[serviceCode][i];
+    if(!!newSettlementInfo && !!serviceCode && !!openSubItems[serviceCode]){
+      for(let i=0;i<openSubItems[serviceCode].length;i++){
+        let k = openSubItems[serviceCode][i];
         if(!!k){
           rs.push(
             <li 
@@ -91,9 +91,9 @@ export const SettlementInfoWrap = ({
     return rs;
   };
 
-  const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.Settlement);
+  const onClickToSetOpenInfo = () => {
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.Settlement);
     }
   };
   
@@ -102,12 +102,12 @@ export const SettlementInfoWrap = ({
       <div className="txn-section">
         <div 
           className="section-title with-toggle"
-          onClick={ () => onClickToSetShowInfo() }
+          onClick={ () => onClickToSetOpenInfo() }
         >
-          정산 정보 <DetailArrow show={ show }></DetailArrow>
+          정산 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&
+        { !!isOpen &&
           <ul className="kv-list">
           { subLi() }
           </ul>

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

@@ -1,5 +1,5 @@
 import moment from 'moment';
-import { DetailArrow } from '../detail-arrow';
+import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow';
 import { InfoWrapKeys, DetailInfoProps, TransactionCategory } from '../../model/types';
 import { NumericFormat } from 'react-number-format';
 import { SlideDown } from 'react-slidedown';
@@ -9,8 +9,8 @@ export const TransactionInfoWrap = ({
   transactionCategory,
   transactionInfo,
   serviceCode,
-  show,
-  onClickToShowInfo
+  isOpen,
+  onClickToOpenInfo
 }: DetailInfoProps) => {
 
   const subItems: Record<string, Record<string, string>> = {
@@ -23,7 +23,7 @@ export const TransactionInfoWrap = ({
     cashReceiptIssue: {name: '현금영수증발행', type: 'string'},
   };
 
-  const showSubItems: Record<string, Array<string>> = {
+  const openSubItems: Record<string, Array<string>> = {
     // 신용카드
     '01': ['buyerName', 'email', 'phoneNumber', 'cancelReason', 
       'cancelRequestor', 'partialCancel'],
@@ -60,9 +60,9 @@ export const TransactionInfoWrap = ({
   const subLi = () => {
     let rs = [];
 
-    if(!!newTransactionInfo && !!serviceCode && !!showSubItems[serviceCode]){
-      for(let i=0;i<showSubItems[serviceCode].length;i++){
-        let k = showSubItems[serviceCode][i];
+    if(!!newTransactionInfo && !!serviceCode && !!openSubItems[serviceCode]){
+      for(let i=0;i<openSubItems[serviceCode].length;i++){
+        let k = openSubItems[serviceCode][i];
         if(!!k){
           rs.push(
             <li 
@@ -94,23 +94,23 @@ export const TransactionInfoWrap = ({
     return rs;
   };
 
-  const onClickToSetShowInfo = () => {
-    if(!!onClickToShowInfo){
-      onClickToShowInfo(InfoWrapKeys.Transaction);
+  const onClickToSetOpenInfo = () => {
+    if(!!onClickToOpenInfo){
+      onClickToOpenInfo(InfoWrapKeys.Transaction);
     }
   };
 
   return (
     <>
-      <div className="txn-section" onClick={ () => onClickToSetShowInfo() }>
+      <div className="txn-section">
         <div 
           className="section-title with-toggle"
-          onClick={ () => onClickToSetShowInfo() }
+          onClick={ () => onClickToSetOpenInfo() }
         >
-          거래 정보 <DetailArrow show={ show }></DetailArrow>
+          거래 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
         <SlideDown className={'my-dropdown-slidedown'}>
-        { !!show &&  
+        { !!isOpen &&  
           <ul className="kv-list">
           { (transactionCategory === TransactionCategory.AllTransaction) && 
             subLi()