mid 관련 수정

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

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { ChangeEvent, useEffect, useState } from 'react';
 import { NotifyRowKeys } from '../model/types';
 import { usePaymentNotificationDataMutation } from '../api/use-payment-notification-data-mutation';
 import { useStore } from '@/shared/model/store';
@@ -8,6 +8,7 @@ export const NotificationDataWrap = () => {
   const midOptions = useStore.getState().UserStore.selectOptionsMids;
   const userMid = useStore.getState().UserStore.mid;
 
+  const [mid, setMid] = useState<string>(userMid);
   const [merchantInfo, setMerchantInfo] = useState<Record<string, any>>();
   const [creditCard, setCreditCard] = useState<Record<string, any>>();
   const [accountTransfer, setAccountTransfer] = useState<Record<string, any>>();
@@ -19,10 +20,10 @@ export const NotificationDataWrap = () => {
 
   const { mutateAsync: paymentNotificationData } = usePaymentNotificationDataMutation();
 
-  const callPaymentNotificationData = (selectedMid: string) => {
+  const callPaymentNotificationData = () => {
     let params = {
-      mid: selectedMid,
-      gid: selectedMid
+      mid: mid,
+      gid: mid
     };
       
     paymentNotificationData(params).then((rs) => {
@@ -35,26 +36,23 @@ export const NotificationDataWrap = () => {
       setEscrowPayment(rs?.escrowPayment.detail);
     });
   };
-  const onChangeMid = (value: string) => {
-    callPaymentNotificationData(value);
-  };
   useEffect(() => {
-    if(!!userMid){
-      callPaymentNotificationData(userMid);
-    }
-  }, []);
+    callPaymentNotificationData();
+  }, [mid]);
   
   return (
     <>
       <div className="ing-list">
         <div className="input-wrapper top-select mt-16">
-          <select onChange={ (e) => onChangeMid(e.target.value) }>
+          <select
+            value={ mid }
+            onChange={ (e: ChangeEvent<HTMLSelectElement>) => setMid(e.target.value) }
+          >
           { 
             midOptions.map((value, index) => (
               <option
                 key={ value.value }
                 value={ value.value }
-                selected={ (userMid === value.value)? true: false }
               >{ value.name }</option>
             )) 
           }