diff --git a/src/components/Settings/Tabs/NotificationSettingTab.jsx b/src/components/Settings/Tabs/NotificationSettingTab.jsx
index a49c817..dfd98f1 100644
--- a/src/components/Settings/Tabs/NotificationSettingTab.jsx
+++ b/src/components/Settings/Tabs/NotificationSettingTab.jsx
@@ -4,6 +4,7 @@ import SwitchCom from "../../Helpers/SwitchCom";
 import LoadingSpinner from "../../Spinners/LoadingSpinner";
 import usersService from "../../../services/UsersService";
 import localImgLoad from "../../../lib/localImgLoad";
+import { toast } from "react-toastify";
 
 import defaultImage from '../../../assets/images/banner-job-due.jpg'
 
@@ -13,13 +14,15 @@ export default function NotificationSettingTab() {
 
   const [accSettings, setAccSettings] = useState({loading: true, data: []}) // STATE TO HOLD ACCOUNT SETTINGS
 
+  let [notificationChange, setNotificationChange] = useState({loading: false, uid: ''})
+
   // const [updateNotification, setUpdateNotification] = useState(false);
   // const [uploadProduct, setUploadProduct] = useState(true);
   // const [saleProduct, setSaleProduct] = useState(true);
   // const [getProduct, setGetProduct] = useState(false);
   // const [authLevel, setAuthLevel] = useState(true);
 
-  const handleNotificationChange = (item) => {
+  const NotificationInterfaceChange = (item) => {
     setAccSettings(prev => {
       let newAccSettings = prev.data.map(data => {
         if(data.uid == item.uid){
@@ -33,6 +36,26 @@ export default function NotificationSettingTab() {
     })
   }
 
+  let handleNotificationChange = (item) => { // FUNCTION TO SET ACCOUNT SETTING
+    setNotificationChange({loading: true, uid: item.uid})
+    let reqData = { // API PAYLOADS
+      pref_id: item.pref_id,
+      status: '100'
+    }
+    api.setAccSettings(reqData).then(res => {
+      if(res.status != 200 || res.data.internal_return < 0){
+        toast.error("unable to complete");
+      }
+      toast.success("successful");
+      NotificationInterfaceChange(item) // CHANGES NOTIFICATION UI INTERFACE
+    }).catch(errer => {
+      toast.error("unable to complete");
+    }).finally(()=>{
+      setNotificationChange({loading: false, uid: {}})
+      // setTimeout(()=>{setNotificationChange({loading: false, uid: {}})},2000)
+    })
+  }
+
   useEffect(()=>{
     api.getAccSettings().then(res => {
       setAccSettings({loading: false, data: res.data?.result_list || []})
@@ -67,12 +90,16 @@ export default function NotificationSettingTab() {
                 </div>
               </div>
               <div className="mt-5 sm:mt-0">
+              {notificationChange.loading && notificationChange.uid == item.uid ?
+                <LoadingSpinner size='8' color='sky-blue' />
+                :
                 <SwitchCom
                   value={item.pref_value}
-                  handler={() => handleNotificationChange(item)}
+                  handler={ notificationChange.loading ? ()=>{} : () => handleNotificationChange(item)}
                   // value={updateNotification}
                   // handler={() => setUpdateNotification(!updateNotification)}
                 />
+              }
               </div>
             </li>
             )}
diff --git a/src/services/UsersService.js b/src/services/UsersService.js
index a699a6d..f78ad17 100644
--- a/src/services/UsersService.js
+++ b/src/services/UsersService.js
@@ -944,6 +944,18 @@ class usersService {
       return this.postAuxEnd("/getaccsettings", postData);
     }
 
+    // FUNCTION TO SET ACCOUNT SETTINGS
+    setAccSettings(reqdata) {
+      var postData = {
+        uid: localStorage.getItem("uid"),
+        member_id: localStorage.getItem("member_id"),
+        sessionid: localStorage.getItem("session_token"),
+        action: 11058,
+        ...reqdata,
+      };
+      return this.postAuxEnd("/setaccsettings", postData);
+    }
+
     // FUNCTION TO DELETE PAY CARD
     payRemCard(reqData) {
       var postData = {