fix(active storage): stop svg+xml from being served as binary files (#5066)

* Remove image/svg+xml from binary files

* Allow svg+xml files to supported formats

app/javascript/helpers/FileValidationHelper.jsx

@@ -16,7 +16,7 @@
 
 export const fileValidation = (file, type) => {
   const IMAGE_MAX_FILE_SIZE = 3_000_000;
-  const IMAGE_SUPPORTED_FORMATS = ['image/jpeg', 'image/png', 'image/svg'];
+  const IMAGE_SUPPORTED_FORMATS = ['image/jpeg', 'image/png', 'image/svg+xml'];
 
   const PRESENTATION_MAX_FILE_SIZE = 10_000_000;
   const PRESENTATION_SUPPORTED_FORMATS = [

config/application.rb

@@ -57,6 +57,9 @@ module Greenlight
 
     config.active_storage.variant_processor = :mini_magick
 
+    # SVGs are served as binary by default, which causes the browser to download the file instead of displaying it
+    config.active_storage.content_types_to_serve_as_binary -= ['image/svg+xml']
+
     config.bigbluebutton_endpoint = ENV.fetch('BIGBLUEBUTTON_ENDPOINT', 'https://test-install.blindsidenetworks.com/bigbluebutton/api')
     config.bigbluebutton_endpoint = File.join(config.bigbluebutton_endpoint, '') unless config.bigbluebutton_endpoint.end_with?('/')
     config.bigbluebutton_endpoint = File.join(config.bigbluebutton_endpoint, '/api/') unless config.bigbluebutton_endpoint.end_with?('api', 'api/')