[fix] 一部のpropsをdatalistに統合

NUTFes · Nov 20, 2023 · 6fec28d · 6fec28d
1 parent 02bfca5
commit 6fec28d
Showing 1 changed file with 11 additions and 10 deletions.
diff --git a/view/next-project/src/components/common/Input/Input.tsx b/view/next-project/src/components/common/Input/Input.tsx
@@ -11,9 +11,10 @@ interface Props {
   onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
   children?: React.ReactNode;
   type?: string;
-  datalist?: { id: number; name: string }[];
-  listKey?: string;
-  enableDatalist?: boolean;
+  datalist?: {
+    key: string;
+    data: { id:number; name: string}[];
+  }
 }
 
 function Input(props: Props): JSX.Element {
@@ -29,16 +30,16 @@ function Input(props: Props): JSX.Element {
         value={props.value}
         onChange={props.onChange}
         type={props.type}
-        list={props.enableDatalist ? props.listKey : undefined}
+        list={props.datalist?.key}
       >
         {props.children}
       </input>
-      {props.enableDatalist && (
-        <datalist id={props.listKey}>
-          {props.datalist?.map((option) => (
-            <option key={option.id} value={option.name} />
-          ))}
-        </datalist>
+      {props.datalist?.key && props.datalist?.data && (
+        <datalist id={props.datalist.key}>
+         {props.datalist.data.map((option) => (
+           <option key={option.id} value={option.name} />
+         ))}
+       </datalist>
       )}
     </div>
   );