Issues

1. Too many unstructured useState calls(probably because of #2) https://github.com/cosmostation/web-wallet-renewal/blob/master/src/App.js#L53

https://github.com/cosmostation/web-wallet-renewal/blob/master/src/components/fixedCard/FixedCard.js#L69

Reason(from Dan Abramov) - https://twitter.com/dan_abramov/status/1083330668522864640?lang=en (https://github.com/cosmostation/web-wallet-renewal/blob/master/src/components/delegate/validatorsCard/ValidatorsCard.js#L71)

2. Needs logical file splitting

   • https://github.com/cosmostation/web-wallet-renewal/blob/master/src/App.js needs to be split into multiple files to avoid unnecessary re-rendering

   • 13 renders before FCP(First Contentful Paint)

   • Fetching / render logic need to be split.

   • Duplicate code

     https://github.com/cosmostation/web-wallet-renewal/blob/master/src/components/fixedCard/FixedCard.js#L566

   • Places that normally are split into different components are split mentally by comments https://github.com/cosmostation/web-wallet-renewal/blob/master/src/components/fixedCard/FixedCard.js#L503

   • File splitting but not really https://github.com/cosmostation/web-wallet-renewal/blob/master/src/components/dashboard/Dashboard.js → pretty much all logic is inside FixedCard instead.

3. Using React state to load entire components

   Not recommended since the entire component is reloaded on state change causing performance issues and unexpected state resets

   • https://github.com/cosmostation/web-wallet-renewal/blob/master/src/components/fixedCard/FixedCard.js#L87
   • https://github.com/cosmostation/web-wallet-renewal/blob/239bd11cbbf6ef79d1404d7c56c1b8be722d08e3/src/App.js#L381

4. Responsiveness for smaller screens are not taken into account(probably just not yet or difficult to implement in current structure)

   • image

5. js styles instead of React https://github.com/cosmostation/web-wallet-renewal/blob/master/src/App.js#L383

   • Errors

6. Single css file

   • https://github.com/cosmostation/web-wallet-renewal/blob/master/src/App.css

Things to take into account

• Usage of third party components can be a pain even to seasoned react developers - it restricts the developer from using certain aspects that are convenient for the developer
• Not enough time to study core React concepts and mindsets - a fast-prototyping-focused js-like coding structure is very apparent