From d25d1e642f65cf332d1c230d3d406d3077a81f94 Mon Sep 17 00:00:00 2001 From: Cody Bennett <23324155+CodyJasonBennett@users.noreply.github.com> Date: Sun, 3 Sep 2023 04:29:25 -0500 Subject: [PATCH] refactor(native): use Pressable for react-native-web --- packages/fiber/src/native/Canvas.tsx | 9 ++++----- packages/fiber/src/native/events.ts | 19 ++++--------------- 2 files changed, 8 insertions(+), 20 deletions(-) diff --git a/packages/fiber/src/native/Canvas.tsx b/packages/fiber/src/native/Canvas.tsx index 8182cf3fd5..600b46e14b 100644 --- a/packages/fiber/src/native/Canvas.tsx +++ b/packages/fiber/src/native/Canvas.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import * as THREE from 'three' -import { View, ViewProps, ViewStyle, LayoutChangeEvent, StyleSheet, PixelRatio } from 'react-native' +import { View, ViewProps, Pressable, ViewStyle, LayoutChangeEvent, StyleSheet, PixelRatio } from 'react-native' import { ExpoWebGLRenderingContext, GLView } from 'expo-gl' import { useContextBridge, FiberProvider } from 'its-fine' import { SetBlock, Block, ErrorBoundary, useMutableCallback } from '../core/utils' @@ -115,8 +115,7 @@ const CanvasImpl = /*#__PURE__*/ React.forwardRef( // Overwrite onCreated to apply RN bindings onCreated: (state: RootState) => { // Bind events after creation - const handlers = state.events.connect?.(viewRef.current) - setBind(handlers) + setBind(state.events.handlers) // Bind render to RN bridge const context = state.gl.getContext() as ExpoWebGLRenderingContext @@ -145,9 +144,9 @@ const CanvasImpl = /*#__PURE__*/ React.forwardRef( }, [canvas]) return ( - + {width > 0 && } - + ) }, ) diff --git a/packages/fiber/src/native/events.ts b/packages/fiber/src/native/events.ts index 19e1f88ddb..b967d0130c 100644 --- a/packages/fiber/src/native/events.ts +++ b/packages/fiber/src/native/events.ts @@ -1,11 +1,7 @@ import { UseBoundStore } from 'zustand' import { RootState } from '../core/store' import { createEvents, DomEvent, EventManager, Events } from '../core/events' -import { GestureResponderEvent } from 'react-native' -/* eslint-disable import/default, import/no-named-as-default, import/no-named-as-default-member */ -// @ts-ignore -import Pressability from 'react-native/Libraries/Pressability/Pressability' -/* eslint-enable import/default, import/no-named-as-default, import/no-named-as-default-member */ +import type { GestureResponderEvent } from 'react-native' const EVENTS = { PRESS: 'onPress', @@ -71,19 +67,12 @@ export function createTouchEvents(store: UseBoundStore): EventManager const { set, events } = store.getState() events.disconnect?.() - const connected = new Pressability(events.handlers) - set((state) => ({ events: { ...state.events, connected } })) - - const handlers = connected.getEventHandlers() - return handlers + set((state) => ({ events: { ...state.events, connected: true } })) }, disconnect: () => { - const { set, events } = store.getState() + const { set } = store.getState() - if (events.connected) { - events.connected.reset() - set((state) => ({ events: { ...state.events, connected: undefined } })) - } + set((state) => ({ events: { ...state.events, connected: false } })) }, } }