[Bug] Vue 3 - Problemas com o valor default da prop passada

Estou atualmente na aula 3, enquanto estava fazendo o passo a passo do vídeo "Trabalhando com listas" o resultado final na minha aplicação saiu diferente da do vídeo. Quando o botão de stop é clicado uma lista é criada (como aparece no resultado do vídeo), porém o tempo decorrido sempre é aparece como 0 (defini o valor default dessa prop como sendo 0). Fiz uns testes e descobri que o valor final que aparece na lista, após o stop, sempre muda de acordo com o valor definido no default. Parece ser algum erro bobo, mas não sei qua alteração fazer pro meu código funcionar corretamente

link do repositório do projeto no github: https://github.com/gabrielsimplicio00/alura-tracker

arquivo de onde provavelmente está saindo o erro:

Cronometro.vue

<template>
  <section>
    <strong>{{ tempoDecorrido }}</strong>
  </section>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
  name: 'Cronometro',
  props: {
    tempoEmSegundos: {
      type: Number,
      // ao mudar o valor default, o tempo computado na lista muda após o stop, mas antes do stop tudo funciona corretamente e o valor de tempoEmSegundos permanece correto
      default: 0,
      required: true
    }
  },
  computed: {
    tempoDecorrido(): string {
      return new Date(this.tempoEmSegundos * 1000).toISOString().substring(11, 19)
    }
  },
})
</script>