React Native Example Component for User Services

ExampleComponent.tsx

import { React, ReactElement, useState } from 'react'
import { StyleSheet, View } from 'react-native'
import {selectSomeGlobalState} from './somefolder'

// Props described as an interface(always use on objects)
// type keyword is usually used to describe union types, 
// navigation types.
interface Props {
  // required props in the beginning
  children: ReactElement
  // Optionals always at the end
  bool?: boolean
}

// Always use named exports since it makes the debugging easier
// and makes you name your components carefully to avoid nameclash
export const ExampleComponent = ({ children, bool, ...props }: Props) => {
  // first global state
  const globalState = useSelector(selectSomeGlobalState) // or any other state maganager imports
  // then local state
  const [state, setState] = useState<object>({})

  return (
    <View style={styles.someStyle}>
      {
        // Your code here
      }
      <View>{children}</View>
    </View>
  )
}

// write styles which belong to a file inside that file
const styles = StyleSheet.create({
  // use castStyle util for better typing
  someStyle: {
    flex: 1,
    justifyContent: 'center',
  },
})