Реагировать на выбор управления

У меня есть данные в файле с именем GlobalState.js, и я пытаюсь получить доступ к другому файлу с именем AddClass.js.

GlobalState.js

myclasses:[
     {
      "id":"class1",
      "name":"Maths",
      "students":["arun1","ashok1","rajesh1","mahesh1"],
      "teachers":["ramesh1","suresh1","ashwin1"]
     },
     {
      "id":"class2",
      "name":"Science",
      "students":["arun2","ashok2","rajesh2","mahesh2"],
      "teachers":["ramesh2","suresh2","ashwin2"]
    }
   ]

Я хочу, чтобы имена учеников отображались в моем элементе управления React-Select. Ниже приведен код, который я пробовал. Спасибо за поддержку.

AddClass.js

import React, {useState, useEffect, useContext } from 'react'
import { GlobalContext } from '../../context/GlobalState'
import { v4 as uuid } from "uuid";
import { useForm } from "react-hook-form";
import { Link, useHistory } from 'react-router-dom';
import Select from 'react-select'

const AddClass = () => {
    const [selectedOption, setSelectedOption] = React.useState();
    const { addClass, myclasses} = useContext(GlobalContext);
    const studOptions = myclasses.map((c)=> {
        return {label:c.students.map((s)=>{
            console.info("s",s)
            return([{value: s, label:s}]);
        }), value:c.id}
    })

    return (
        <React.Fragment>                                
            <form onSubmit = {handleSubmit(onSubmit)}>                                                                          
              <label>Select Students</label>                                  
              <Select        
                  value = {selectedOption}
                  isMulti
                  onChange = {handleChangeEvent}
                  options = {filteredStud}                              
              />                                                                     
            </form>
        </React.Fragment>
    )
}

export default AddClass