Ugly fit of embedded array field

[pedrohfornari]

I am kind of new to react/js and am using aor to develop a platform. I am trying to dispose a history datagrid which is passed from my API as an array. You can see my issue in the image bellow.

Please let me know if I can help you with something or if you have some kind of solution.

[MhdSyrwan]

Can you provide the code you used to generate this ui ?

[pedrohfornari]

Yes, for sure

            <FormTab label="História">
              <EmbeddedArrayField source="history" label="Modificações">
                <TextField source="history_change_reason" label="Razão da modificação"/>
                <NumberField source="job_status" label="Status"/>
                <TextField source="expected_start" label="Data de início"/>
              </EmbeddedArrayField>
            </FormTab>

It's a FormTab inside a TabbedForm of the Edition page. In fact what I'm doing is showing the history of that model.

My API response is:

{type: "Job", 
  id: "10",
  creation_date: MM/DD/YYYY,
 history:[{
               job_status:0, history_change_reason:RERE, expected_start:MM/DD/YYYY]},
               job_status:0.5, history_change_reason:RARA, expected_start:MM/DD/YYYY]},]
.
.
.
}