Check the render method of `Button`

[DataX]

I am stuck with this every time I enable this line it crashes for just this button. Any ideas? Thanks in advance!

[DataX]

function Button({ title }) {
    return (
        <TouchaleOpacity style={styles.button}>
            <View>
                <Text style={styles.text}>{title}</Text>
            </View>
        </TouchaleOpacity>
    );
}

const styles = StyleSheet.create({
    button: {
        backgroundColor: colors.primary,
        borderRadius: 25,
        justifyContent: "center",
        alignItems: "center",
        padding: 15,
        marginVertical: 10,
    },
    text: {
        color: colors.white,
        fontSize: 18,
    },
})

[DataX]

function LoginScreen(props) {
    const [email, setEmail] = useState();
    const [password, setPassword] = useState();

    return (
        <Screen>
            <Image
                style={styles.logo}
                source={require("../assets/logo-red.png")} />
            <AppTextInput
                autoCapitalize="none"
                autoCorrect={false}
                icon="email"
                keyboardType="email-address"
                name="email"
                placeholder="Email                                                                     "
                // iOS only feature from keychain
                textContentType="emailAddress"
            />
            <AppTextInput
                autoCapitalize="none"
                autoCorrect={false}
                icon="lock"
                name="password"
                placeholder="Password                                                                  "
                secureTextEntry
                textContentType="password"
            />
            {/* <SubmitButton title="Login" /> */}
            {/* <Button title="Login"></Button> */}
        </Screen>
    );
}

const styles = StyleSheet.create({
    container: {
        padding: 10,
    },
    logo: {
        width: 80,
        height: 80,
        alignSelf: "center",
        marginTop: 50,
        marginBottom: 20,
    },
})
export default LoginScreen;

[DataX]

<Button title="Login"></Button>

Every time I insert/enable this line it crashes.

[DataX]

[DataX]

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports.

Check the render method of Button.

[eelsholz]

Do you need to export your Button function?

export default Button;

[DataX]

TouchaleOpacity misspelled! OMG