reactjs / reactjs/react.dev

[Bug]: "Reset state" on the playgrounds UX is confusing

Aberta
#7,848 1 comentário 0 reações 0 responsáveis Ver no GitHub

Ninguém assumiu esta issue ainda.

bug: unconfirmed
Linguagem predominante
JavaScript
Estrelas
11.8k
Forks
7.9k
Merge médio
1d 11h
PRs com merge (30d)
11

Descrição

Summary

If you want to reset the React state of a playground, but not the code, it's very unclear how to do so.
The only way I found is clicking on "Reset", which triggers a popup saying "Reset all your edits too?" and then pressing "Cancel". This will successfully reset the state but not the code. However there are two issues with that:

  1. It's not clear at all that this is the proper way to do so. Should there be two buttons instead?
  2. UX itself is counter-intuitive:
    a. The question is "Reset all your edits too?", which is a yes/no question, but the options are "Ok" or "Cancel"
    b. Normally if you press "Cancel" on a confirmation modal, it should cancel the original action altogether, but here is applies the action partially (reset the state but not the edits)
Page

https://react.dev/learn/separating-events-from-effects#challenges

Details

No response

Guia de contribuição

Abrir o guia de contribuição

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Direção de pesquisa

Comece pela página da challenge vinculada «Separating Events from Effects» e reproduza o fluxo de Reset do playground. Revise como são apresentadas as opções de resetar apenas o estado e de editar e resetar, depois torne inequívocos as ações disponíveis e o texto de confirmação. O trabalho estará concluído quando os usuários conseguirem entender como resetar o estado do React sem resetar o código e o que cada opção fará.

Escrita pelo modelo de indexação a partir do texto da issue.

Avaliação

Stack de tecnologia
javascript, react
Domínio
design, documentation, frontend
Tipo de issue
Bug
Dificuldade
3/5
Tempo estimado
1-2 dias
Status de atividade
Estagnada
Clareza
Razoavelmente clara
Facilidade para iniciantes
42/100

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.