export const MyComponent = < T extends { id?: string; iterator: string } >({ data, iterator }: Props<T>) => ( <div> {data?.map((i: T) => ( <MySecondComp key={i.id} text={i[iterator]} /> ))} </div> )

pero se queja de la parte del i[iterator] con el título de esta pregunta

¿Cómo puedo solucionar esto? esencialmente, estoy mapeando datos y los he hecho reutilizables y puede pasar un iterador y los datos son desconocidos