Expo-AV wait until audio finished playing

I've been trying to fix this for over a week now and I just can't solve it.

I want to be able to map through an array of data that has a link for an audio file, and play each audio after another. The way I have it in my code now just plays all audios at once, so it doesn't wait until one is finished.

I know there are a couple ways you can wait until it finished playing, I just can't figure out how to use it. :/

Some help or a solution would be SUPER appreciated.

This is my code:

import {
  View,
  Text,
  StyleSheet,
  TouchableOpacity,
  Image,
  ScrollView,
} from 'react-native';
import React, { useState, useEffect } from 'react';
import { Audio } from 'expo-av';
import Sura from '../components/sura';
import Data from '../data/data';
import englishTranslation from '../data/english';

const bookPage = (props) => {
  const [listView, setListView] = useState(true);
  const [ayahData, setAyahData] = useState([]);
  const [sound, setSound] = useState(null);
  const [number, setNumber] = useState(null);

  useEffect(() => {
    return sound
      ? () => {
          sound.unloadAsync();
        }
      : undefined;
  }, [sound]);

  async function playSound(soundURL) {
    const { sound } = await Audio.Sound.createAsync({
      uri: soundURL,
    });
    setSound(sound);

    await sound.playAsync();
  }

  return (
    <View style={styles.background}>
      <View
        style={{ flex: 0.47, justifyContent: 'center', alignItems: 'center' }}
      >
        <Image style={styles.image} source={require('../public/read.png')} />
        <TouchableOpacity
          onPress={() => {
            props.modal(false);
          }}
          style={styles.goBackTouchable}
        >
          <Image
            style={styles.goBackView}
            source={require('../public/incorrect-button-compressed.png')}
          />
        </TouchableOpacity>
      </View>
      <View style={{ flex: 0.55 }}>
        <ScrollView
          style={styles.list}
          showsVerticalScrollIndicator={false}
          showsHorizontalScrollIndicator={false}
        >
          {listView
            ? Data.data.surahs.map((el, i) => {
                return (
                  <Sura
                    setAyahData={setAyahData}
                    listView={setListView}
                    ayahs={el.ayahs}
                    setNumber={setNumber}
                    number={el.number}
                    title={`${el.number}.  ${el.englishName}`}
                    arabic={`${el.name}`}
                    key={i}
                  />
                );
              })
            : ayahData[0].map((el, i) => {
                return (
                  <TouchableOpacity
                    onPress={() => {
                      playSound(el.audio);
                    }}
                    key={i}
                    style={styles.ayahText}
                  >
                    <View>
                      <Text>
                        <Text style={styles.number}>{el.number}</Text>
                        {'\n'}
                        <Text style={styles.arabic}>{el.text}</Text>
                      </Text>
                    </View>
                    <View>
                      <Text style={styles.english}>
                        {
                          englishTranslation.data.surahs[number - 1].ayahs[i]
                            .text
                        }
                      </Text>
                    </View>
                  </TouchableOpacity>
                );
              })}
        </ScrollView>
      </View>
    </View>
  );
};

export default bookPage;

const styles = StyleSheet.create({
  background: {
    flex: 1,
    position: 'relative',
    backgroundColor: '#3f1f7e',
    justifyContent: 'center',
    alignItems: 'center',
  },
  goBackView: {
    top: 30,
    right: 15,
    position: 'absolute',
    width: 25,
    height: 25,
  },
  goBackTouchable: {
    position: 'absolute',
    top: 25,
    right: '-50%',
  },
  image: {
    position: 'absolute',
    width: '100%',
    height: '75%',
  },
  list: {
    width: '100%',
    height: '100%',
  },
  ayahText: {
    width: '100%',
    height: 150,
    marginBottom: 25,
    backgroundColor: '#2a195b',
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 5 },
    shadowOpacity: 0.25,
    shadowRadius: 2,
  },
  arabic: {
    color: 'white',
    marginLeft: 50,
    marginTop: 25,
    fontSize: 15,
    fontWeight: 'bold',
  },
  number: {
    color: 'white',
    marginLeft: 25,
    marginTop: 25,
    fontSize: 20,
    fontWeight: '100',
  },
  english: {
    color: 'white',
    fontSize: 10,
    fontWeight: 'bold',
  },
});

Example for the data:

                "ayahs": [
                    {
                        "number": 1,
                        "audio": "https://cdn.islamic.network/quran/audio/128/ar.alafasy/1.mp3",
                        "audioSecondary": [
                            "https://cdn2.islamic.network/quran/audio/128/ar.alafasy/1.mp3",
                            "https://cdn.islamic.network/quran/audio/64/ar.alafasy/1.mp3",
                            "https://cdn2.islamic.network/quran/audio/64/ar.alafasy/1.mp3"
                        ],
                        "text": "بِسْمِ ٱللَّهِ ٱلرَّحْمَٰنِ ٱلرَّحِيمِ",
                        "numberInSurah": 1,
                        "juz": 1,
                        "manzil": 1,
                        "page": 1,
                        "ruku": 1,
                        "hizbQuarter": 1,
                        "sajda": false
                    },
                    {
                        "number": 2,
                        "audio": "https://cdn.islamic.network/quran/audio/128/ar.alafasy/2.mp3",
                        "audioSecondary": [
                            "https://cdn2.islamic.network/quran/audio/128/ar.alafasy/2.mp3",
                            "https://cdn.islamic.network/quran/audio/64/ar.alafasy/2.mp3",
                            "https://cdn2.islamic.network/quran/audio/64/ar.alafasy/2.mp3"
                        ],
                        "text": "ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِينَ",
                        "numberInSurah": 2,
                        "juz": 1,
                        "manzil": 1,
                        "page": 1,
                        "ruku": 1,
                        "hizbQuarter": 1,
                        "sajda": false
                    }
]