Así que necesito hacer un validador Reactjs TFN directo y, como soy muy nuevo en Javascript, tengo muchos problemas. Probé innumerables correcciones, pero ninguna funcionó con los estándares de integración que debo cumplir. Estoy seguro de que acabo de cometer un error tonto, pero no puedo verlo. Si alguien quiere pasar 10 minutos mirando lo que he escrito y dando su opinión, realmente lo agradecería y si alguien descubre cómo hacerlo funcionar, estoy seguro de que cualquier otra persona que pueda usar esto lo apreciará. ¡Gracias!

 import React, {useState} from 'react' export function TfnForm(props) { const [tfnvalue,settfnvalue] = useState(""); const [success, setsuccess] = useState(false) var tfnconf = false; var sum = 0; console.log(tfnconf,"initiate") const handleValidation = validate => { setsuccess(current => !current) } ///return statements for render var doSuccess = function(message) { ('#result').addClass('bg-success').text(message).show(); }; var doError = function(message) { ('#result').addClass('bg-danger').text(message).show(); }; ///validation algorithm const validate = () => { if (tfnvalue.length === 9); sum = (tfnvalue[0]*1) + (tfnvalue[1]*4) + (tfnvalue[2]*3) + (tfnvalue[3]*7) + (tfnvalue[4]*5) + (tfnvalue[5]*8) + (tfnvalue[6]*6) + (tfnvalue[7]*9) + (tfnvalue[8]*10); sum = sum%11 if (sum === 0) { return ( doSuccess("Valid Tax File Number") ) } return ( doError("Invalid TFN, check the digits.") ) } ///rendering html return ( <div className="container"> <form id="tfn_validator"> <h2>TFN Validator</h2> <div className={success ? 'has-success':'has-error'}> <label htmlFor="tfn" className="sr-only">TFN</label> <input type="text" id="tfn" size="40" className="form-control input-lg" placeholder="Enter the TFN" autoComplete="off" onChange={v=>settfnvalue(v.currentTarget.value)} required autoFocus /> </div> <br /> <button className="btn btn-lg btn-primary btn-block" type="button" onClick={validate}>Validate</button> <br /> </form> <br /> </div> )}