Unexpected token, expected "}" error but can't be figured out – React native

Please find below corrected code:

    import React, { useState, useEffect } from 'react'
    import {
        Text,
        View,
        StyleSheet,
        TextInput,
        TouchableOpacity,
        SafeAreaView,
        FlatList,
        ActivityIndicator
    } from 'react-native'
    
    
    const HomeScreen = () => {
        const [recipes, setRecipes] = useState();
        const [searchQuery, setSearchQuery] = useState('');
        const [numberOfRecipes, setNumberOfRecipes] = useState('');
        const [loading, setLoading] = useState(false);
        const apiId = '30f0071b'
        const apiKey = '23e828ea96641c06655aa2f585757d1d'
        const apiUrl = `https://api.edamam.com/searh?q=${searchQuery}&app_id=${apiId}&app_key=${apiKey}&from=0&to=${numberOfRecipes}&calories=591-722&health=alcohol-free`;
    
        async function apiCall() {
            setLoading(true);
            let resp = await fetch(apiUrl);
            let respJson = await resp.json();
            setRecipes(respJson.hits);
            setLoading(false);
            Keyboard.dismiss();
            setSearchQuery('');
        }
    
    
        useEffect(() => {
            setLoading(true);
            apiCall()
        });
    
    
        return (
            <View style={styles.container}>
    
                <Text style={{ fontSize: 18, fontWeight: 'bold', color: '#008080' }}>
                    What Recipe Would You Like to Search?
                </Text>
    
                <View sytle={{ display: 'flex', flexDirection: 'row' }}>
                    <TextInput placeholder='Search Recipe...'
                        style={styles.inputField}
                        onChangeText={text => setSearchQuery(text)}
                    />
    
    
                    <TextInput
                        style={[styles.inputField, { width: '20%', paddingLeft: 20, paddingRight: 20, fontSize: 18, marginLeft: 10, color: '#008080', fontWeight: 'bold' }]}
    
                        value={numberOfRecipes}
                        keyboardType='number-pad'
                        onChangeText={text => setNumberOfRecipes(text)}
                    />
    
                    <TouchableOpacity style={styles.button}
                        onPress={apiCall}
                        title='submit'>
    
                        <Text style={styles.buttonText}>Search</Text>
                    </TouchableOpacity>
                    <SafeAreaView style={{ flex: 1 }}>
                        {loading ? <ActivityIndicator size='large' color='#008080' /> :
                            <FlatList
                                style={styles.recipes}
                                data={recipes}
                                renderItem={({ item }) => (
                                    <View style={styles.recipe}>
                                        <Image style={styles.image}
                                            source={{ url: `${item.recipe.image}` }}
                                        />
                                        <View style={{ padding: 20, flexDirection: 'row' }}>
                                            <Text style={styles.label}>{item.recipe.label}</Text>
                                            <TouchableOpacity onPress={() => { }}>
    
    
    
                                                <Text style={{ marginLeft: 50, fontSize: 20, color: '#008080' }}>
                                                    Details
                                                </Text>
                                            </TouchableOpacity>
                                        </View>
                                    </View>
                                )}
    
                                keyExtractor={(item, index) => index.toString()} />
                        }
                    </SafeAreaView>
    
    
                </View>
            </View>
        )
    }
    
    const styles = StyleSheet.create({
        container: {
            flex: 1,
            justifyContent: 'center',
            alignItems: 'center',
            padding: 10,
    
        },
        inputField: {
            backgroundColor: 'white',
            borderRadius: 20,
            marginTop: 10,
            paddingLeft: 15,
        },
        buttons: {
            flexDirection: 'row'
        },
        button: {
            backgroundColor: '#008080',
            width: '90%',
            alignItems: 'center',
            margin: 15,
            height: 45,
            borderRadius: 15,
            justifyContent: 'center',
            marginTop: 25,
            paddingLeft: 20,
            paddingRight: 20
    
        },
        buttonText: {
            color: 'white'
        }
    })
    export default HomeScreen