show more button for v2 drawer dates

[gumaerc]

What are the relevant tickets?

Closes https://github.com/mitodl/hq/issues/5874

Description (What does it do?)

This PR adds a "show more" link to the start dates section of the info displayed in the v2 learning resource drawer. This expands and collapses the start dates for the course.

Screenshots (if appropriate):

How can this be tested?

• If you have Posthog set up locally, enable the lr_drawer_v2 flag
• If you don't have Posthog set up locally, you can force drawerV2 to be true in LearningResourceDrawer.tsx
• Spin up this branch of mit-learn
• Ensure you have sufficient data backpopulated into your local instance, especially Sloan courses
• Search for a course with identical data but with multiple start dates, like "Artificial Intelligence in Pharma and Biotech" for example
• Confirm that you can click "Show more" to expand the rest of the start dates, that the link text changes to "Show less" after it expands, and that you can click "Show less" to collapse back down
• Search for a course with different data and multiple start dates, such as "Leading the AI-Driven Organization"
• Confirm that all of the start dates are shown without the show more button

[jonkafton]

A couple of questions that may or may not lead to changes - looks good.

[gumaerc]

@jonkafton This is ready for another look. I also noticed another issue with the CTA image and couldn't help myself but to fix it. Remember how you discovered that issue where it was floating above the sticky header when scrolling, and I put in a fix to move it below with z-index: -1? Well, that's still necessary, but I noticed that although the issue had been fixed visually I was unable to click the X to close the drawer when the image was sitting under it, because the NextImage is position: absolute by default. The existing code was scaling the image using the aspect property by calculating a padding offset. Since aspect-ratio is usable in all browsers, I fixed it by applying this style to NextImage:

const Image = styled(NextImage)<{ aspect: number }>`
  position: relative !important;
  border-radius: 8px;
  width: 100%;
  aspect-ratio: ${({ aspect }) => aspect};
  object-fit: cover;
  z-index: -1;
`

[jonkafton]

Since aspect-ratio is usable in all browsers, I fixed it by applying this style to NextImage

Better, plus we use elsewhere. The % padding does feel like a trick.