Fix console warnings

[ChaseC99]

The console is logging warnings for lots of different things

• [x] AppStore invalid action type
• [x] RightPane invalid action type
• [x] Function components cannot be given refs
• [x] Each child in a list should have a unique "key" prop.
• [x] Material-UI: theme.spacing.unit usage has been deprecated.
• [x] /SectionTableBody.js Line 340:8: React Hook useEffect has missing dependencies:

[ChaseC99]

@falsidge I think you fixed some of these in #197. Feel free to open a new PR with those changes and reference this issue. I'll tackle the rest of the warnings.

[EricPedley]

One note on the materialUI spacing warning is that the stack trace sucks so I just had to comment out stuff until it disappeared to search for the issue. It turns out in the notification snackbar we were doing theme.spacing instead of theme.spacing(MULTIPLIER). where MULTIPLIER is how many times the default spacing you want, and defaults to 1. Just noting this so if we get future warnings about MUI spacing we know what to look for.

[EricPedley]

@ChaseC99 Seems like the AppStore and RightPane invalid action type warnings are because they're using the same dispatcher, so any payload sent to the dispatcher is passed to the callbacks of both stores. I'm thinking of two fixes:

• Use two dispatchers, one for each store. The sets of actions for each store are disjoint so we wouldn't be missing anything by doing this.
• The warning should be on a new case undefined or when the action type doesn't appear on a global list of valid action types across both stores.

lmk what u think Also, fixing this would close #163

[EricPedley]

Clue for the functional component ref warnings: they only seem to be showing up under these conditions

1. When the window is small enough to compress settings/notifications/feedback ... etc into a hamburger menu (1 warning in the console)
2. When it gets even smaller and the download/screenshot/add custom buttons get compressed into a hamburger menu (2 warnings in the console)

So it might have something to do with the hamburger menu code. Edit: fixed at https://github.com/icssc-projects/AntAlmanac/commit/bd80dd085e4f502292b4e1002fdc8fa398f375ab

[EricPedley]

Found another warning. Seems like the problem is in News.js edit: fixed at https://github.com/icssc-projects/AntAlmanac/commit/f7091e00d256bcebb3641398df59462b884de9f2

[ChaseC99]

Seems like the AppStore and RightPane invalid action type warnings are because they're using the same dispatcher

Tbh I'm not too familiar with best practices for dispatchers. For simplicity's sake, my instinct is that we shouldn't have more than one. Idk why we have both AppStore and RightPaneStore separately. I wonder if we can consolidate/refactor.

I'll defer to your judgement on this one. We can also ask @Nathan A in Discord to see why it was done like this originally.

[EricPedley]

I just kept all the stores/dispatchers code the same and removed the console logs for the warnings. It's expected behavior in Flux for each store to receive all the actions from the dispatcher, even ones they don't need / can't handle (source). I was thinking about writing some code to make sure at least one listener fires for every action dispatched, but I think it's unnecessary since we only have two stores.