New querying horizontal UI - continuation

[paolodamico]

Changes

This PR continues work towards #4050 (issue still WIP, but working through bite-sized PRs). This PR handles most UI layout changes.

In addition:

• This PR converts to TS some related insights components.
• Abstracts the card header of the insights container (where you set the interval, date range, ...) into it's own component InsightDisplayConfig.tsx to be able to return different components in the new UI.
• To simplify changes and future maintenance if we either keep this new UI or not, TrendTabHorizontal.tsx is introduced as a high-level component to encompass most changes to the layout.

Checklist

• All querysets/queries filter by Organization, by Team, and by User
• Django backend tests
• Jest frontend tests
• Cypress end-to-end tests
• Migrations are safe to run at scale (e.g. PostHog Cloud) – present proof if not obvious

[paolodamico]

@samwinslow can you help me with a review when you can? wanted to do a checkpoint before the PR becomes too big.

[samwinslow]

Just wondering -- why are some of these flag getters objects, and some others are functions? Should we prefer one approach or the other? (I personally prefer the functions with switch)

[paolodamico]

Hmmm that's a good question, not sure actually (it's code quite old), but I guess that we have the functions for logic that requires checking other variables and just plain constants for when it's just a static definition. Will keep in mind for a refactoring.

[samwinslow]

Nice! It's definitely nice to see TrendTabHorizontal as its own file.

[samwinslow]

Nit- just noticed this. Global filters/ breakdowns column could be full-width on mobile and have extra padding above.

[paolodamico]

Good catch on the mobile-side, I still need to optimize for mobile. Will do that in a subsequent PR.

[paolodamico]

Failing test is unrelated (was failing before), merging.