I am coding in react native, I am trying to call the function playButton() onPress inside TouchableOpacity, but the function is not showing up on onPress.

What could be the problem?

import { StyleSheet, Text, View, Image, TouchableOpacity,Alert } from 'react-native';

    export default function App () {
    
      const playButton = () => {
        Alert.alert('Hello' );
     }
    
      return (
        <View style={styles.container}>        
         <TouchableOpacity onPress={playButton} >
        <Text style={styles.button}>Play</Text>
        </TouchableOpacity>
        </View>
      );
    }

Below is the package.json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "expo": "~44.0.0",
    "expo-status-bar": "~1.2.0",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-web": "0.17.1",
    "reactotron-react-js": "^3.3.7"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9"
  },
  "private": true
}