ReactQuill with React-hook-form useFieldArray

Question

Hit a wall with trying to use ReactQuill Editor and React-Hook-Form with dynamic content.

I'm basic component that allows the user to edit HTML content and I have tabs for each of the languages the content can be available for. This works perfetc for normal textfield input

So this works perfect

const { fields, append } = useFieldArray({
      control,
      name: 'templatebodies',
      keyName: 'id',
   });

return (
   <RHFTextField
      multiline
      maxRows={10}
      name={`templatebodies.${index}.textContent`}
   />
);

But when I try and use the Quill editor it will not accept the string interpolation needed to build the component

const { fields, append } = useFieldArray({
      control,
      name: 'templatebodies',
      keyName: 'id',
   });

return (
   <RHFEditor simple name={`templatebodies.${index}.textContent`} />
);

export default function RHFEditor({ name, helperText, ...other }: Props) {
   const {
      control,
      watch,
      setValue,
      formState: { isSubmitSuccessful },
   } = useFormContext();

   const values = watch();

  
   return (
      <Controller
         name={name}
         control={control}
         render={({ field, fieldState: { error } }) => (
            <Editor
               id={name}
               value={field.value}
               onChange={field.onChange}
               error={!!error}
               helperText={
                  (!!error || helperText) && (
                     <FormHelperText error={!!error} sx={{ px: 2 }}>
                        {error ? error?.message : helperText}
                     </FormHelperText>
                  )
               }
               {...other}
            />
         )}
      />
   );
}

I guess I have reached my limit of comprehension or I'm just thick :-)

Any help will be great - need light in the tunnel!

Thanks