Q8

import { FormLogin, FormCadastro } from './components';
import { Link, useParams } from "react-router-dom";

// a variável que irá controlar qual formulário deve ser exibido
// deverá aceitar apenas os valores "cadastro" e "login" a serem setados
// pelo botões após seleção do usuário
// lembre-se de criar um "tipo de variável" de estado que o React "monitore"
// e que no "click" de cada botão vocês possam setar o valor adequado para
// exibir cada formulário
export default function App() {
  const tipoForm = null;

  return (
    <div className="App container-fluid">
      <h1 className="mb-4">e-comércio - N2 Q8</h1>
      <div className="btn-group" role="group">
        <button type="button" className="btn btn-primary">
          Cadastre-se<Link to="/FormCadastro" className="text-sm text-teal-600 hover:text-red-700" />
        </button>
        <button type="button" className="btn btn-success">
          Login<Link to="/FormLogin" className="text-sm text-teal-600 hover:text-red-700" />
        </button>
      </div>
      <div style={{ marginTop: 16 }}>
        {tipoForm === 'cadastro' ? (
          <Link to="/FormCadastro" className="text-sm text-teal-600 hover:text-red-700" />
        ) : tipoForm === 'login' ? (
          <FormLogin />
        ) : (
          <p style={{ marginTop: 12, fontSize: 12 }}>
            Selecione uma ação acima
          </p>
        )}
      </div>
    </div>
  );
}