Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow profile header to overscroll #5457

Merged
merged 4 commits into from
Sep 25, 2024
Merged

Allow profile header to overscroll #5457

merged 4 commits into from
Sep 25, 2024

Conversation

mozzius
Copy link
Member

@mozzius mozzius commented Sep 23, 2024

This extracts the simple parts out of #2171

Adds allowHeaderOverScroll prop to PagerWithHeader so that the profile header can scroll with the rest of the page

iOS only. does nothing on other platforms.

Simulator.Screen.Recording.-.iPhone.16.-.2024-09-23.at.22.02.29.mp4

Test plan

Make sure android behaves the same, and make sure other list screens on iOS are unchanged (i.e. the PTR spinner is still visible)

@arcalinea arcalinea temporarily deployed to samuel/allow-overscroll - social-app PR #5457 September 23, 2024 21:04 — with Render Destroyed
Copy link

github-actions bot commented Sep 23, 2024

Old size New size Diff
10.37 MB 10.37 MB 6 B (0.00%)

Comment on lines -232 to +249
const headerTransform = useAnimatedStyle(() => ({
transform: [
{
translateY: Math.min(Math.min(scrollY.value, headerOnlyHeight) * -1, 0),
},
],
}))
const headerTransform = useAnimatedStyle(() => {
const translateY = Math.min(scrollY.value, headerOnlyHeight) * -1
return {
transform: [
{
translateY: allowHeaderOverScroll
? translateY
: Math.min(translateY, 0),
},
],
}
})
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is where the action happens, the rest is just prop drilling

@@ -82,6 +83,7 @@ export const ProfileFeedSection = React.forwardRef<
onScrolledDownChange={setIsScrolledDown}
renderEmptyState={renderPostsEmpty}
headerOffset={headerHeight}
progressViewOffset={ios(0)}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this makes sure the spinner is at the top of the page, where it should be

Copy link
Collaborator

@gaearon gaearon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

code seems ok to me but maybe let's not enable this yet (i.e. not set prop to true) until we get in the blurred stuff in as well? the behavior in this PR feels a bit weird to me.

or do you think this is decent as is? i guess it better handles profiles with tall bios than main?

@mozzius
Copy link
Member Author

mozzius commented Sep 24, 2024

I can easily feature flag it?
Edit: actually no, not so easy. I'll stack the blur stuff on top of it

@mozzius mozzius force-pushed the samuel/allow-overscroll branch from e5abcd0 to bdc0a73 Compare September 24, 2024 18:02
@arcalinea arcalinea temporarily deployed to samuel/allow-overscroll - social-app PR #5457 September 24, 2024 18:02 — with Render Destroyed
Copy link
Collaborator

@gaearon gaearon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

@mozzius mozzius merged commit bd393b1 into main Sep 25, 2024
6 checks passed
@mozzius mozzius deleted the samuel/allow-overscroll branch September 25, 2024 13:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants