How do you access the object in a JS promise and output it into your HTML in React Native?

I’m trying to get the object from in my code in result.data.name. It should just be a string but isn’t outputting properly. I assume I am grabbing the unfulfilled promise and not the fulfilled promise but am not sure.

I’ve tried to output it by changing the

        
<Text>{project.toString()}</Text>

and it outputs [object Object] which is not exactly what I want.

Error:

Error: Objects are not valid as a React child (found: object with keys {_U, _V, _W, _X}). If you meant to render a collection of children, use an array instead.

Code:

import React from "react";
import styled from "styled-components";

const Patch = require("@patch-technology/patch").default;
const patch = Patch("API_KEY");

const runningTide = "PROJECT_KEY";
export const project = patch.projects
  .retrieveProject(runningTide)
  .then(function (result) {
    return result.data.name;
  })
  .catch((error) => console.log(error));

class PatchModule extends React.Component {
  navigationOptions = { header: { visible: false } };

  render() {
    return (
      <Container>
        <Text>{project}</Text>
        <Text>Testing</Text>
      </Container>
    );
  }
}

export default PatchModule;

const Container = styled.View`
  flex: 1;
  background-color: #ffffff;
  border-radius: 10px;
  justify-content: center;
`;

const Text = styled.Text`
  font-size: 10px;
  color: #19456b;
  font-weight: 600;
  top: 0;
  left: 0;
  margin-top: 30px;
  margin-right: 20px;
  margin-left: 20px;
`;