1 files changed, 11 insertions, 6 deletions
diff --git a/app/assets/javascripts/pages/admin/broadcast_messages/broadcast_message.js b/app/assets/javascripts/pages/admin/broadcast_messages/broadcast_message.js
index 857a6793fe3..885acfac6d0 100644
--- a/app/assets/javascripts/pages/admin/broadcast_messages/broadcast_message.js
+++ b/app/assets/javascripts/pages/admin/broadcast_messages/broadcast_message.js
@@ -1,4 +1,7 @@
 import _ from 'underscore';
+import axios from '~/lib/utils/axios_utils';
+import flash from '~/flash';
+import { __ } from '~/locale';
 
 export default function initBroadcastMessagesForm() {
   $('input#broadcast_message_color').on('input', function onMessageColorInput() {
@@ -18,13 +21,15 @@ export default function initBroadcastMessagesForm() {
     if (message === '') {
       $('.js-broadcast-message-preview').text('Your message here');
     } else {
-      $.ajax({
-        url: previewPath,
-        type: 'POST',
-        data: {
-          broadcast_message: { message },
+      axios.post(previewPath, {
+        broadcast_message: {
+          message,
         },
-      });
+      })
+      .then(({ data }) => {
+        $('.js-broadcast-message-preview').html(data.message);
+      })
+      .catch(() => flash(__('An error occurred while rendering preview broadcast message')));
     }
   }, 250));
 }