ebrugulec

generatePassword = () => {
  ...
  this.setState({
      password: passwordArray.join("")
  }, () => {
      this.checkPasswordStrength();
  })
}

ebrugulec

checkPasswordStrength = () => {
  ...
  this.setState({
      strengthScore: 10,
      strengthText: 'weak'
  })
}
copyToClipboard = () => {
  ...
  this.setState({

ebrugulec

<input
    id="length"
    type="range"
    min="6"
    className="range-slider"
    max={maxLength}
    value={length}
    onChange={(e) => this.handleOnChange(e, 'length')}
/>

ebrugulec

function PasswordGenerator(props){
  const [password, setPassword] = useState('')
  const [length, setLength] = useState(props.length)
  const [digitCount, setDigitCount] = useState(props.digitCount)
  const [symbolCount, setSymbolCount] = useState(props.symbolCount)
  const [copy, setCopy] = useState(false)
  const [strengthScore, setStrengthScore] = useState(0)
  const [strengthText, setStrengthText] = useState('')
  const [settings, setSettings] = useState({
      maxLength: props.maxLength,

ebrugulec

useEffect(() => {
    document.getElementById("copy_btn").addEventListener("click", copyToClipboard);
    return () => {
        document.getElementById("copy_btn").removeEventListener("click", copyToClipboard);
    }
}, [])

useEffect(() => {
    generatePassword()
    checkPasswordStrength()

ebrugulec

const generatePassword = () => {
  ...
  setPassword(passwordArray.join(""))
}

ebrugulec

const checkPasswordStrength = () => {
  ...
  setStrengthScore(10)
  setStrengthText('weak')
}

const copyToClipboard = () => {
  ...
  setCopy(true)
  setTimeout(() => {

ebrugulec

const handleOnChange = (e, name) => {
    let value = e.target.value
    if(name === 'length'){
        setLength(value)
    }else if(name === 'digits'){
        setDigitCount(value)
    }else if(name === 'symbols'){
        setSymbolCount(value)
    }
}

ebrugulec

PasswordGenerator.propTypes = {
    length: PropTypes.number,
    digitCount: PropTypes.number,
    symbolCount: PropTypes.number,
    maxLength: PropTypes.number,
    maxDigits: PropTypes.number,
    maxSymbols: PropTypes.number
}

PasswordGenerator.defaultProps = {

ebrugulec

<input type="number" value="2" min="0" max="40" />