How to wait for firebase data fetch finishes and get values not a promise in react-native?

I have data in firebase data that looks like the following:

The code for getting customers data:

getCustomersOnQeueu = async () => {
        let customers = this.customersRef.orderByChild("ticket").once('value')
        return customers
      }

Code for rendering data:

renderCustomers = () => {
        let customersViews = []
         this.getCustomersOnQeueu().then((customers) => {
           let customersTickets = customers.val()
           console.log(customersTickets)
           let sortedKeys = Object.keys(customersTickets).sort(function(a, b){
             return customersTickets[b].ticket - customersTickets[a].ticket
           })
           console.log(sortedKeys)
           for(i=0; i<sortedKeys.length; i++) {
             let key = sortedKeys[i]
             console.log(customersTickets[key]["customer"])
             customersViews.push(<View>
               <Text>{customersTickets[key["customer"]}</Text>
             </View>)
           }
         })
       return (<View>
         <Text>Available Customers: </Text>
         {customersViews}
         </View>)
      }

  render() {
   return (
    <View>
       {this.renderCustomers()}
    </View>
)
}

Now after data being fetched and sorted I can see the following in console:

I have a problem that this line of code is never executed:

customersViews.push(<View>
               <Text>{customersTickets[key["customer"]}</Text>
             </View>)

I am guessing that it might be because customersViews array is initialized after rendering is done and not before, how can I wait for data fetching and sorting to finish then render the data?