Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] TS2362: The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.

import style from './Relogio.module.scss';

interface Props{
    tempo: Number | undefined
}

export default function Relogio({tempo = 0 }: Props){
    const minutes = Math.floor(tempo / 60);
    const seconds = tempo % 60;
    const [minuteTen, minuteUnity] = String(minutes).padStart(2, '0');
    const [secondTen, secondUnity] = String(seconds).padStart(2, '0');
    return(
        <>
        <span className={style.relogioNumero}>minuteTen</span>
        <span className={style.relogioNumero}>minuteUnity</span>
        <span className={style.relogioDivisao}>:</span>
        <span className={style.relogioNumero}>secondTen</span>
        <span className={style.relogioNumero}>secondUnity</span>
        </>
    )
}

Ao tentar fazer o calculo gera o erro: Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Usando o TS Playground dá pra ver o erro também: https://www.typescriptlang.org/pt/play?ssl=11&ssc=2&pln=1&pc=1#code/JYOwLgpgTgZghgYwgAgApQPYAcDOBvAKGWOUgFssMAuZAOQFcyAjaZAH2XpABMIZQI3AgF8CBCAA9KUMMl7x6AG1kwuCMMAwhkAJQiKMAc00AKPOUrIAvMgAMyYTXTYcASkIlkCLTlllQ9JA41sgAsnBgABYAdDAGGFAmFhjIAPTIAGy2rgDcRCTeIL7IOBCF3ME2ycgApJm2eZ6FxQDa-iCBEAAqECAANMjtnQCqIMBgAJ4AuiEAymBQoIYmQ0Gu0Vhw3PNwMiYATAMA5LZHufnEzbItpeU9-SVlWtyj49NzC0smt89uG1s7PaHZAnM55ERAA

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Pelo que consegui entender do erro é um problema na declaração da variável. Alguém sabe a solução ou passou por isso também?

1 resposta
solução!

Encontrado o problema:

export default function Cronometro({selecionado, fimTarefa}: Props){
   ** const [tempo, setTime] = useState<number>();**

    useEffect(() =>{
        if(selecionado?.tempo){
            setTime(timeToSeconds(selecionado.tempo));
        }
    },[selecionado]);

    function countdown(count: number = 0){
        setTimeout(() => {
            if(count > 0){
                setTime(count - 1);
                return countdown(count - 1);
            }
            fimTarefa();
        }, 1000); 
        // valor de 1000 = milisegundos ou 1 segundo
    }
    return(
        <div className={style.cronometro}>
            <p className={style.titulo}>Escolha um card e inicie o cronômetro</p>
            <div className={style.relogioWrapper}>
            <Relogio tempo={tempo}/>
            </div>
            <Botao onClick={() => countdown(tempo)}>
                Vai
            </Botao>
        </div>
    )
}

Era porque a declaração do tipo estava com letra maiúscula e o correto é minuscula.