Autocompletar dados da Empresa com React

A melhor experiência de usuário no B2B é não ter que preencher formulários enormes. Veja como buscar a Razão Social e o Endereço de uma empresa apenas digitando o CNPJ.

import { useState } from 'react';

export default function FormularioEmpresa() {
  const [cnpj, setCnpj] = useState('');
  const [dados, setDados] = useState(null);

  const buscarCnpj = async () => {
    const res = await fetch(`https://api.cnpjob.com.br/api/cnpj/${cnpj}`);
    const json = await res.json();
    setDados(json);
  };

  return (
    <div>
      <input value={cnpj} onChange={e => setCnpj(e.target.value)} placeholder="Digite o CNPJ" />
      <button onClick={buscarCnpj}>Buscar</button>
      
      {dados && (
        <div>
          <h3>{dados.razao_social}</h3>
          <p>{dados.endereco.logradouro}, {dados.endereco.municipio} - {dados.endereco.uf}</p>
        </div>
      )}
    </div>
  );
}