If you know what Context hook is in react, then you're already a step ahead. If not, read a bit about it.
We currently have a context called GroupContext. Within that context, add a new state, a string, that will hold the subGroup name ("general", "room1", "room2", etc).
Add functionality to switch in between sub groups.
a. In SubGroupSelector.js, when a sub group is clicked, update the state to the name of that sub group.
b. In MessageArea.js you would need to bring that new state in, and display what you need to display by the groupSelected state and now your new subGroupSelected state.