zetkin / app.zetkin.org

Current-generation ("Gen 3") web interface for the Zetkin Platform.
https://app.dev.zetkin.org
23 stars 53 forks source link

Duplicates scroll incorrectly (probably also true for join forms) #2063

Open richardolsson opened 4 months ago

richardolsson commented 4 months ago

Description

The duplicates list scrolls within a container, instead of scrolling the entire page (which is what I think is expected). This also means it's not possible to use home/end buttons on my keyboard.

Steps to reproduce

  1. Go to https://app.dev.zetkin.org/organize/1/people/duplicates
  2. Scroll the list of duplicates

Expected Behaviour

The entire page should scroll

Actual Behaviour

Only the section below the tab bar scrolls, probably because the layout has been hardcoded to use fixedHeight. Using fixed height is the correct behavior for the "Lists" tab, but not for the other tabs.

Screenshots (if you have any)

image

richardolsson commented 4 months ago

I've found that this is actually the case everywhere now. I believe some bug has been introduced to the effects of fixedHeight in TabbedLayout. That's where I would start looking to fix this.

richardolsson commented 4 months ago

I believe I've found this and fixed it using the patch below, but it will require some more investigation to make sure it doesn't break anything else.

diff --git a/src/utils/layout/TabbedLayout.tsx b/src/utils/layout/TabbedLayout.tsx
index 542f287db..926e6727f 100644
--- a/src/utils/layout/TabbedLayout.tsx
+++ b/src/utils/layout/TabbedLayout.tsx
@@ -122,7 +122,7 @@ const TabbedLayout: FunctionComponent<TabbedLayoutProps> = ({
         display="flex"
         flexDirection="column"
         height={fixedHeight ? 1 : 'auto'}
-        minHeight="100vh"
+        minHeight={fixedHeight ? '100vh' : undefined}
       >
         <Header
           actionButtons={actionButtons}