From 9f0ce180d2e3848d0b5fb9f176bf1dd7dfeff62b Mon Sep 17 00:00:00 2001
From: Emmanuel Vitor <emmanuelvitor.ti@gmail.com>
Date: Wed, 21 Dec 2022 14:07:22 -0300
Subject: [PATCH] feat: cria logica para fazer o mutation observar mudancas de
 quando a prateleira deve ou nao aparecer

---
 checkout/src/arquivos/js/components/Footer.js | 37 +++++++++++++++++--
 1 file changed, 33 insertions(+), 4 deletions(-)

diff --git a/checkout/src/arquivos/js/components/Footer.js b/checkout/src/arquivos/js/components/Footer.js
index 99f3d49..ce12bd8 100644
--- a/checkout/src/arquivos/js/components/Footer.js
+++ b/checkout/src/arquivos/js/components/Footer.js
@@ -7,7 +7,7 @@ export default class Footer {
 
     async init() {
         await this.selectors();
-        // this.onUpdate();
+        this.onUpdate();
         this.createfooterShelf();
         this.insertImagesPayments();
         this.insertImagesDevelopedBy();
@@ -25,18 +25,47 @@ export default class Footer {
     }
 
     onUpdate() {
-        //Função qeu fará a verificação se o carrinho está vazio para remover a prateleira de produtos:
+        //Função qu fará a verificação se o carrinho está vazio para remover a prateleira de produtos:
         // vocês devem olhar a doc fornecida no Desafio para aprender a usar a MutationObserver
         // sempre que o carrinho estiver vazio o elemento chcekoutVazio fica display: none e isso pode ser usado como atributo para a MutationObserver
+
         let target = this.checkoutVazio;
+        let shelf = this.footerCheckoutShelf;
         let config = { childList: true, attributes: true };
+
+        if (window.location.href === "https://m3academy.myvtex.com/checkout/#/cart" && this.checkoutVazio.style.display == "none") {
+            shelf.classList.remove("none");
+            this.createfooterShelf();
+        } else {
+            shelf.classList.add("none");
+        }
+        window.addEventListener("hashchange", () => {
+            if (window.location.hash == "#/cart" && this.checkoutVazio.style.display == "none") {
+                shelf.classList.remove("none")
+                this.createfooterShelf();
+            } else if (window.location.hash != "#/cart") {
+                shelf.classList.add("none");
+
+            }
+        });
+
+
         let observer = new MutationObserver((mutations) => {
-            mutations.forEach(function (mutation) {
-                console.log(mutation.type);
+            mutations.forEach((mutation) => {
+                if (target.style.display == "none" && window.location.hash == "#/cart") {
+                    shelf.classList.remove("none");
+                    this.footerShelf();
+                } else {
+                    shelf.classList.add("none");
+
+                }
             });
         });
 
+
         observer.observe(target, config);
+
+
     }
     insertImagesPayments() {
         this.footerCheckoutPayments.innerHTML = `