Theme the lab2 share modal

[molly-moen]

The lab2 share dialog was not using themed variables, and required a different approach to getting the theme value from the lab than other elements on the page. This is because the share dialog is rendered via the header, which is a whole different tree from the rest of the page. Therefore, it does not exist inside the ThemeContext in lab2 labs.

The simplest solution I could find to this problem was, for lab2 labs, to copy the theme value over to the header redux whenever it changes. I did this by setting up a useEffect in ProjectContainer that listens to the theme. The header is controlled entirely by the header redux (which version of the header is visible), so it made sense to put the theme value there. I don't love that we have to duplicate the value to the header redux, if anyone has other ideas let me know! I considered passing the theme in when we set up the header, but that didn't solve for how we respond to theme changes.

Dark mode should be mostly unchanged (there may be a slightly different white text color used to align with dsco). We have a special share modal for Music Lab Jam Session, which is specifically designed for dark mode. I made it readable in light mode but adjust the blue background used since it's unlikely to be seen in light mode.

Before

After

Dark Mode

Light Mode

Links

• Jira: CT-1228

Testing story

Tested locally.

PR Checklist:

• Tests provide adequate coverage
• Privacy and Security impacts have been assessed
• Code is well-commented
• New features are translatable or updates will not break translations
• Relevant documentation has been added or updated
• User impact is well-understood and desirable
• Pull Request is labeled appropriately
• Follow-up work items (including potential tech debt) are tracked and linked