Supongamos que hay un conjunto de datos que debe vincularse a una tabla usando TypeScript + reaccionar.

El formato de datos es como se menciona a continuación.

 { aa_x : "somevalue", aa_y : "somevalue", aa_y : "somevalue", bb_x : "somevalue", bb_y : "somevalue", bb_y : "somevalue", cc_x : "somevalue", cc_y : "somevalue", cc_y : "somevalue" }

Ahora tengo que mostrarlo en una tabla donde el valor debajo del guión bajo será el primer elemento td de cada etiqueta tr y el valor después del guión bajo será el encabezado de la tabla. Imagen adjunta a continuación para el resultado esperado.

ingrese la descripción de la imagen aquí

¿Cuál es la mejor manera de crear una interfaz? No quiero repetir x, y y z 3 veces para cada conjunto de datos.