How to use state in React Native custom component?

I am trying to create a counter app where certain cards either +1 or -1. As each number on the keypad is clicked the counter increments +1 or -1. So far I’ve created a custom component and trying to use state in order to

export default function App() {

  const cards = [
    { card: "A", count: -1 },
    { card: "K", count: -1 },
    { card: "Q", count: -1 },
    { card: "J", count: -1 },
    { card: 10, count: -1 },
    { card: 9, count: 0 },
    { card: 8, count: 0 },
    { card: 7, count: 0 },
    { card: 6, count: 1 },
    { card: 5, count: 1 },
    { card: 4, count: 1 },
    { card: 3, count: 1 },
    { card: 2, count: 1 },
  ];


  const [currentCount, setCount] = useState(0); //Count <<

  return (
    <View style={styles.app}>
      <CardCount useState={currentCount}/> // Custom component <<
      <View style={styles.cards}>
      {cards.map((index) =>(<Card item={index}/>))}
      </View>
    </View>
  );
}

The custom component 

export const CardCount = ({currentCount}) => {
  return (
    <Text>{currentCount}</Text>
  )
}

I am not seeing any results for this? Unless I am using the state wrong

Thanks a lot

>Solution :

your custom component should be like this to show received props

export const CardCount = ({useState}) => {
  return (
    <Text>{useState}</Text>
  )
}