Don't nest scrollbars unnecessarily in the UI

[bentveljanzx]

Related ticket

https://temporalsupport.zendesk.com/hc/en-us/requests/9788

TLDR

If rendering a table and it's the last table or thing with its own nested scrollbar, disable that so that it just uses the pages scrollbar instead. Remove the style applied to this kind of div: <div class="paginated-table-wrapper split svelte-1n98w1r" style="max-height: calc(-200px + 100vh);">

This will make scrolling through listings or workflow history a better user experience on desktop/mobile.

Describe the bug

Taken verbatim from the support ticket

For a workflow page, ie, url like: http://localhost:8088/namespaces/default/workflows/GenerateIdWorkflow/2c349f9f-e731-42ea-b519-a3a0aa45a507/history

Is there any plan to make the user interface for the Event History to just use the primary scrollbar rather than nesting because this is very annoying to use since the latest UI changes.

• The graph section is fine being in its own little window IMO
• The bottom section that shows things like "Signal, Signal received, Activity" should not use a nested scrollbar, its the "final" thing on the page and i just want to scroll regularly, not click into the window for it. This kind of thing is especially frustrating to use on tablet or mobile.

How to make my change happen:
Underneath <div data-testid="event-summary-table"> there is the following div <div class="paginated-table-wrapper split svelte-1n98w1r" style="max-height: calc(-200px + 100vh);">
If I remove that hard-coded style that makes the height fixed, then this page gives the behaviour I'd want.

To Reproduce

Steps to reproduce the behavior:

1. Go to a url like:

• http://localhost:8088/namespaces/default/workflows/
  • See the list of workflows, this table should not have its own scrollbar
• http://localhost:8088/namespaces/default/workflows/WORKFLOW_TYPE/2c349f9f-e731-42ea-b519-a3a0aa45a507/history
  • Bottom section with "Signal", "Signal Received"

2. Look at the table. It has a scrollbar.

Expected behavior

The final table view that has a scrollbar on a page should not have a fixed height and remove the style: style="max-height: calc(-200px + 100vh);"

Screenshots

Cannot provide at this time

Desktop (please complete the following information):

• OS: Mac
• Browser: Edge
• Version [e.g. 22]
• Temporal UI version in bottom left corner: Version 2.34.0