extra row appearing in generated excel

I'm using npm package xlsx to generate excel reports which have table within table. everything is working fine except you can see in the attached screenshot that line#10 is the same as all the table below that. I'm sure i'm making an html table error but after two hours could not figure out what the error actually is. I've attached the screenshot and html.

import React from 'react';

const Report = ({ data }) => {
  // console.log(data);
  return (
    <table>
      <tbody>
        <tr>
          <td style=>
            Source Name:
          </td>
          <td>SOme cool report</td>
        </tr>
        <tr>
          <td>Report Name:</td>
          <td colSpan='6'>
            02 Dummy
          </td>
        </tr>
        <tr />
        <tr>
          <td>Data Write:</td>
          <td>Append to Previous Data</td>
        </tr>
        <tr>
          <td>Download Date:</td>
          <td>19/04/2021 13:16</td>
        </tr>
        <tr>
          <td>SR Id:</td>
          <td>99931</td>
        </tr>
        <tr>
          <td>Data Period:</td>
          <td> 2021/3</td>
        </tr>
        <tr>
          <td>Report Period: </td>
          <td>Monthly </td>
        </tr>
        <tr>
          <td>sdfasdfasdf:</td>
          <td>sdfsdf</td>
        </tr>
        <tr>
          <td>
            <table>
              <tbody>
                <tr>
                  <td></td>
                  <td colSpan='2'>Less than 1</td>
                  <td colSpan='2'>{'1-4'}</td>
                  <td colSpan='2'>{'5-9'}</td>
                  <td colSpan='2'>{'10-14'}</td>
                  <td colSpan='2'>{'15-19'}</td>
                  <td colSpan='2'>{'20-24'}</td>
                  <td colSpan='2'>{'25-44'}</td>
                  <td colSpan='2'>{'45-64'}</td>
                  <td colSpan='2'>{'65+'}</td>
                </tr>
                <tr>
                  <td>Dummy</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                  <td>Male</td> <td>Female</td>
                </tr>
                {Object.keys(data).map((d) => (
                  <tr>
                    <td>{d}</td>
                    <td>{data[d]?.abc?.male}</td>
                    <td>{data[d]?.abc?.female}</td>
                    <td>{data[d]?.cde1?.male}</td>{' '}
                    <td>{data[d]?.cde1?.female}</td>
                    <td>{data[d]?.cde2?.male}</td>{' '}
                    <td>{data[d]?.cde2?.female}</td>
                    <td>{data[d]?.cde3?.male}</td>
                    <td>{data[d]?.cde3?.female}</td>
                    <td>{data[d]?.abcd1?.male}</td>
                    <td>{data[d]?.abcd1?.female}</td>
                    <td>{data[d]?.abcd2?.male}</td>
                    <td>{data[d]?.abcd2?.female}</td>
                    <td>{data[d]?.ere1?.male}</td>
                    <td>{data[d]?.ere1?.female}</td>
                    <td>{data[d]?.ere2?.male}</td>
                    <td>{data[d]?.ere2?.female}</td>
                    <td>{data[d]?.ou?.male}</td>
                    <td>{data[d]?.ou?.female}</td>
                  </tr>
                ))}
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
  );
};

export default Report;

from extra row appearing in generated excel