diff --git a/config/language-translations.php b/config/language-translations.php
index a5b6fb48..f3529cc2 100644
--- a/config/language-translations.php
+++ b/config/language-translations.php
@@ -707,7 +707,7 @@ return [
         'register_with_email_and_get_folder'             => 'Register account with your email {email} and get access to this Team Folder.',
         'invite_to_join_team_folder'                     => 'Invitation To Join Team Folder',
         'or_decline_your_invitation'                     => 'Or {0} your invitation.',
-        'decline'                                        => 'decline',
+        'decline'                                        => 'Decline',
         'you_are_successfully_joined'                    => 'You are successfully joined',
         'proceed_to_participate_with_team'               => 'You can now proceed to your account and participate in team folder',
         'proceed_to_your_account'                        => 'Proceed to your account',
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index f22fc523..c2a4b744 100644
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -16,29 +16,29 @@
     "/chunks/not-found.js": "/chunks/not-found.js?id=9f6ce23ce5d969f1",
     "/chunks/temporary-unavailable.js": "/chunks/temporary-unavailable.js?id=f564565faa09d6d6",
     "/chunks/admin.js": "/chunks/admin.js?id=1f197d019e3493c8",
-    "/chunks/dashboard.js": "/chunks/dashboard.js?id=d2cfb9504b3e1c88",
-    "/chunks/invoices.js": "/chunks/invoices.js?id=1416cbf6d1a593ac",
-    "/chunks/subscriptions.js": "/chunks/subscriptions.js?id=5bf6704f5b599f36",
-    "/chunks/pages.js": "/chunks/pages.js?id=c8380d571e91e8be",
+    "/chunks/dashboard.js": "/chunks/dashboard.js?id=28169f03aee0e3a0",
+    "/chunks/invoices.js": "/chunks/invoices.js?id=a4785aea6257404e",
+    "/chunks/subscriptions.js": "/chunks/subscriptions.js?id=51b6098a72f1fcdb",
+    "/chunks/pages.js": "/chunks/pages.js?id=4529e647b15e5c98",
     "/chunks/page-edit.js": "/chunks/page-edit.js?id=fb3f9eda3dc1d15c",
-    "/chunks/plans.js": "/chunks/plans.js?id=6e8c847c141e41e8",
-    "/chunks/users.js": "/chunks/users.js?id=ec687ee365c4248a",
+    "/chunks/plans.js": "/chunks/plans.js?id=64803e40b7a125e5",
+    "/chunks/users.js": "/chunks/users.js?id=8bc57edd89c4ca11",
     "/chunks/user-create.js": "/chunks/user-create.js?id=8dd9d29f024132f5",
     "/chunks/plan-create/fixed.js": "/chunks/plan-create/fixed.js?id=c994595021a98ce6",
     "/chunks/plan-create/metered.js": "/chunks/plan-create/metered.js?id=d9f1bcb1fe44a6ae",
     "/chunks/user.js": "/chunks/user.js?id=c191b906a0496fe5",
     "/chunks/user-detail.js": "/chunks/user-detail.js?id=d53bfd58090b79e2",
     "/chunks/user-storage.js": "/chunks/user-storage.js?id=a8e0bce4703232a0",
-    "/chunks/user-subscription.js": "/chunks/user-subscription.js?id=27d046c1122783ea",
+    "/chunks/user-subscription.js": "/chunks/user-subscription.js?id=3ef8231d279d83bb",
     "/chunks/user-password.js": "/chunks/user-password.js?id=23d3aee39f539a3c",
     "/chunks/user-delete.js": "/chunks/user-delete.js?id=6bea6f8cadf4d74f",
     "/chunks/plan.js": "/chunks/plan.js?id=4b267375ea9f19b3",
-    "/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=a956ceca6865c50c",
+    "/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=fea2f8eaae2f3334",
     "/chunks/plan-settings.js": "/chunks/plan-settings.js?id=715ee86991d5e4db",
     "/chunks/plan-delete.js": "/chunks/plan-delete.js?id=1ad77372d342326f",
     "/chunks/payments.js": "/chunks/payments.js?id=dc4586691c25de6f",
     "/chunks/payments/billings.js": "/chunks/payments/billings.js?id=dd6c9d6a29a47808",
-    "/chunks/payments/settings.js": "/chunks/payments/settings.js?id=22bce2575affd7af",
+    "/chunks/payments/settings.js": "/chunks/payments/settings.js?id=022ba98937be861c",
     "/chunks/app-settings.js": "/chunks/app-settings.js?id=55da23af2b076069",
     "/chunks/app-appearance.js": "/chunks/app-appearance.js?id=a694a01f3641712c",
     "/chunks/app-index.js": "/chunks/app-index.js?id=efdbfa062749ca00",
@@ -61,7 +61,7 @@
     "/chunks/profile.js": "/chunks/profile.js?id=0eca231475e267ab",
     "/chunks/settings-password.js": "/chunks/settings-password.js?id=3755d41eaf50a5b1",
     "/chunks/settings-storage.js": "/chunks/settings-storage.js?id=994b669a56fd417b",
-    "/chunks/billing.js": "/chunks/billing.js?id=40e758c87bcf6e89",
+    "/chunks/billing.js": "/chunks/billing.js?id=a983c29d1a4f87ba",
     "/chunks/platform.js": "/chunks/platform.js?id=adbd23bb1da95322",
     "/chunks/files.js": "/chunks/files.js?id=99230d6e76d78e5f",
     "/chunks/recent-uploads.js": "/chunks/recent-uploads.js?id=8ba6e0814135b24a",
diff --git a/resources/js/components/Notifications/Notification.vue b/resources/js/components/Notifications/Notification.vue
index d95d8404..f8e46f18 100644
--- a/resources/js/components/Notifications/Notification.vue
+++ b/resources/js/components/Notifications/Notification.vue
@@ -49,20 +49,22 @@
             <div v-if="action && action.type === 'invitation'" class="flex items-center space-x-3 mt-4">
                 <div
 					@click="acceptAction"
-                    class="flex cursor-pointer items-center rounded-xl py-1.5 px-2 transition-colors hover:bg-green-100 dark:hover:bg-green-900"
+                    class="relative flex cursor-pointer items-center rounded-xl py-1.5 px-2 transition-colors bg-green-100 dark:bg-green-900"
                 >
-                    <check-icon size="16" class="vue-feather mr-2 text-green-600 dark:text-green-600" />
-                    <span class="text-sm font-bold text-green-600 dark:text-green-600">
+					<refresh-cw-icon v-if="isAccepting" size="16" class="animate-spin left-0 right-0 mx-auto vue-feather text-green-600 dark:text-green-600 absolute justify-center" />
+                    <check-icon size="16" class="vue-feather mr-1 text-green-600 dark:text-green-600" :class="{'opacity-0': isAccepting}" />
+                    <span class="text-sm font-bold text-green-600 dark:text-green-600" :class="{'opacity-0': isAccepting}">
                         {{ $t('accept') }}
                     </span>
                 </div>
 
                 <div
 					@click="declineAction"
-                    class="flex cursor-pointer items-center rounded-xl py-1.5 px-2 transition-colors hover:bg-rose-100 dark:hover:bg-rose-900"
+                    class="relative flex cursor-pointer items-center rounded-xl py-1.5 px-2 transition-colors bg-rose-100 dark:bg-rose-900"
                 >
-                    <x-icon size="16" class="vue-feather mr-2 text-rose-600 dark:text-rose-600" />
-                    <span class="text-sm font-bold text-rose-600 dark:text-rose-600">
+					<refresh-cw-icon v-if="isDeclining" size="16" class="animate-spin left-0 right-0 mx-auto vue-feather text-rose-600 dark:text-rose-600 absolute justify-center" />
+                    <x-icon size="16" class="vue-feather mr-1 text-rose-600 dark:text-rose-600" :class="{'opacity-0': isDeclining}" />
+                    <span class="text-sm font-bold text-rose-600 dark:text-rose-600 capitalize" :class="{'opacity-0': isDeclining}">
                         {{ $t('decline') }}
                     </span>
                 </div>
@@ -84,7 +86,7 @@
     </article>
 </template>
 <script>
-import { TrendingUpIcon, GiftIcon, CheckIcon, XIcon, MailIcon, UserPlusIcon, UploadCloudIcon, ChevronRightIcon, AlertTriangleIcon } from 'vue-feather-icons'
+import { RefreshCwIcon, TrendingUpIcon, GiftIcon, CheckIcon, XIcon, MailIcon, UserPlusIcon, UploadCloudIcon, ChevronRightIcon, AlertTriangleIcon } from 'vue-feather-icons'
 import MemberAvatar from '../FilesView/MemberAvatar'
 import {events} from "../../bus";
 
@@ -97,6 +99,7 @@ export default {
         ChevronRightIcon,
         UploadCloudIcon,
 		TrendingUpIcon,
+		RefreshCwIcon,
         UserPlusIcon,
         CheckIcon,
 		GiftIcon,
@@ -110,11 +113,15 @@ export default {
     },
 	data() {
 		return {
-			isUnread: false
+			isUnread: false,
+			isAccepting: false,
+			isDeclining: false,
 		}
 	},
     methods: {
 		acceptAction() {
+			this.isAccepting = true
+
 			axios.put(`/api/teams/invitations/${this.notification.data.attributes.action.params.id}`)
 				.then(() => {
 					this.$store.commit('CLEAR_NOTIFICATION_ACTION_DATA', this.notification.data.id)
@@ -124,8 +131,11 @@ export default {
 						message: this.$t('you_accepted_invitation'),
 					})
 				})
+				.finally(() => this.isAccepting = false)
 		},
 		declineAction() {
+			this.isDeclining = true
+
 			axios.delete(`/api/teams/invitations/${this.notification.data.attributes.action.params.id}`)
 				.then(() => {
 					this.$store.commit('CLEAR_NOTIFICATION_ACTION_DATA', this.notification.data.id)
@@ -135,6 +145,7 @@ export default {
 						message: this.$t('you_decline_invitation'),
 					})
 				})
+				.finally(() => this.isDeclining = false)
 		},
         closeCenter() {
             this.$store.commit('CLOSE_NOTIFICATION_CENTER')