Refactor frontend components/utilities

Background

The frontend codebase currently contains some areas that could benefit from a bit of cleanup and refactoring to improve maintainability and readability. There are some anonymous React components, making debugging and performance profiling more difficult. Some function logic could be extracted into a utilities file, and there are some errors in the console that should be addressed.

To do:

• Replace all anonymous components or non-react components using .jsx with .js files or refactor so that the file becomes a React component
• Resolve any easy-to-resolve console errors and create bug tickets for the others
• Refactor reused functions into a utilities file