fix(interface): #745 respostas duplicadas #749
Conversation
|
@Rafaelb4rros is attempting to deploy a commit to the TabNews Team on Vercel. To accomplish this, @Rafaelb4rros needs to request access to the Team. Afterwards, an owner of the Team is required to accept their membership request. If you're already a member of the respective Vercel Team, make sure that your Personal Vercel Account is connected to your GitHub account. |
|
Parece que o CI não está rodando, sera que fiz algo errado? |
No meu também não rodou, acho que é o que o Filipe falou na parte |
Acho que é isso, eu não rodei o 'npm run commit'. Vou tentar reverter esse commit atual e rodar o comando, acho que isso vai resolver (eu espero kkkkk). |
…ais ao realizar certas ações fix #745
|
Usei todas as minhas habilidades e não consegui fazer o CI rodar... e agora? |
|
@Rafaelb4rros muito obrigado por tentar de tudo para fazer rodar o CI! Infelizmente isso é um bug randômico causado pela integração da Vercel aqui no GitHub. Já reportei isso para eles que confirmaram o bug mas não há nenhum prazo (ou diria até incentivo) para consertar isso. Nesses casos, o CI só irá rodar para quem tem permissão de fazer deploy. Mas não se preocupe, assim que eu revisar o PR, irei fazer o merge numa branch intermediária que irá fazer rodar tudo, incluindo o deploy no ambiente de homologação 🤝 |
| @@ -71,7 +72,7 @@ export default function Content({ content, mode = 'view', viewFrame = false }) { | |||
| if (componentMode === 'view') { | |||
| return <ViewMode setComponentMode={setComponentMode} contentObject={contentObject} viewFrame={viewFrame} />; | |||
| } else if (componentMode === 'compact') { | |||
| return <CompactMode setComponentMode={setComponentMode} />; | |||
| return <CompactMode resetContentObject={() => setContentObject(content)} setComponentMode={setComponentMode} />; | |||
There was a problem hiding this comment.
A dependência de um hook está sendo redeclarada em cada render: como o resetContentObject é utilizado como dependência de um hook no CompactMode, o fato dele não ser declarado com useCallback torna o useCallback do CompactMode inútil (nessa situação):
- Solução 1: Declarar o
resetContentObjectcom umuseCallbackao invés de uma função comum. - Solução 2: Remover o
useCallbackdoCompactMode. Não sei qual a necessidade dele. À primeira vista, parece ser apenas para que oButtonnão seja re-renderizado, o que me parece uma otimização desnecessária.
Encontrei que esse hook foi adicionado no commit fix(content component): changes requested in the pull request (PR #344), mas ainda não vi a necessidade dele. Na minha opinião, a solução 2 é a mais adequada. Fico no aguardo do review do Filipe e de outras pessoas 👍
There was a problem hiding this comment.
De fato, a passagem da função para o CompactMode dessa forma vai tornar o useCallback inútil nesse caso.
Também não encontrei nenhum motivo para utilização do hook dentro do CompactMode, já que é um componente extremante simples aonde a unica função dele é renderizar o botão e não vai ter praticamente nenhum impacto se a função handleClick for recriada e ele for re-renderizado.
Também dei uma olhada em todos os lugares aonde o hook useCallback é utilizado e parece que o unico caso aonde ele é desnecessário é esse.
Acho interessante a segunda solução de remover o useCallback do componente CompactMode.
|
Bom trabalho @Rafaelb4rros, me ajudou a perceber que a solução é simplesmente reiniciar o estado do componente que renderiza a resposta. Então propus outra maneira fazer isso, passando uma Está no PR #760. Se puderem testar, está no ar em: https://tabnews-git-comments-bug-tabnews.vercel.app/ Valeu! |
Eu já posso fechar essa PR ou deixo aberta? |
Boa! A Turma aqui é demais! 🤩
Se preferir aguardar para ter certeza de que o #760 está 100%, então é só ficar de olho no repositório e fechar se ele for pra produção. Ou também dá pra fechar e qualquer coisa reabrir 🤝 Falando em fechar e reabrir o PR, eu vou fazer isso agora aqui só para testar se esse procedimento força a rodar os testes, pois aparentemente isso funcionou em um outro PR, mas queria confirmar 😉 |
Aqui não adiantou fechar e reabrir o PR para forçar o CI 🙈 |
|
Trabalho sensacional da comunidade! Estou fechando esse PR em favor do PR #760 e citar os dois PRs na issue que está listada na Milestone 5 🤝 |
Aparentemente o problema era que, quando um novo
conteúdo era criado no componente Content, os estados
componentMode e contentObject eram modificados e nunca voltavam
para o seu estado inicial (recebidos por props), o conteúdo duplicado
se dava quando o usuário trocava de página e voltava, o que acabava mostrando
o conteúdo criado verdadeiro que vinha do backend e o mesmo conteúdo
porém renderizado devido ao estado do Content não resetar.
Eu fiz duas coisas:
A primeira foi resetar o contentMode de volta
ao estado inicial quando o usuario troca de página, isso resolveu
um problema que era o conteudo ficar duplicado.
O segundo problema era que o contentObject
permanecia com os dados anteriores, e quando mudava de página e
voltava, ao clicar no botão responder o input vinha preechido com essas
informações, o que não faz sentido, já que o usuário não estava editando o
conteúdo e sim criando um novo. Para resolver isso, eu criei uma função
que reseta o contentObject e passei ela para o componente CompactMode
que é responsável por renderizar o botão de resposta.