Consider Using React Dashboards

[RyanMarten]

https://dev.to/sm0ke/react-dashboards-open-source-apps-1c7j

We should be looking to use more react components to help build our app out more.

[ribhav99]

Yo this is sick Thanks!

I'll start using this instead of coding from scratch!

[RyanMarten]

Argon looks the nicest:

• Github
• Live Demo
• Docs
• Product Page

[RyanMarten]

If you clone the repo and try to yarn install and yarn start, the website doesn't work: You need to do the fix as described in this stack overflow post: https://stackoverflow.com/questions/60234640/typeerror-err-invalid-arg-type-the-path-argument-must-be-of-type-string-re

Overwrite the existing "react-scripts": "^3.x.x" with"react-scripts": "^3.4.0" in your package.json Delete your node modules Run npm install or yarn install

[RyanMarten]

I have it running locally. Now I will try to add the files to the dreamtune repo under the react_dashboard branch

[RyanMarten]

https://www.tawesoft.co.uk/kb/article/mit-license-faq still have to include the copyright notice

[RyanMarten]

Copied over the files. Had to use a .env file to get the absolute imports to work: https://medium.com/@ktruong008/absolute-imports-with-create-react-app-4338fbca7e3d

[RyanMarten]

use the react_dashboards branch and npm start. You will see the dashboard at localhost:3000/admin

[RyanMarten]

I don't think I can just use Jest anymore. Im going to look at Mocha and enzyme

[RyanMarten]

https://www.robinwieruch.de/react-testing-mocha-chai-enzyme-sinon

[RyanMarten]

Critical here is the shallow render. So it just renders that component, not any children components. Key!

[RyanMarten]

https://medium.com/codeclan/testing-react-with-jest-and-enzyme-20505fec4675

[RyanMarten]

ICONS.JS can be refactored with a simple mapping function (e.z. p.z. --> will become <100 lines of code rather than 3000)

[RyanMarten]

Same deal with Tables.js

[RyanMarten]

Fixing these two files will bring the coverage wayyyyyyyy back up

[RyanMarten]

Returning multiple components in a single render jsx: https://flaviocopes.com/jsx-return-multiple-elements/

The fragment didn't work for me, but the array did

[RyanMarten]

Test coverage is now at 41.42%!!!!! with the refactor!

[RyanMarten]

links: http://localhost:3000/auth/register http://localhost:3000/admin http://localhost:3000/auth/ http://localhost:3000/admin/maps http://localhost:3000/admin/icons http://localhost:3000/admin/tables http://localhost:3000/admin/user-profile