Não permitir cadastra clientes iguais como validar?

Front-end JavaScript
#1

import React, { useState } from ‘react’;
import {Link, Redirect} from ‘react-router-dom’;
import Navbar from ‘…/Components/Navbar/navbar’;
import ‘./novocliente.css’;
import firebase from ‘…/Config/firebase’;

function NovoCliente(){

const [empresa, setEmpresa] = useState(‘’);
const [qlf, setQlf] = useState(‘’);
const [tag, setTag] = useState(‘’);
const [equipamento, setEquipamento] = useState(‘’);
const [sistema, setSistema] = useState(‘’);
const [versao, setVersao] = useState(‘’);
const [statu, setStatu] = useState(‘’);
const [mensagem, setMensagem] = useState(‘’);
const [sucesso, setSucesso] = useState(‘N’);
const db = firebase.firestore();

function CadastrarCliente(){

  if (empresa.length === 0){
    setMensagem('Informe o nome');
  }


  else if (tag.length === 0){
    setMensagem('Informe o e-mail');
  }
  else{
      db.collection('clientes').add({
        empresa: empresa,
        qlf: qlf,
        tag: tag,
        equipamento: equipamento,
        sistema: sistema,
        versao: versao,
        statu: statu,
      }).then(() => {
        setMensagem('');
        setSucesso('S');
      }).catch((erro) =>{
        setMensagem(erro);
        setSucesso('N');
      })
    }
  }

return <div>
    <Navbar/>
    <div className="container-fluid titulo">

      <div className="offset-lg-3 col-lg-6">
        <h1>Novo Cliente</h1>
        <form>
        <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">Empresa</label>
            <input onChange={(e) => setEmpresa(e.target.value)} value={empresa} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">QLF-VSC</label>
            <input onChange={(e) => setQlf(e.target.value)} value={qlf} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">Tag</label>
            <input  onChange={(e) => setTag(e.target.value)} value={tag} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">Equipamento</label>
            <input onChange={(e) => setEquipamento(e.target.value)} value={equipamento} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">Sistema</label>
            <input onChange={(e) => setSistema(e.target.value)} value={sistema} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">Versão</label>
            <input  onChange={(e) => setVersao(e.target.value)} value={versao} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="mb-3">
            <label htmlFor="exampleInputEmail1" className="form-label">Status</label>
            <input  onChange={(e) => setStatu(e.target.value)} value={statu} type="text" className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />              
          </div>

          <div className="text-center">
            <Link to="/app/home" className="btn btn-outline-primary btn-acao">Cancelar</Link>
            <button onClick={CadastrarCliente} type="button" className="btn btn-primary btn-acao">Salvar</button>
          </div>

          {mensagem.length > 0 ? <div className="alert alert-danger mt-2" role="alert">{mensagem}</div> : null}
          {sucesso === 'S' ? <Redirect to='/app/home' /> : null}

        </form>
      </div>
    </div>
</div>;

}

export default NovoCliente;