빌키 에스크로 추가 api 연ㄱㅕㄹ

src/entities/transaction/ui/billing-list.tsx

@@ -25,7 +25,7 @@ export const BillingList = ({
   };
 
   const onClickToNavigate = () => {
-    navigate(PATHS.transaction.billing.paymentRequest);
+    navigate(PATHS.transaction.billing.charge);
   };
   
   return (

src/entities/transaction/ui/cash-receit-purpose-update-bottom-sheet.tsx

@@ -1,17 +1,17 @@
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { motion } from 'framer-motion';
 
-export interface BottomSheetCashReceitPurposeUpdateProps {
+export interface CashReceitPurposeUpdateBottomSheetProps {
   setBottomSheetOn: (bottomSheetOn: boolean) => void;
   bottomSheetOn: boolean;
   callPurposeUpdate: () => void;
 };
 
-export const BottomSheetCashReceitPurposeUpdate = ({
+export const CashReceitPurposeUpdateBottomSheet = ({
   setBottomSheetOn,
   bottomSheetOn,
   callPurposeUpdate
-}: BottomSheetCashReceitPurposeUpdateProps) => {
+}: CashReceitPurposeUpdateBottomSheetProps) => {
   
   const onClickToClose = () => {
     setBottomSheetOn(false);

src/entities/transaction/ui/escrow-mail-resend-bottom-sheet.tsx

@@ -1,11 +1,42 @@
 import { IMAGE_ROOT } from '@/shared/constants/common';
+import { motion } from 'framer-motion';
 
-export const BottomSheetEmail = () => {
+export interface EscrowMailResendBottomSheetProps {
+  setBottomSheetOn: (bottomSheetOn: boolean) => void;
+  bottomSheetOn: boolean;
+  callMailResend: () => void;
+};
+
+export const EscrowMailResendBottomSheet = ({
+  setBottomSheetOn,
+  bottomSheetOn,
+  callMailResend
+}: EscrowMailResendBottomSheetProps) => {
+
+  const onClickToClose = () => {
+    setBottomSheetOn(false);
+  };
+  const onClickToMailResend = () => {
+    callMailResend();
+  };
+
+  const variants = {
+    hidden: { y: '100%' },
+    visible: { y: '0%' },
+  };
 
   return (
     <>
-      <div className="bg-dim"></div>
-      <div className="bottomsheet">
+      { (bottomSheetOn) &&
+        <div className="bg-dim"></div>
+      }
+      <motion.div 
+        className="bottomsheet"
+        initial="hidden"
+        animate={ (bottomSheetOn)? 'visible': 'hidden' }
+        variants={ variants }
+        transition={{ duration: 0.5 }}
+      >
         <div className="bottomsheet-header">
           <div className="bottomsheet-title">
             <h2>이메일 주소를 선택하세요</h2>
@@ -16,6 +47,7 @@ export const BottomSheetEmail = () => {
               <img
                 src={ IMAGE_ROOT + '/ico_close.svg' }
                 alt="닫기"
+                onClick={ () => onClickToClose() }
               />
             </button>
           </div>
@@ -27,7 +59,7 @@ export const BottomSheetEmail = () => {
               <div className="mail-icon">
                 <div className="mail-icon-bg"></div>
                 <img
-                  src="../images/ico_email.svg"
+                  src={ IMAGE_ROOT +'/ico_email.svg' }
                   alt="메일"
                 />
               </div>
@@ -54,10 +86,10 @@ export const BottomSheetEmail = () => {
           <button
             className="btn-50 btn-blue flex-1"
             type="button"
-            disabled
+            onClick={ () => onClickToMailResend() }
           >신청</button>
         </div>
-      </div>
+      </motion.div>
     </>
   );
 };