Banner view does not update when #State variable changes - swift

Question

I am trying to pass an admob(test) Id string from firebase to my BannerViewController. However, the view does not change when I modify my #State variable when executing my function. I placed a text to see the change in real time.
The variable 'theStringAd' should change to "ca-app-pub-3940256099942544/2934735716" when onAppear fires my function loadAd_Chart_()
this is what the ContentView look like
struct ContentView: View {
#State var theStringAd: String = "string should change"
//theStringAd should change to "ca-app-pub-3940256099942544/2934735716" when onAppear fires my function loadAd_Chart_()
var body: some View {
NavigationView{
ScrollView{
VStack{
make_ad_view(coolString: $theStringAd)
Text("The String: \(theStringAd)")
}
}
}.onAppear{
loadAd_Chart_()
}
}
func loadAd_Chart_() {
Firestore.firestore().collection("chartData").document("vqzVQOEzsbbOW1j11Oc6").getDocument { (docs, error) in
DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
if let documentSnapshot = docs, documentSnapshot.exists {
print("loading")
let ad_one_database = documentSnapshot.get("ad_one") as? String ?? ""
theStringAd = ad_one_database
print(theStringAd)
}
}
}
}
}
I know it receives the id because it prints "ca-app-pub-3940256099942544/2934735716"
Banner View
struct make_ad_view: View {
#Binding var coolString: String
var body: some View {
VStack{
BannerAdView(adUnit: $coolString, adFormat: .regularBanner)
}
}
}
Banner controller
enum AdFormat {
case largeBanner
case mediumRectangle
case adaptiveBanner
case regularBanner
var adSize: GADAdSize {
switch self {
case .largeBanner: return GADAdSizeLargeBanner
case .mediumRectangle: return GADAdSizeMediumRectangle
case .regularBanner: return GADAdSizeBanner
case .adaptiveBanner: return
GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(UIScreen.main.bounds.size.width)
}
}
var size: CGSize {
adSize.size
}
}
enum AdStatus {
case loading
case success
case failure
}
final class BannerViewController: UIViewControllerRepresentable {
#Binding var adUnitID: String
let adSize: GADAdSize
#Binding var adStatus: AdStatus
init( adUnitID: Binding<String>, adSize: GADAdSize, adStatus: Binding<AdStatus>) {
self._adUnitID = adUnitID
self.adSize = adSize
self._adStatus = adStatus
}
func makeCoordinator() -> Coordinator {
Coordinator(bannerViewController: self)
}
func makeUIViewController(context: Context) -> UIViewController {
let viewController = UIViewController()
let view = GADBannerView(adSize: adSize)
view.delegate = context.coordinator
view.adUnitID = adUnitID
view.rootViewController = viewController
view.load(GADRequest())
viewController.view.addSubview(view)
viewController.view.frame = CGRect(origin: .zero, size: adSize.size)
return viewController
}
func updateUIViewController(_ uiViewController: UIViewController, context: Context) {}
class Coordinator: NSObject, GADBannerViewDelegate {
var bannerViewController: BannerViewController
init(bannerViewController: BannerViewController) {
self.bannerViewController = bannerViewController
}
func adView(_ bannerView: GADBannerView, didFailToReceiveAdWithError error: Error) {
bannerViewController.adStatus = .failure
}
func adViewDidReceiveAd(_ bannerView: GADBannerView) {
bannerViewController.adStatus = .success
}
}
}
struct BannerAdView: View {
#Binding var adUnit: String
let adFormat: AdFormat
#State var adStatus: AdStatus = .loading
var body: some View {
HStack {
if adStatus != .failure {
ZStack{
Text("Ad")
.font(.title)
.opacity(0.5)
BannerViewController(adUnitID: $adUnit, adSize: adFormat.adSize, adStatus: $adStatus)
.frame(width: adFormat.size.width, height: adFormat.size.height)
}.frame(width: adFormat.size.width, height: adFormat.size.height)
}
}
.frame(maxWidth: .infinity)
.background(Color(.secondarySystemFill))
}
}