Skip to content

[Web] v3 typing and using handler data#3651

Merged
akwasniewski merged 75 commits into
nextfrom
@akwasniewski/v3-web-typing
Aug 19, 2025
Merged

[Web] v3 typing and using handler data#3651
akwasniewski merged 75 commits into
nextfrom
@akwasniewski/v3-web-typing

Conversation

@akwasniewski

@akwasniewski akwasniewski commented Aug 1, 2025

Copy link
Copy Markdown
Contributor

Description

Changing web implementation to use v3 types with a proper handlerData field.

Test plan

check whether handledData is a proper field of nativeEvent when using NativeDetector.

  const gesture = useGesture('PanGestureHandler', {
    onBegin: (e: any) => {
      console.log('onGestureHandlerEvent', e.nativeEvent.handlerData);
    },
  });

@akwasniewski akwasniewski marked this pull request as draft August 7, 2025 06:25
Andrzej Antoni Kwaśniewski added 2 commits August 8, 2025 07:47
@akwasniewski akwasniewski force-pushed the @akwasniewski/v3-web-typing branch from 91aad1d to 5837159 Compare August 8, 2025 06:18
Comment thread packages/react-native-gesture-handler/src/web/handlers/GestureHandler.ts Outdated
Base automatically changed from @akwasniewski/native-detector-web to next August 8, 2025 08:57
@akwasniewski akwasniewski marked this pull request as ready for review August 12, 2025 09:53
@akwasniewski akwasniewski requested a review from m-bert August 12, 2025 10:38
Comment thread packages/react-native-gesture-handler/src/web/interfaces.ts Outdated
Comment thread packages/react-native-gesture-handler/src/web/tools/GestureHandlerWebDelegate.ts Outdated
Comment on lines +113 to +116
type ResultEventType = GestureHandlerEvent<unknown> | GestureHandlerNativeEvent;
export interface ResultEvent<T extends ResultEventType = ResultEventType>
extends Record<string, T | number> {
nativeEvent: T;

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Correct me if I'm wrong, but GestureHandlerEvent already has nativeEvent field (look here for context). In that case, we will have event type where it is possible to have nativeEvent.nativeEvent

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Also I find it quite confusing with this default value, wouldn't it be easier to read if we had just ResultEvent<T> and then pass either GestureHandlerEvent, GestureHandlerNativeEvent or TouchEvent?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Correct me if I'm wrong, but GestureHandlerEvent already has nativeEvent

No, types in GestureHandlerEvent are wrappers on payload types defined here, and only add handlerData. Those types do not have nativeEvent field

Also I find it quite confusing with this default value

Ok, it was inspired by this. I thought that it would simplify the code as we would not have to write <unknown> everywhere. I don't have a strong preference, if you think it's better to add <unknown> i can change it.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

if you think it's better to add i can change it.

What do you think I should do? I feel that current solution is stronger typed, what I think is better

this.propsRef!.current;

const touchEvent: ResultTouchEvent | undefined =
const touchEvent: ResultEvent<TouchEvent> | undefined =

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Are you sure that TouchEvent will have correct fields and won't expose something that we do not provide?

@akwasniewski akwasniewski Aug 14, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Yes, gestureTouchEvent defined here, on which TouchEvent is a union has the same fields as the old nativeTouchEvent defined within web/interfaces.

@akwasniewski akwasniewski Aug 14, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Now when I think about it we could probably do the same for GestureHandlerNativeEvent, is there a reason why v2 redeclared those types for the web, when we already have similar types in commons?
EDIT: ok, nevermind they have conflicting type

Comment thread packages/react-native-gesture-handler/src/web/interfaces.ts

@m-bert m-bert left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

LGTM

@akwasniewski akwasniewski merged commit 8b0f128 into next Aug 19, 2025
1 check passed
@akwasniewski akwasniewski deleted the @akwasniewski/v3-web-typing branch August 19, 2025 12:08
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.

2 participants