External API JSON option not showing in Forge custom field

Forge
,
1

I am trying to create a custom field, which get data from REST API.
I have tried to edit the edit.jsx file, but dropdown are showing empty. Kindly suggest, how to fix. I am new to forge.
edit.jsx file code :

import React, { useState, useCallback, useEffect } from 'react';
import ForgeReconciler, { Select, Text } from '@forge/react';
import { CustomFieldEdit } from '@forge/react/jira';
import { view } from '@forge/bridge';

const Edit = () => {
  const [value, setValue] = useState('');
  const [selectOptions, setSelectOptions] = useState([]);
  const [loading, setLoading] = useState(true);

  const onSubmit = useCallback(async () => {
    try {
      await view.submit(value);
    } catch (e) {
      console.error(e);
    }
  }, [value]);

  const handleOnChange = useCallback((e) => {
    setValue(e.value);
  }, []);

  useEffect(() => {
    const fetchEmployees = async () => {
      try {
        const response = await fetch('https://dummy.restapiexample.com/api/v1/employees');
        const data = await response.json();
        if (data && data.data) {
          const options = data.data.map(emp => ({
            label: emp.employee_name,
            value: emp.employee_name
          }));
          setSelectOptions(options);
        }
      } catch (error) {
        console.error('Error fetching employees:', error);
      } finally {
        setLoading(false);
      }
    };

    fetchEmployees();
  }, []);

  return (
    <CustomFieldEdit onSubmit={onSubmit} hideActionButtons>
      {loading ? (
        <Text>Loading options...</Text>
      ) : (
        <Select
          appearance="default"
          options={selectOptions}
          onChange={handleOnChange}
          value={value}
        />
      )}
    </CustomFieldEdit>
  );
};

ForgeReconciler.render(
  <React.StrictMode>
    <Edit />
  </React.StrictMode>
);