diff --git a/resources/assets/js/home/CaseDetail.vue b/resources/assets/js/home/CaseDetail.vue
index 77e930053..f1dc2aba8 100644
--- a/resources/assets/js/home/CaseDetail.vue
+++ b/resources/assets/js/home/CaseDetail.vue
@@ -104,7 +104,7 @@
         ></attached-documents-edit>
       </div>
     </div>
-    <ModalClaimCase ref="modal-claim-case"></ModalClaimCase>
+    <ModalClaimCase ref="modal-claim-case" @claimCatch="claimCatch"></ModalClaimCase>
   </div>
 </template>
 
@@ -640,6 +640,12 @@ export default {
           console.error(e);
         });
     },
+    /**
+     * Claim catch error handler message
+     */
+    claimCatch(message) {
+      this.showAlert(message, "danger");
+    }
   },
 };
 </script>
diff --git a/resources/assets/js/home/modal/ModalClaimCase.vue b/resources/assets/js/home/modal/ModalClaimCase.vue
index cb8b2da5e..12ce46d52 100644
--- a/resources/assets/js/home/modal/ModalClaimCase.vue
+++ b/resources/assets/js/home/modal/ModalClaimCase.vue
@@ -78,6 +78,9 @@ export default {
           });
           eventBus.$emit("home-update-page", "XCase");
         }
+      }).catch(function (error) {
+        that.$refs["modal-claim-case"].hide();
+        that.$emit("claimCatch", error.response.data.error.message);
       });
     },
   },