PedroBern / react-native-collapsible-tab-view

A cross-platform Collapsible Tab View component for React Native
MIT License
868 stars 171 forks source link

Error in ExampleComponentSharedPullToRefresh.tsx #315

Open yaryarma opened 1 year ago

yaryarma commented 1 year ago

Error message error_screen

code


import React from 'react'
import { ScrollView, RefreshControl, useWindowDimensions } from 'react-native'
import {
  Tabs,
  CollapsibleProps,
  CollapsibleRef,
} from 'react-native-collapsible-tab-view'

import Contacts from './Contacts'
import { HEADER_HEIGHT } from './Header'
import { useRefresh } from './useRefresh'

type Props = Partial<CollapsibleProps>

const ExampleComponent = React.forwardRef<CollapsibleRef, Props>((props, ref) => {
  const windowHeight = useWindowDimensions().height
  const [isRefreshing, startRefreshing] = useRefresh()

  return (
    <ScrollView
      nestedScrollEnabled
      contentContainerStyle={{
        height: windowHeight
      }}
      refreshControl={
        <RefreshControl refreshing={isRefreshing} onRefresh={startRefreshing} />
      }
    >
      <Tabs.Container ref={ref} headerHeight={HEADER_HEIGHT} {...props}>
        <Tabs.Tab name="contact0" label="Tab 0">
          <Contacts nestedScrollEnabled />
        </Tabs.Tab>
        <Tabs.Tab name="contact1" label="Tab 1">
          <Contacts nestedScrollEnabled />
        </Tabs.Tab>
      </Tabs.Container>
    </ScrollView>
  )
})

export default ExampleComponent
const Contacts: React.FC<{
  emptyContacts?: boolean
  nestedScrollEnabled?: boolean
}> = ({ emptyContacts, nestedScrollEnabled }) => {
  const [isRefreshing, startRefreshing] = useRefresh()

  return (
    <Tabs.FlatList
      data={emptyContacts ? [] : CONTACTS}
      keyExtractor={(_, i) => String(i)}
      renderItem={renderItem}
      ItemSeparatorComponent={ItemSeparator}
      ListEmptyComponent={ListEmptyComponent}
      // see https://github.com/software-mansion/react-native-reanimated/issues/1703
      onRefresh={Platform.OS === 'ios' ? startRefreshing : undefined}
      refreshing={Platform.OS === 'ios' ? isRefreshing : undefined}
      nestedScrollEnabled={nestedScrollEnabled}
    />
  )
}

It is working fine but I am getting an error, How to fix this error

MatteoUrso commented 1 year ago

same +1