Replace $.ajax in admin broadcast messages with axios

app/assets/javascripts/pages/admin/broadcast_messages/broadcast_message.js

 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));
 }

app/controllers/admin/broadcast_messages_controller.rb

 class Admin::BroadcastMessagesController < Admin::ApplicationController
+  include BroadcastMessagesHelper
+
   before_action :finder, only: [:edit, :update, :destroy]
 
   def index
@@ -37,7 +39,8 @@ class Admin::BroadcastMessagesController < Admin::ApplicationController
   end
 
   def preview
-    @broadcast_message = BroadcastMessage.new(broadcast_message_params)
+    broadcast_message = BroadcastMessage.new(broadcast_message_params)
+    render json: { message: render_broadcast_message(broadcast_message) }
   end
 
   protected

app/views/admin/broadcast_messages/preview.js.haml

-$('.js-broadcast-message-preview').html("#{j(render_broadcast_message(@broadcast_message))}");