Componente Botão

Em Botão.js

import React from "react";
import { StyleSheet, TouchableOpacity } from "react-native";

import Texto from './Texto';

export default function Botão({ children, style }) {
    function onPress() {
        console.log("Clicked");
    }

    return (
        <>
            <TouchableOpacity style={[style, styles.button]} onPress={() => { onPress }}>
                <Texto style={styles.textButton}>{children}</Texto>
            </TouchableOpacity>
        </>
    )
}

const styles = StyleSheet.create({
    button: {
        backgroundColor: "#2a9f85",
        paddingVertical: 16,
        borderRadius: 8,
    },
    textButton: {
        textAlign: "center",
        color: "#fff",
        fontWeight: "bold",
        fontSize: 16
    }
})

Em Detalhes.js

import React from "react";
import { View, StyleSheet, Image } from "react-native";

import Texto from '../../../componentes/Texto'; // Importe do componente Texto onde ira colocar as fontes
import Botão from '../../../componentes/Botão';

export default function Detalhes({ nome, logoFazenda, nomeFazenda, descricao, preco, botao }) {
    return (
        <>
            <Texto style={styles.nome}>{nome}</Texto>

            <View style={styles.fazenda}>
                <Image source={logoFazenda} style={styles.imagemFazenda} />
                <Texto style={styles.nomeFazenda}>{nomeFazenda}</Texto>
            </View>

            <Texto style={styles.descricao}>{descricao}</Texto>
            <Texto style={styles.preco}>{preco}</Texto>

            <Botão style={styles.button}>{botao}</Botão>
        </>
    )
}

const styles = StyleSheet.create({
    nome: {
        color: "#464646",
        fontSize: 26,
        fontWeight: "bold"
    },
    fazenda: {
        flexDirection: "row",
        paddingVertical: 12
    },
    imagemFazenda: {
        width: 32,
        height: 32
    },
    nomeFazenda: {
        fontSize: 18,
        marginLeft: 12,
    },
    descricao: {
        color: "#a3a3a3",
        fontSize: 18
    },
    preco: {
        color: "#2a9f85",
        fontWeight: "bold",
        fontSize: 26,
        marginTop: 8
    },
    button: {
        marginTop: 16,
    },
})