Need checkbox list to have default values based on React-Select option

[Sandilly]

Hello!

I am trying to create a checkbox list that will be pre-checked based on what the user selects from the React-Select input. I used "watch" but the checkbox list doesn't seem to re-render. Any suggestions is greatly appreciated!

const watchSomeSelectComponent = watch("someSelectComponent")

<Controller
        name="someSelectComponent"
        isClearable
         control={control}
         render={({ field }) => (
             <Select
                 {...field}
                 options={SELECT_OPTIONS_LIST}
             />
       )}
/>

 { checkBoxList.map((checkboxItems, idx) => {
        let isChecked = false

       if (watchSomeSelectComponent && watchSomeSelectComponent.value === "YAY"') {
               isChecked = true
       }

       return (
           <li key={idx}>
                 <input type="checkbox" name="accessRole" {...register(`${checkboxItems}`)} defaultChecked={isChecked}/>
                  <label htmlFor={`${checkboxItems}`}>{ checkboxItems }</label>
          </li>
     )
   })} 

[bluebill1049]

can you include a codesandbox?