Tabs using React

Tabs.jsx

import React, { useState } from "react";

const classs = (object) =>
  Object.entries(object).reduce(
    (str, [name, bool]) => `${str}${bool ? ` ${name}` : ""}`,
    ""
  );

const Tabs = ({ children }) => {
  const [active, setActive] = useState(0);
  return (
    <>
      <nav>
        {children.map(({ props: { name } }, index) => (
          <a
            className={classs({ active: index === active })}
            onClick={() => setActive(index)}
          >
            {name}
          </a>
        ))}
      </nav>
      <main>{children[active]}</main>
    </>
  );
};