import React, { useState, useEffect } from 'react'; import { TrackMentors } from './TrackMentors'; import { Radio } from 'antd'; import codeClanApi from '../../../../api/apiUtils'; import CustomLoader from '../../../common/Spinner/CustomLoader'; function SelectMentorStep({ trackId, handleSetMentorId }) { const [trackMentors, setTrackMentors] = useState(null); const [loading, setLoading] = useState(false); const getTrackMentors = async () => { setLoading(true); try { const res = await codeClanApi.get(`/tracks/${trackId}/mentors`); setTrackMentors(res.data); } catch (err) { throw Error(err); } setLoading(false); }; useEffect(() => { getTrackMentors(); // eslint-disable-next-line }, []); return ( <React.Fragment> <Radio.Group onChange={handleSetMentorId} defaultValue={null}> <div className=""> <p> Select the mentor that you want as your guide throughout the program.{' '} <span className="text-danger">*This process is not reversible</span> </p> {trackMentors && !loading ? ( <TrackMentors mentors={trackMentors} /> ) : ( <CustomLoader /> )} </div> </Radio.Group> </React.Fragment> ); } export default SelectMentorStep;