Fix select field with data

1 files changed, 4 insertions, 2 deletions

diff --git a/src/common/components/SelectField.jsx b/src/common/components/SelectField.jsx
index db8c30b0..de9dedce 100644
--- a/src/common/components/SelectField.jsx
+++ b/src/common/components/SelectField.jsx
@@ -1,7 +1,7 @@
+import React, { useEffect, useState } from 'react';
 import {
   FormControl, InputLabel, MenuItem, Select, Autocomplete, TextField,
 } from '@mui/material';
-import React, { useState } from 'react';
 import { useEffectAsync } from '../../reactHelper';
 
 const SelectField = ({
@@ -17,7 +17,7 @@ const SelectField = ({
   keyGetter = (item) => item.id,
   titleGetter = (item) => item.name,
 }) => {
-  const [items, setItems] = useState(data);
+  const [items, setItems] = useState();
 
   const getOptionLabel = (option) => {
     if (typeof option !== 'object') {
@@ -26,6 +26,8 @@ const SelectField = ({
     return option ? titleGetter(option) : emptyTitle;
   };
 
+  useEffect(() => setItems(data), [data])
+
   useEffectAsync(async () => {
     if (endpoint) {
       const response = await fetch(endpoint);