diff --git a/src/components/ErrorMessage.vue b/src/components/ErrorMessage.vue
index 0452bfb..282802b 100644
--- a/src/components/ErrorMessage.vue
+++ b/src/components/ErrorMessage.vue
@@ -1,96 +1,120 @@
 <template>
-    <div class="modal">
-        <div class = "model-flexbox">
-            <span class="close" @click="toggleError">&times;</span>
-            <img id="errorImg" src="@/assets/close.png" alt="ErrorCross">
-            <p id = 'errorMessage'>Oops!</p>
-            <span id = "message">{{ displayMessage }}</span>
-        </div>
+  <div class="modal">
+    <div class="model-flexbox">
+      <span class="close" @click="toggleError">&times;</span>
+      <img id="errorImg" src="@/assets/close.png" alt="ErrorCross" />
+      <p id="errorMessage">Oops!</p>
+      <span id="message">{{ displayMessage }}</span>
     </div>
-  </template>
-  
-  <script>
-  export default {
-    name: "ErrorMessage",
-  
-    data() {
-      return {
-        displayMessage: ""
-      };
+  </div>
+</template>
+
+<script>
+export default {
+  name: "ErrorMessage",
+
+  data() {
+    return {
+      displayMessage: "",
+    };
+  },
+
+  props: {
+    condition: {
+      type: String,
+      required: true,
     },
-  
-    props: {
-      condition: {
-        type: String,
-        required: true
-      }, 
 
-      user_id: {
-        type: String,
-      },
+    user_id: {
+      type: String,
+    },
 
-      error: {
-        type: String,
-      }
+    error: {
+      type: String,
     },
-  
-    mounted() {
+  },
+
+  mounted() {
+    this.getMessage();
+  },
+
+  watch: {
+    condition: function (newCondition) {
       this.getMessage();
     },
-    
-    watch: {
-      condition: function(newCondition) {
-        this.getMessage();
+  },
+
+  methods: {
+    getMessage() {
+      // login errors
+      if (
+        this.condition === "errorLogin" &&
+        this.error == "auth/invalid-email"
+      ) {
+        this.displayMessage = "You entered an invalid email! Please try again";
+      } else if (
+        this.condition === "errorLogin" &&
+        this.error == "auth/invalid-credential"
+      ) {
+        this.displayMessage = "Incorrect password or email! Please try again";
+      }
+      // registration errors
+      else if (
+        this.condition === "errorRegistration" &&
+        this.error == "Firebase: Error (auth/email-already-in-use)."
+      ) {
+        this.displayMessage = "The email you entered is already in use";
+      } else if (
+        this.condition === "errorRegistration" &&
+        this.error == "Postal code invalid. Please try again."
+      ) {
+        this.displayMessage = "Invalid postal code! Please try again.";
+      } else if (
+        this.condition === "errorRegistration" &&
+        this.error == "Firebase: Error (auth/invalid-email)."
+      ) {
+        this.displayMessage = "The email entered is invalid! Please try again.";
+      } else if (
+        this.condition === "errorRegistration" &&
+        this.error == "Firebase: Error (auth/missing-password)."
+      ) {
+        this.displayMessage = "You forgot to provide a password!";
+      } else if (
+        this.condition === "errorRegistration" &&
+        this.error == "Please make sure all fields are filled."
+      ) {
+        this.displayMessage =
+          "You missed out some fields! Please fill them in.";
+      }
+      // google registration errors
+      else if (
+        this.condition === "errorRegistration" &&
+        this.error == "Account already exists."
+      ) {
+        this.displayMessage = "The email you entered is already in use";
+      } else if (
+        this.condition === "errorLoginNotRegisteredGoogle" &&
+        this.error == "Login but not registered with google"
+      ) {
+        this.displayMessage = "This google account is not registered.";
+      } else {
+        this.displayMessage = "Something went wrong! Please try again";
       }
     },
-  
-    methods: {
-      getMessage() {
-        // login errors
-        if (this.condition === "errorLogin" && this.error == "auth/invalid-email") {
-          this.displayMessage = "You entered an invalid email! Please try again";
-        } 
-        else if (this.condition === "errorLogin" && this.error == "auth/invalid-credential") {
-          this.displayMessage = "Incorrect password or email! Please try again";
-        }
-        // registration errors
-        else if (this.condition === "errorRegistration" && this.error == "Firebase: Error (auth/email-already-in-use).") {
-          this.displayMessage = "The email you entered is already in use";
-        }
-        else if (this.condition === "errorRegistration" && this.error == "Postal code invalid. Please try again.") {
-          this.displayMessage = "Invalid postal code! Please try again.";
-        }
-        else if (this.condition === "errorRegistration" && this.error == "Firebase: Error (auth/invalid-email).") {
-          this.displayMessage = "The email entered is invalid! Please try again.";
-        }
-        else if (this.condition === "errorRegistration" && this.error == "Firebase: Error (auth/missing-password).") {
-          this.displayMessage = "You forgot to provide a password!";
-        }
-        else if (this.condition === "errorRegistration" && this.error == "Please make sure all fields are filled.") {
-          this.displayMessage = "You missed out some fields! Please fill them in.";
-        }
-        // google registration errors
-        else if (this.condition === "errorRegistration" && this.error == "Account already exists.") {
-          this.displayMessage = "The email you entered is already in use";
-        }
-        else {
-          this.displayMessage = "Something went wrong! Please try again";
-        }
-      },
 
-      toggleError() {
-        if (this.condition === "errorLogin") {
-          this.$emit("close")
-        } else if (this.condition === "errorRegistration") {
-          this.$emit("close")
-        } else {
-          this.$emit("close")
-        }
+    toggleError() {
+      if (this.condition === "errorLogin") {
+        this.$emit("close");
+      } else if (this.condition === "errorRegistration") {
+        this.$emit("close");
+      } else {
+        this.$emit("close");
       }
-    }
-  };
-  </script>
-  
+    },
+  },
+};
+</script>
+
 <style scoped>
 .modal {
   text-align: center;
@@ -141,6 +165,4 @@ img {
   font-size: 20px;
   margin-bottom: 0px;
 }
-
 </style>
-  
\ No newline at end of file
diff --git a/src/components/GroupEventsList.vue b/src/components/GroupEventsList.vue
index 89ae290..244ee9a 100644
--- a/src/components/GroupEventsList.vue
+++ b/src/components/GroupEventsList.vue
@@ -17,6 +17,9 @@ import CreateEventForm from '@/components/CreateEventForm.vue';
         </div>
       </div>
       <!-- need to include event -->
+      <div v-if="noEvents">
+        <p>There is currently no event.</p>
+      </div>
       <div v-for="event in events" class="group">
         <GroupEventListComponent :event="event" :group="groupId"/>
       </div>
@@ -53,6 +56,7 @@ export default {
             groupAdmin: "",
             showSuccess: false,
             message_passed: "createEvent",
+            noEvents: false
         };
     },
     methods: {
@@ -63,6 +67,9 @@ export default {
           if (documentSnapshot.exists()) {
             this.events = documentSnapshot.data()["GroupEvents"]; 
             console.log(this.events);
+            if (this.events.length == 0) {
+              this.noEvents = true;
+            }
           } else {
             console.log("No such document!");
           }
diff --git a/src/components/LoginAuth.vue b/src/components/LoginAuth.vue
index a76b510..91ccf9b 100644
--- a/src/components/LoginAuth.vue
+++ b/src/components/LoginAuth.vue
@@ -58,13 +58,14 @@
 
 <script setup>
 import { ref } from "vue";
-import firebaseApp from "@/firebase";
+import firebaseApp, { firestore } from "@/firebase";
 import {
   getAuth,
   signInWithEmailAndPassword,
   signInWithPopup,
   GoogleAuthProvider,
 } from "firebase/auth";
+import { getDoc, doc } from "firebase/firestore";
 import { useRouter } from "vue-router";
 import SuccessMessage from "@/components/SuccessMessage.vue";
 import ErrorMessage from "@/components/ErrorMessage.vue";
@@ -116,16 +117,40 @@ const loginWithGoogle = async (event) => {
   try {
     const result = await signInWithPopup(auth, provider);
     const user = result.user;
-    user_id.value = user.uid;
-    loginStatus.value = "success";
-    message_passed = "loginSuccess";
+    const userDocRef = doc(firestore, "users", user.uid);
+
+    // Get the document
+    const userDocSnap = await getDoc(userDocRef);
+    console.log("hi");
+    // Check if the document exists
+    if (userDocSnap.exists()) {
+      // Document exists, proceed with login
+      user_id.value = user.uid;
+      loginStatus.value = "success";
+      message_passed = "loginSuccess";
+    } else {
+      loginStatus.value = "error";
+      message_passed = "errorLoginNotRegisteredGoogle";
+      error.value = "Login but not registered with google";
+      showError.value = true;
+      try {
+        await user.delete();
+        console.log("User account deleted successfully");
+      } catch (error) {
+        console.error("Error deleting user account:", error);
+      }
+    }
   } catch (error) {
-    loginStatus.value = "error";
-    message_passed = "errorLogin";
-    email.value = "";
-    password.value = "";
-    error.value = error.code;
-    showError.value = true;
+    if (error.code === "auth/popup-closed-by-user") {
+      console.log("Popup closed by user");
+    } else {
+      loginStatus.value = "error";
+      message_passed = "errorLogin";
+      email.value = "";
+      password.value = "";
+      error.value = error.code;
+      showError.value = true;
+    }
   }
 };
 
diff --git a/src/components/MyGroupListComponent.vue b/src/components/MyGroupListComponent.vue
index 8a3099a..aac5385 100644
--- a/src/components/MyGroupListComponent.vue
+++ b/src/components/MyGroupListComponent.vue
@@ -7,7 +7,7 @@
         <h3 id="groupName">{{ group.GroupName }}</h3>
       <!-- <p id="groupLocation">{{ group.GroupLocation }}</p> -->
       <p id="groupDescription">{{ group.GroupDescription }}</p>
-      <button class="leave-group-btn" @click="leaveGroup">Leave Group</button>
+      <button v-if="!isAdmin" class="leave-group-btn" @click="leaveGroup">Leave Group</button>
       <button v-if="isAdmin" class="delete-group-btn" @click="showWarning">
         Delete Group
       </button>
diff --git a/src/components/RegisterAuth.vue b/src/components/RegisterAuth.vue
index 634e754..c775aba 100644
--- a/src/components/RegisterAuth.vue
+++ b/src/components/RegisterAuth.vue
@@ -350,13 +350,17 @@ export default {
         // Set user info into firebase
         await setDoc(userDocRef, userData);
       } catch (error) {
-        console.error("Error during registration:", error);
-        this.registrationStatus = "error";
-        this.errorMessage = error.message;
-        this.showError = true;
-        this.showPopup = false;
-        this.message_passed = "errorRegistration";
-        console.log("hereeee -->", this.errorMessage, "lol");
+        if (error.code === "auth/popup-closed-by-user") {
+          console.log("Popup closed by user");
+        } else {
+          console.error("Error during registration:", error);
+          this.registrationStatus = "error";
+          this.errorMessage = error.message;
+          this.showError = true;
+          this.showPopup = false;
+          this.message_passed = "errorRegistration";
+          console.log("hereeee -->", this.errorMessage, "lol");
+        }
       }
     },
 
diff --git a/src/mComponents/Approval.vue b/src/mComponents/Approval.vue
index 7965b8f..97e1728 100644
--- a/src/mComponents/Approval.vue
+++ b/src/mComponents/Approval.vue
@@ -86,9 +86,7 @@
             this.updateBuyer()
             this.updateItem()
             this.updateSeller()
-            alert('approved')
-            this.$router.push({ name: 'MarketplaceDealReq'})
-
+            this.$emit('open')
         },
 
         async rejectReq() {
@@ -115,8 +113,7 @@
             } else {
                 await updateDoc(itemDocRef, { buyerID: updatedListedItems })
             }
-            console.log("rejected")
-            this.$router.push({ name: 'MarketplaceViewItems'})
+            this.$emit('rejected')
         },
 
         async getImage(fileID) {
diff --git a/src/mComponents/CreateListing.vue b/src/mComponents/CreateListing.vue
index 51101e3..0d0a6c3 100644
--- a/src/mComponents/CreateListing.vue
+++ b/src/mComponents/CreateListing.vue
@@ -155,7 +155,7 @@ export default {
             this.updateUserDBItem(this.user, ItemID)
             document.getElementById('myform').reset()
             this.$emit("added")
-            this.$router.push({ name: 'MarketplaceViewItems'})
+            this.$emit("open")
         } catch(error) {
             console.log("Error when adding document: ", error)
         }
diff --git a/src/mComponents/DealReqListingComponent.vue b/src/mComponents/DealReqListingComponent.vue
index 203527c..c1707bc 100644
--- a/src/mComponents/DealReqListingComponent.vue
+++ b/src/mComponents/DealReqListingComponent.vue
@@ -143,9 +143,14 @@ export default {
   border-radius: 5px;
   cursor: pointer;
 }
-
-.done-deal button:hover,
+.buy-request button {
+  background-color: rgb(20, 163, 20);
+}
 .buy-request button:hover {
+  background-color: green;
+}
+
+.done-deal button:hover{
   background-color: #0056b3;
 }
 </style>
\ No newline at end of file
diff --git a/src/mComponents/EditListing.vue b/src/mComponents/EditListing.vue
index 807afc0..328bd96 100644
--- a/src/mComponents/EditListing.vue
+++ b/src/mComponents/EditListing.vue
@@ -172,7 +172,7 @@ export default {
             await updateDoc(doc(db, "Items", ItemID), ItemData)
             document.getElementById('myform').reset()
             this.$emit("added")
-            this.$router.push({ name: 'MarketplaceViewItems'})
+            this.$emit('open')
         } catch(error) {
             console.log("Error when adding document: ", error)
         }
diff --git a/src/mComponents/ItemList.vue b/src/mComponents/ItemList.vue
index 9045c15..3824022 100644
--- a/src/mComponents/ItemList.vue
+++ b/src/mComponents/ItemList.vue
@@ -1,14 +1,18 @@
 <script setup>
 import ItemListComponent from '@/mComponents/ItemListComponent.vue';
+import MarketSuccess from '@/mComponents/MarketSuccess.vue';
 </script>
 
 <template>
   <div>
+    <div v-if="showSuccess">
+      <MarketSuccess :message="message" @close="toggleSuccessClose"/>
+    </div>
     <h1> All Items List </h1>
     <br/>
     <div class="grid-container">
       <div v-for="item in Items" :key="item.id" class="group">
-          <ItemListComponent :item="item"/>
+          <ItemListComponent :item="item" @open="toggleSuccess"/>
       </div>
     </div>
   </div>
@@ -25,6 +29,7 @@ const db = getFirestore(firebaseApp)
 export default {
     components: {
         ItemListComponent,
+        MarketSuccess,
     },
 
     data() {
@@ -37,6 +42,8 @@ export default {
             groupDistances: [],
             postalCode: '',
             isDropdownOpen: false,
+            message: 'Deal Request Sent',
+            showSuccess: false,
         };
     },
 
@@ -45,6 +52,15 @@ export default {
     },
 
     methods: {
+      toggleSuccessClose() {
+        this.showSuccess = !this.showSuccess
+        this.$router.push({ name: 'MarketplaceSentReq' })
+      },
+
+      toggleSuccess() {
+        this.showSuccess = !this.showSuccess
+      },
+
       async fetchItems() { 
         const db = getFirestore();
         const q = query(collection(db, 'Items'), where('sold', '==', false));
diff --git a/src/mComponents/ItemListComponent.vue b/src/mComponents/ItemListComponent.vue
index 88412ab..a90183a 100644
--- a/src/mComponents/ItemListComponent.vue
+++ b/src/mComponents/ItemListComponent.vue
@@ -106,10 +106,11 @@ export default {
     async sendDealRequest() {
       const itemID = this.fileID;
       const userID = this.user;
-      this.updateItemDB(itemID, userID);
-      this.updateUserDB(itemID, userID);
-      this.$router.push({ name: 'MarketplaceSentReq' });
+      this.updateItemDB(itemID, userID)
+      this.updateUserDB(itemID, userID)
+      this.$emit('open')
     },
+
     async updateItemDB(itemID, userID) {
       const db = getFirestore(firebaseApp);
       const docRef = doc(db, 'Items', itemID);
diff --git a/src/mComponents/MarketSuccess.vue b/src/mComponents/MarketSuccess.vue
new file mode 100644
index 0000000..f2aba36
--- /dev/null
+++ b/src/mComponents/MarketSuccess.vue
@@ -0,0 +1,83 @@
+<template>
+    <div class="modal-inner">
+        <div class = "model-flexbox">
+            <span class="close" @click="toggleSuccess">&times;</span>
+            <img id="successImg" src="@/assets/check.png" alt="successCheck">
+            <p id = 'successMessage'>Success!</p>
+            <span id = "message">{{ message }}</span>
+        </div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: "SuccessMessage",
+
+    props: {
+      message: {
+        type: String,
+        required: true
+      }, 
+    },
+
+    methods: {
+        toggleSuccess() {
+            this.$emit('close')
+        }
+    },
+  }
+  </script>
+  
+  <style scoped>
+  .modal-inner {
+  text-align: center;
+  position: fixed;
+  z-index: 1000;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+  background-color: rgba(0, 0, 0, 0.5);
+  }
+  
+  .model-flexbox {
+  background: linear-gradient(lightgreen 68%, white 20%);
+  margin: 10% auto;
+  padding: 20px;
+  border-radius: 8px;
+  width: 90%;
+  max-width: 500px;
+  font-family: Verdana, Geneva, Tahoma, sans-serif;
+  }
+  
+  img {
+  margin-top: 10px;
+  margin-left: 20px;
+  width: 160px;
+  height: 160px;
+  padding: 0px;
+  margin-bottom: 0px;
+  }
+  
+  #successMessage {
+  margin-bottom: 10px;
+  font-size: 30px;
+  color: #12b332;
+  }
+  
+  .close {
+  float: right;
+  font-size: 1.5rem;
+  font-weight: bold;
+  cursor: pointer;
+  }
+  
+  #message {
+  margin-top: 10px;
+  font-size: 20px;
+  margin-bottom: 0px;
+  }
+  
+  </style>
+  
\ No newline at end of file
diff --git a/src/mComponents/MyListing.vue b/src/mComponents/MyListing.vue
index 743dc6a..d0ca35a 100644
--- a/src/mComponents/MyListing.vue
+++ b/src/mComponents/MyListing.vue
@@ -1,22 +1,26 @@
 <script setup>
 import MyListingComponent from '@/mComponents/MyListingComponent.vue';
-import EditListing from '@/mComponents/EditListing.vue'
+import EditListing from '@/mComponents/EditListing.vue';
+import MarketSuccess from '@/mComponents/MarketSuccess.vue';
 </script>
 
 <template>
   <div>
+    <div v-if="showSuccess">
+      <MarketSuccess :message="message" @close="toggleSuccessClose"/>
+    </div>
     <br/>
     <div class="groupFlexbox">
       <div v-if="item_list.length === 0" class="no-item-msg">
             <h1> You have no active listings </h1>
       </div>
       <div v-for="item in item_list" :key="item.id" class="group">
-        <MyListingComponent :item="item" @openPopup="togglePopup"/>
+        <MyListingComponent :item="item" @openPopup="togglePopup" @open="toggleSuccessDelete"/>
       </div>
     </div>
 
     <div v-if="showPopup" class="overlay">
-      <EditListing @closePopup="closePopup" :itemID="currentItem"/>
+      <EditListing @closePopup="closePopup" :itemID="currentItem" @open="toggleSuccess"/>
     </div>
   </div>
 </template>
@@ -31,6 +35,7 @@ export default {
     components: {
         MyListingComponent,
         EditListing,
+        MarketSuccess
     },
     data() {
         return {
@@ -40,10 +45,26 @@ export default {
             item_list: [],
             showPopup: false,
             currentItem: null,
+            message: 'Edited Successfully',
+            showSuccess: false
         };
     },
 
     methods: {
+      toggleSuccessClose() {
+        this.showSuccess = !this.showSuccess
+        this.$router.push({ name: 'MarketplaceViewItems'})
+      },
+
+      toggleSuccessDelete() {
+        this.message = 'Deleted Successfully'
+        this.showSuccess = !this.showSuccess
+      },
+
+      toggleSuccess() {
+        this.showSuccess = !this.showSuccess
+      },
+
         async fetchItems() {
             const db = getFirestore(firebaseApp)
             const userDocRef = doc(db, 'users', this.user); 
diff --git a/src/mComponents/MyListingComponent.vue b/src/mComponents/MyListingComponent.vue
index b283b1b..ce6492b 100644
--- a/src/mComponents/MyListingComponent.vue
+++ b/src/mComponents/MyListingComponent.vue
@@ -82,7 +82,7 @@
           const updatedListedItems = userData.listedItem.filter(id => id !== this.fileID)
           await updateDoc(userDocRef, { listedItem: updatedListedItems })
           await deleteDoc(itemDocRef)
-          this.$router.push({ name: 'MarketplaceViewItems'})
+          this.$emit('open')
         },
   
         async updateUserDBJoin(documentId, newGroupId) {
diff --git a/src/mComponents/SentListingComponent.vue b/src/mComponents/SentListingComponent.vue
index a0436f6..6019713 100644
--- a/src/mComponents/SentListingComponent.vue
+++ b/src/mComponents/SentListingComponent.vue
@@ -73,65 +73,65 @@ export default {
       const docRef = doc(db, 'Items', this.fileID)
       const itemSnapshot = await getDoc(docRef)
       const itemdata = itemSnapshot.data()
-      const buyerID = itemdata.sellerID;
+      const buyerID = itemdata.sellerID
       this.$emit('openPopup', buyerID)
     },
     async getImage(fileID) {
       try {
         let storage = getStorage();
-        let filePath = `gs://connecthub-88e58.appspot.com/${fileID}`;
-        let fileRef = ref(storage, filePath);
-        let fileURL = await getDownloadURL(fileRef);
-        this.fileURL = fileURL;
+        let filePath = `gs://connecthub-88e58.appspot.com/${fileID}`
+        let fileRef = ref(storage, filePath)
+        let fileURL = await getDownloadURL(fileRef)
+        this.fileURL = fileURL
       } catch (error) {
-        console.log("No Image Found");
+        console.log("No Image Found")
       }
     },
     async deleteFromItem(itemID) {
-      const db = getFirestore(firebaseApp);
-      const docRef = doc(db, 'Items', itemID);
+      const db = getFirestore(firebaseApp)
+      const docRef = doc(db, 'Items', itemID)
       await updateDoc(docRef, {
         hasBuyRequest: false,
         buyerID: "",
-      });
-      const itemSnapshot = await getDoc(docRef);
-      const itemdata = itemSnapshot.data();
-      const sellerID = itemdata.sellerID;
-      const sellerDocRef = doc(db, 'users', sellerID);
-      const sellerDocSnap = await getDoc(sellerDocRef);
-      const sellerData = sellerDocSnap.data();
-      const updatedSentRequest = sellerData.receivedRequestforItem.filter(id => id !== itemID);
+      })
+      const itemSnapshot = await getDoc(docRef)
+      const itemdata = itemSnapshot.data()
+      const sellerID = itemdata.sellerID
+      const sellerDocRef = doc(db, 'users', sellerID)
+      const sellerDocSnap = await getDoc(sellerDocRef)
+      const sellerData = sellerDocSnap.data()
+      const updatedSentRequest = sellerData.receivedRequestforItem.filter(id => id !== itemID)
       await updateDoc(sellerDocRef, {
         receivedRequestforItem: updatedSentRequest,
       });
     },
     async deletefromUser(itemID, userID) {
       const db = getFirestore(firebaseApp);
-      const docRef = doc(db, 'users', userID);
+      const docRef = doc(db, 'users', userID)
       await updateDoc(docRef, {
         sentRequestforItem: arrayRemove(itemID)
       });
     },
     async deleteDealRequest() {
       await this.deleteFromItem(this.fileID);
-      await this.deletefromUser(this.fileID, this.user);
-      this.$router.push({ name: 'MarketplaceViewItems' });
+      await this.deletefromUser(this.fileID, this.user)
+      this.$emit('open')
     },
     async checkSold() {
       const db = getFirestore(firebaseApp);
-      const itemDocRef = doc(db, 'Items', this.fileID);
-      const itemDocSnap = await getDoc(itemDocRef);
-      const itemData = itemDocSnap.data();
-      this.isSold = itemData.sold;
+      const itemDocRef = doc(db, 'Items', this.fileID)
+      const itemDocSnap = await getDoc(itemDocRef)
+      const itemData = itemDocSnap.data()
+      this.isSold = itemData.sold
       if (itemData.soldTo === this.user) {
-        this.isSoldtoYou = true;
+        this.isSoldtoYou = true
       }
     }
   },
   mounted() {
-    this.getImage(this.fileID);
-    this.checkSold();
-    this.getSellerName();
+    this.getImage(this.fileID)
+    this.checkSold()
+    this.getSellerName()
   }
 };
 </script>
diff --git a/src/mComponents/SentListings.vue b/src/mComponents/SentListings.vue
index b51d8ac..e6029e2 100644
--- a/src/mComponents/SentListings.vue
+++ b/src/mComponents/SentListings.vue
@@ -1,10 +1,14 @@
 <script setup>
 import SentListingComponent from '@/mComponents/SentListingComponent.vue';
 import ContactPopup from './ContactPopup.vue';
+import MarketSuccess from '@/mComponents/MarketSuccess.vue';
 </script>
 
 <template>
   <div>
+    <div v-if="showSuccess">
+      <MarketSuccess :message="message" @close="toggleSuccessClose"/>
+    </div>
     <br/>
       <ContactPopup :userId="current_user" v-if="showPopup" @closePopup="runClose"/>
       <div class = "groupFlexbox">
@@ -12,7 +16,7 @@ import ContactPopup from './ContactPopup.vue';
             <h1> No Sent Req </h1>
         </div>
         <div v-for="item in item_list" :key="item.id" class="group">
-          <SentListingComponent :item="item" @openPopup="runOpen" :showPopup="showPopup" />
+          <SentListingComponent :item="item" @openPopup="runOpen" :showPopup="showPopup" @open="toggleSuccess"/>
         </div>
       </div>
     </div>
@@ -28,6 +32,7 @@ export default {
     components: {
         SentListingComponent,
         ContactPopup,
+        MarketSuccess
     },
     data() {
         return {
@@ -37,26 +42,37 @@ export default {
             item_list: [],
             showPopup: false,
             current_item: null,
+            message: 'Deal Request Deleted',
+            showSuccess: false,
         };
     },
 
     methods: {
-        runClose() {
-          this.showPopup = false
-        },
+      toggleSuccessClose() {
+        this.showSuccess = !this.showSuccess
+        this.$router.push({ name: 'MarketplaceViewItems' })
+      },
 
-        runOpen(item) {
-          this.current_user = item
-          this.showPopup = true
-        },
+      toggleSuccess() {
+        this.showSuccess = !this.showSuccess
+      },
 
-        async fetchItems() {
-            const db = getFirestore(firebaseApp)
-            const userDocRef = doc(db, 'users', this.user)
-            const docSnap = await getDoc(userDocRef);
-            let item_listid = docSnap.data().sentRequestforItem
-            this.fetchItemObject(item_listid)
-            },
+      runClose() {
+        this.showPopup = false
+      },
+
+      runOpen(item) {
+        this.current_user = item
+        this.showPopup = true
+      },
+
+      async fetchItems() {
+          const db = getFirestore(firebaseApp)
+          const userDocRef = doc(db, 'users', this.user)
+          const docSnap = await getDoc(userDocRef);
+          let item_listid = docSnap.data().sentRequestforItem
+          this.fetchItemObject(item_listid)
+        },
 
         async fetchItemObject(item_listid) {
             for (const itemId of item_listid) {
diff --git a/src/views/GroupSetting.vue b/src/views/GroupSetting.vue
index 87c409f..9002e95 100644
--- a/src/views/GroupSetting.vue
+++ b/src/views/GroupSetting.vue
@@ -88,8 +88,7 @@ h1 {
     margin-top: 110px;
     margin-right: 5px;
     max-height: calc(100vh - 120px/* Height of the header + any additional space */);
-    width: 100%;
-    max-width: 1350px;
+    width: 95%;
     overflow-y: auto; 
     box-sizing: border-box; 
     position: relative; 
diff --git a/src/views/MarketApprove.vue b/src/views/MarketApprove.vue
index 45b3ded..92625fe 100644
--- a/src/views/MarketApprove.vue
+++ b/src/views/MarketApprove.vue
@@ -9,6 +9,9 @@
         <NavBar_market />
     </div>
 
+    <div v-if="showSuccess">
+      <MarketSuccess :message="message" @close="toggleSuccessClose"/>
+    </div>
     <div class="container">
       <!-- List of Approval Items -->
       <div class="list">
@@ -21,7 +24,7 @@
         </div>
         <div class="approval-items">
           <div v-for="user in buyerList" :key="user.id" class="user-item">
-            <Approval :user="user" :itemID="itemID" />
+            <Approval :user="user" :itemID="itemID" @open="toggleSuccess" @rejected="toggleSuccessReject"/>
           </div>
         </div>
       </div>
@@ -38,12 +41,14 @@ import { getStorage, ref, getDownloadURL } from 'firebase/storage';
 import Navbar_global from '@/components/Navbar_global.vue'
 import NavBar_market from '@/mComponents/Navbar_market.vue'
 import Approval from '@/mComponents/Approval.vue'
+import MarketSuccess from '@/mComponents/MarketSuccess.vue'
 
 export default {
   components: {
     Navbar_global,
     NavBar_market,
-    Approval
+    Approval,
+    MarketSuccess
   },
   data() {
     return {
@@ -53,10 +58,27 @@ export default {
       user: getAuth().currentUser.uid,
       fileURL: null,
       buyerList: [],
+      message: 'Approved Successfully',
+      showSuccess: false
     }
   },
 
   methods: {
+
+    toggleSuccessClose() {
+      this.showSuccess = !this.showSuccess
+      this.$router.push({ name: 'MarketplaceDealReq'})
+    },
+
+    toggleSuccessReject() {
+      this.message = 'Rejected Successfully'
+      this.showSuccess = !this.showSuccess
+    },
+
+    toggleSuccess() {
+      this.showSuccess = !this.showSuccess
+    },
+
     async getImage(fileID) {
       try {
           let storage = getStorage()
diff --git a/src/views/MarketMyList.vue b/src/views/MarketMyList.vue
index 6def381..c05d7a0 100644
--- a/src/views/MarketMyList.vue
+++ b/src/views/MarketMyList.vue
@@ -3,6 +3,8 @@
   import NavBar_market from '@/mComponents/Navbar_market.vue'
   import CreateListing from '@/mComponents/CreateListing.vue'
   import MyListing from '@/mComponents/MyListing.vue'
+  import MarketSuccess from '@/mComponents/MarketSuccess.vue'
+  
 </script>
 
 <template>
@@ -22,13 +24,16 @@
         <button class="close-btn" @click="isOpen = false">Close</button>
         <br/>
         <br/>
-        <CreateListing/>
+        <CreateListing @open="toggleSuccess"/>
       </div>
-
     </div>
-
     <!-- Main Content -->
     <body>
+              <!-- Success Message -->
+      <div v-if="showSuccess" class="success">
+        <MarketSuccess :message="message" @close="toggleSuccessClose"/>
+      </div>
+
       <div class="container">
         <div class="list">
           <div class="list-header">
@@ -46,11 +51,33 @@
 
 <script>
 export default {
+  components: {
+    Navbar_global,
+    NavBar_market,
+    CreateListing,
+    MyListing,
+    MarketSuccess,
+    },
+
   data() {
     return {
       isOpen:false,
+      message: 'Item Created',
+      showSuccess: false
+    }
+  },
+
+  methods: {
+      toggleSuccessClose() {
+        this.showSuccess = !this.showSuccess
+        this.$router.push({ name: 'MarketplaceViewItems'})
+      },
+
+      toggleSuccess() {
+        this.isOpen = false
+        this.showSuccess = !this.showSuccess
+      },
     }
-  }
 }
 </script>
 <style scoped>
@@ -132,4 +159,8 @@ export default {
   overflow-y: auto; /* ensure scrollability of content within modal if needed */
 }
 
+.success {
+  background-color: #dc3545;
+}
+
 </style>
\ No newline at end of file