search

Engenharia-de-Software-UFRPE / lanterna-verde

Lanterna verde é um sistema de avaliação do nível de práticas de greenwashing de uma organização ou produto.
2 stars 5 forks source link

Tela de Administrador apresenta erros quando há Solicitações de Análise #71

Closed SteffanoP closed 2 years ago

SteffanoP commented 2 years ago

Olá pessoal, estava fazendo alguns testes e parei para notar que há algum problema com a implementação atual da Tela de Administrador. Em específico isso acontece quando há uma Solicitação de Análise de uma Empresa em aguardo para revisão, e a tela aparece por um instante, mas depois fica tudo branco.

O log do problema é apresentado abaixo:

react-jsx-dev-runtime.development.js:87 Warning: Each child in a list should have a unique "key" prop.

Check the render method of `SolAnaliseMap`. See https://reactjs.org/link/warning-keys for more information.
    at SolAnalise (http://localhost:3000/static/js/bundle.js:1783:5)
    at SolAnaliseMap (http://localhost:3000/static/js/bundle.js:1879:5)
    at tbody
    at table
    at div
    at div
    at div
    at Tableadmin (http://localhost:3000/static/js/bundle.js:1644:91)
    at div
    at div
    at ContainerAdm (http://localhost:3000/static/js/bundle.js:806:78)
    at Administrador
    at RenderedRoute (http://localhost:3000/static/js/bundle.js:61475:5)
    at Routes (http://localhost:3000/static/js/bundle.js:61924:5)
    at App (http://localhost:3000/static/js/bundle.js:62:82)
    at Router (http://localhost:3000/static/js/bundle.js:61855:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:60076:5)
printWarning @ react-jsx-dev-runtime.development.js:87
react-dom.development.js:86 Warning: validateDOMNesting(...): <li> cannot appear as a child of <tbody>.
    at li
    at http://localhost:3000/static/js/bundle.js:27829:5
    at SolAnalise (http://localhost:3000/static/js/bundle.js:1783:5)
    at SolAnaliseMap (http://localhost:3000/static/js/bundle.js:1879:5)
    at tbody
    at table
    at div
    at div
    at div
    at Tableadmin (http://localhost:3000/static/js/bundle.js:1644:91)
    at div
    at div
    at ContainerAdm (http://localhost:3000/static/js/bundle.js:806:78)
    at Administrador
    at RenderedRoute (http://localhost:3000/static/js/bundle.js:61475:5)
    at Routes (http://localhost:3000/static/js/bundle.js:61924:5)
    at App (http://localhost:3000/static/js/bundle.js:62:82)
    at Router (http://localhost:3000/static/js/bundle.js:61855:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:60076:5)
printWarning @ react-dom.development.js:86
ContainerAdm.js:35 Array(23)
ResquestTable.js:24 Array(1)
ResquestTable.js:24 Array(1)
react-dom.development.js:14887 Uncaught Error: Objects are not valid as a React child (found: object with keys {id, tradeName, corporateName, stateRegistration, cnpj, tipo, contactName, phoneNumber, user}). If you meant to render a collection of children, use an array instead.
    at throwOnInvalidObjectType (react-dom.development.js:14887:1)
    at createChild (react-dom.development.js:15139:1)
    at reconcileChildrenArray (react-dom.development.js:15404:1)
    at reconcileChildFibers (react-dom.development.js:15821:1)
    at reconcileChildren (react-dom.development.js:19174:1)
    at updateHostComponent (react-dom.development.js:19924:1)
    at beginWork (react-dom.development.js:21618:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
    at invokeGuardedCallback (react-dom.development.js:4277:1)
react-dom.development.js:18687 The above error occurred in the <div> component:

    at div
    at div
    at li
    at http://localhost:3000/static/js/bundle.js:27829:5
    at SolAnalise (http://localhost:3000/static/js/bundle.js:1783:5)
    at SolAnaliseMap (http://localhost:3000/static/js/bundle.js:1879:5)
    at tbody
    at table
    at div
    at div
    at div
    at Tableadmin (http://localhost:3000/static/js/bundle.js:1644:91)
    at div
    at div
    at ContainerAdm (http://localhost:3000/static/js/bundle.js:806:78)
    at Administrador
    at RenderedRoute (http://localhost:3000/static/js/bundle.js:61475:5)
    at Routes (http://localhost:3000/static/js/bundle.js:61924:5)
    at App (http://localhost:3000/static/js/bundle.js:62:82)
    at Router (http://localhost:3000/static/js/bundle.js:61855:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:60076:5)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
logCapturedError @ react-dom.development.js:18687
react-dom.development.js:14887 Uncaught (in promise) Error: Objects are not valid as a React child (found: object with keys {id, tradeName, corporateName, stateRegistration, cnpj, tipo, contactName, phoneNumber, user}). If you meant to render a collection of children, use an array instead.
    at throwOnInvalidObjectType (react-dom.development.js:14887:1)
    at createChild (react-dom.development.js:15139:1)
    at reconcileChildrenArray (react-dom.development.js:15404:1)
    at reconcileChildFibers (react-dom.development.js:15821:1)
    at reconcileChildren (react-dom.development.js:19174:1)
    at updateHostComponent (react-dom.development.js:19924:1)
    at beginWork (react-dom.development.js:21618:1)
    at beginWork$1 (react-dom.development.js:27426:1)
    at performUnitOfWork (react-dom.development.js:26557:1)
    at workLoopSync (react-dom.development.js:26466:1)
ContainerAdm.js:47 Object
ContainerAdm.js:47 Object
ContainerAdm.js:47 Object
ContainerAdm.js:47 Object
SteffanoP commented 2 years ago

Esse problema muito provavelmente foi introduzido em #58.

Koda-ms commented 2 years ago

Olá pessoal, estava fazendo alguns testes e parei para notar que há algum problema com a implementação atual da Tela de Administrador. Em específico isso acontece quando há uma Solicitação de Análise de uma Empresa em aguardo para revisão, e a tela aparece por um instante, mas depois fica tudo branco.

O log do problema é apresentado abaixo:

react-jsx-dev-runtime.development.js:87 Warning: Each child in a list should have a unique "key" prop.

Check the render method of `SolAnaliseMap`. See https://reactjs.org/link/warning-keys for more information.
    at SolAnalise (http://localhost:3000/static/js/bundle.js:1783:5)
    at SolAnaliseMap (http://localhost:3000/static/js/bundle.js:1879:5)
    at tbody
    at table
    at div
    at div
    at div
    at Tableadmin (http://localhost:3000/static/js/bundle.js:1644:91)
    at div
    at div
    at ContainerAdm (http://localhost:3000/static/js/bundle.js:806:78)
    at Administrador
    at RenderedRoute (http://localhost:3000/static/js/bundle.js:61475:5)
    at Routes (http://localhost:3000/static/js/bundle.js:61924:5)
    at App (http://localhost:3000/static/js/bundle.js:62:82)
    at Router (http://localhost:3000/static/js/bundle.js:61855:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:60076:5)
printWarning @ react-jsx-dev-runtime.development.js:87
react-dom.development.js:86 Warning: validateDOMNesting(...): <li> cannot appear as a child of <tbody>.
    at li
    at http://localhost:3000/static/js/bundle.js:27829:5
    at SolAnalise (http://localhost:3000/static/js/bundle.js:1783:5)
    at SolAnaliseMap (http://localhost:3000/static/js/bundle.js:1879:5)
    at tbody
    at table
    at div
    at div
    at div
    at Tableadmin (http://localhost:3000/static/js/bundle.js:1644:91)
    at div
    at div
    at ContainerAdm (http://localhost:3000/static/js/bundle.js:806:78)
    at Administrador
    at RenderedRoute (http://localhost:3000/static/js/bundle.js:61475:5)
    at Routes (http://localhost:3000/static/js/bundle.js:61924:5)
    at App (http://localhost:3000/static/js/bundle.js:62:82)
    at Router (http://localhost:3000/static/js/bundle.js:61855:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:60076:5)
printWarning @ react-dom.development.js:86
ContainerAdm.js:35 Array(23)
ResquestTable.js:24 Array(1)
ResquestTable.js:24 Array(1)
react-dom.development.js:14887 Uncaught Error: Objects are not valid as a React child (found: object with keys {id, tradeName, corporateName, stateRegistration, cnpj, tipo, contactName, phoneNumber, user}). If you meant to render a collection of children, use an array instead.
    at throwOnInvalidObjectType (react-dom.development.js:14887:1)
    at createChild (react-dom.development.js:15139:1)
    at reconcileChildrenArray (react-dom.development.js:15404:1)
    at reconcileChildFibers (react-dom.development.js:15821:1)
    at reconcileChildren (react-dom.development.js:19174:1)
    at updateHostComponent (react-dom.development.js:19924:1)
    at beginWork (react-dom.development.js:21618:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
    at invokeGuardedCallback (react-dom.development.js:4277:1)
react-dom.development.js:18687 The above error occurred in the <div> component:

    at div
    at div
    at li
    at http://localhost:3000/static/js/bundle.js:27829:5
    at SolAnalise (http://localhost:3000/static/js/bundle.js:1783:5)
    at SolAnaliseMap (http://localhost:3000/static/js/bundle.js:1879:5)
    at tbody
    at table
    at div
    at div
    at div
    at Tableadmin (http://localhost:3000/static/js/bundle.js:1644:91)
    at div
    at div
    at ContainerAdm (http://localhost:3000/static/js/bundle.js:806:78)
    at Administrador
    at RenderedRoute (http://localhost:3000/static/js/bundle.js:61475:5)
    at Routes (http://localhost:3000/static/js/bundle.js:61924:5)
    at App (http://localhost:3000/static/js/bundle.js:62:82)
    at Router (http://localhost:3000/static/js/bundle.js:61855:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:60076:5)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
logCapturedError @ react-dom.development.js:18687
react-dom.development.js:14887 Uncaught (in promise) Error: Objects are not valid as a React child (found: object with keys {id, tradeName, corporateName, stateRegistration, cnpj, tipo, contactName, phoneNumber, user}). If you meant to render a collection of children, use an array instead.
    at throwOnInvalidObjectType (react-dom.development.js:14887:1)
    at createChild (react-dom.development.js:15139:1)
    at reconcileChildrenArray (react-dom.development.js:15404:1)
    at reconcileChildFibers (react-dom.development.js:15821:1)
    at reconcileChildren (react-dom.development.js:19174:1)
    at updateHostComponent (react-dom.development.js:19924:1)
    at beginWork (react-dom.development.js:21618:1)
    at beginWork$1 (react-dom.development.js:27426:1)
    at performUnitOfWork (react-dom.development.js:26557:1)
    at workLoopSync (react-dom.development.js:26466:1)
ContainerAdm.js:47 Object
ContainerAdm.js:47 Object
ContainerAdm.js:47 Object
ContainerAdm.js:47 Object

Oi, Steffano! Estamos ciente desse bug há um tempo, porém ainda não tivemos sucesso na solução.

A questão é que o erro acontece exatamente nessa linha de código [https://github.com/Engenharia-de-Software-UFRPE/lanterna-verde/blob/bb93818c65882ff345c600a1bf30f85e2f0f4070/Frontend/src/components/AdminScreen/SolAnalise.js#L13]() .

Caso você altere para solicita_a_analise.id tudo volta ao normal e é possível ver e rever as solicitações. Mas, claro, não é isso que queremos e, sim, o nome da própria empresa que está solicitando. Porém já tentamos fazer solicita_a_analise.empresa.tradeName ou qualquer outro atributo da empresa, mas não funciona.

Bom, estamos trabalhando nisso ainda.

SteffanoP commented 2 years ago

@Koda-ms Qual seria a branch que vocês estão trabalhando?

Koda-ms commented 2 years ago

@Koda-ms Qual seria a branch que vocês estão trabalhando?

@FedraB e @Joaovcarvalho23 estão trabalhando na joyces/front/HistoricoAnalise, eu, na joyces/front/Notificacao, pois estou resolvendo uma questão diferente. Mas você pode olhar qualquer uma.