mid 관련 수정

src/pages/additional-service/list-page.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { ChangeEvent, useEffect, useState } from 'react';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { HeaderType } from '@/entities/common/model/types';
@@ -29,19 +29,15 @@ export const ListPage = () => {
     navigate(PATHS.home);
   });
 
-  const callExtensionList = (selectedMid: string) => {
+  const callExtensionList = () => {
     let params: ExtensionListParams = {
-      mid: selectedMid
+      mid: mid
     }
     extensionList(params).then((rs: ExtensionListResponse) => {
       console.log(rs)
     });
   };
 
-  useEffect(() => {
-    callExtensionList(userMid);
-  }, []);
-
   const activeExtensionList = [
     {
       className: 'list-wrap01', serviceName: 'SMS 결제 통보', serviceDesc: '입금 요청부터 완료까지 SMS 자동 전송',
@@ -138,10 +134,12 @@ export const ListPage = () => {
     return rs;
   };
 
-  const onChangeMid = (value: string) => {
-    callExtensionList(value);
-  };
-
+  useEffect(() => {
+    if(!!mid){
+      callExtensionList();
+    }
+  }, [mid]);
+  
   return (
     <>
       <main>
@@ -149,13 +147,15 @@ export const ListPage = () => {
           <div className="tab-pane sub active">
             <div className="ing-list">
               <div className="input-wrapper top-select">
-              <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>
                   )) 
                 }