Connections Page Rough Design

[Tyler-Lentz]

first part of #86

This PR includes the basic design layout of the connections page with some mock values for display purposes.

Make sure to run the application through docker and not the local react dev server because that is how it will be run during test flights and competition.

Changes:

1. basic design layout of the connection page and its 3 subpages.
2. slightly modified the linter config to allow you to use unused variables if they are prefixed with an underscore
3. removed the /camera route as its functionality will be completely covered by the obc connection page
4. new npm packages:
   • react-modal for modal dialogue boxes
   • react-image-gallery for a nice image gallery
   • react-leaflet for maps
   • react-tooltip for hover tool tips. (Didn't end up using this, but probably will in the future so I didn't bother removing it.)
5. TuasMap wrapper class around Leaflet. This lets us keep the same look of map throughout all of our maps without having to copy code. To insert extra functionality into the map you can insert custom components as children to the TuasMap. See the Input page's PR for an example of this if you are curious (e.g. the <MapIllustrator /> and <MapClickHandler /> components)

Three kinds of feedbacks would be greatly apprecated:

1. Run in your web browser with your screen size and see if anything seems weird.
2. Any unclear / uncommented code that you think should have an explanation.
3. Anything you think might make sense to do/structure differently

[atar13]

Looks very good. UI scales well on all the connection pages regardless of the window size.

Love the terminal on the antenna tracker page and the full screen on the image viewer is a great idea.

Mainly had two issues I ran into:

• The back button doesn't work on the radiomavlink page once you're logged into influxdb. It seems like the iframe is handling the back button events. This isn't the biggest deal in the world since you can just hit the connections tab on the navbar.
• The background color changing color animations don't work on Firefox (where the background changes to red/green when you hover over each connection). Works fine on Chromium and Webkit.

[atar13]

Also my influxdb container was crashing until I updated it to v2.7 in the docker compose. Not sure if anyone else is running into this issue or if it's just me.

[Tyler-Lentz]

Looks very good. UI scales well on all the connection pages regardless of the window size.

Love the terminal on the antenna tracker page and the full screen on the image viewer is a great idea.

Mainly had two issues I ran into:

• The back button doesn't work on the radiomavlink page once you're logged into influxdb. It seems like the iframe is handling the back button events. This isn't the biggest deal in the world since you can just hit the connections tab on the navbar.
• The background color changing color animations don't work on Firefox (where the background changes to red/green when you hover over each connection). Works fine on Chromium and Webkit.

For future reference,

1. Not sure if it's easy to mess with iframes this way, so just going to leave it since the navbar should work okay.
2. Firefox seems to just not support the has selector currently, which seems like it is the problem. Hopefully future versions of firefox will support it. (As of 119 it does not)