[deploy] Remove unnecessary bulk from image assets (#8306)

* Remove unnecessary bulk from image assets

* Swap background-image

* Fix test

* Fix test

app/javascript/articles/__tests__/__snapshots__/Article.test.jsx.snap

@@ -202,7 +202,7 @@ exports[`<Article /> component should render a featured article for a video post
     <a
       class="crayons-story__video"
       href="/some-post/path"
-      style="background-image:url(/images/onboarding-background.png)"
+      style="background-image:url(/images/apple-icon.png)"
     >
       <span
         class="crayons-story__video__time"
@@ -1092,7 +1092,7 @@ exports[`<Article /> component should render a video article 1`] = `
     <a
       class="crayons-story__video"
       href="/some-post/path"
-      style="background-image:url(/images/onboarding-background.png)"
+      style="background-image:url(/images/apple-icon.png)"
     >
       <span
         class="crayons-story__video__time"
@@ -1276,7 +1276,7 @@ exports[`<Article /> component should render a video article with a flare tag 1`
     <a
       class="crayons-story__video"
       href="/some-post/path"
-      style="background-image:url(/images/onboarding-background.png)"
+      style="background-image:url(/images/apple-icon.png)"
     >
       <span
         class="crayons-story__video__time"

app/javascript/articles/__tests__/utilities/articleUtilities.js

@@ -229,7 +229,7 @@ export const videoArticle = {
   published_timestamp: 'Tue, 18 Feb 2020 15:11:02 GMT',
   published_at: '2020-02-18T14:59:24Z',
   readable_publish_date: 'February 18',
-  cloudinary_video_url: '/images/onboarding-background.png',
+  cloudinary_video_url: '/images/apple-icon.png',
   main_image: '/images/10.png',
   video_duration_in_minutes: 10,
 };

app/javascript/crayons/avatarsAndLogos/Avatar/__stories__/avatars.html.stories.jsx

@@ -8,7 +8,7 @@ export default {
 
 export const Default = () => (
   <span className="crayons-avatar">
-    <img src="/images/ben.jpg" className="crayons-avatar__image" alt="Ben" />
+    <img src="/images/apple-icon.png" className="crayons-avatar__image" alt="Ben" />
   </span>
 );
 
@@ -16,7 +16,7 @@ Default.story = { name: 'default (small)' };
 
 export const Large = () => (
   <span className="crayons-avatar crayons-avatar--l">
-    <img src="/images/ben.jpg" className="crayons-avatar__image" alt="Ben" />
+    <img src="/images/apple-icon.png" className="crayons-avatar__image" alt="Ben" />
   </span>
 );
 
@@ -24,7 +24,7 @@ Large.story = { name: 'large' };
 
 export const ExtraLarge = () => (
   <span className="crayons-avatar crayons-avatar--xl">
-    <img src="/images/ben.jpg" className="crayons-avatar__image" alt="Ben" />
+    <img src="/images/apple-icon.png" className="crayons-avatar__image" alt="Ben" />
   </span>
 );
 
@@ -32,7 +32,7 @@ ExtraLarge.story = { title: 'extra large' };
 
 export const DoubleXL = () => (
   <span className="crayons-avatar crayons-avatar--2xl">
-    <img src="/images/ben.jpg" className="crayons-avatar__image" alt="Ben" />
+    <img src="/images/apple-icon.png" className="crayons-avatar__image" alt="Ben" />
   </span>
 );
 
@@ -40,7 +40,7 @@ DoubleXL.story = { name: '2XL' };
 
 export const TripleXL = () => (
   <span className="crayons-avatar crayons-avatar--3xl">
-    <img src="/images/ben.jpg" className="crayons-avatar__image" alt="Ben" />
+    <img src="/images/apple-icon.png" className="crayons-avatar__image" alt="Ben" />
   </span>
 );
 

app/javascript/onboarding/__tests__/Onboarding.test.jsx

@@ -84,7 +84,7 @@ describe('<Onboarding />', () => {
     {
       id: 1,
       name: 'Ben Halpern',
-      profile_image_url: 'ben.jpg',
+      profile_image_url: 'apple-icon.png',
     },
     {
       id: 2,

app/javascript/onboarding/__tests__/__snapshots__/Onboarding.test.jsx.snap

@@ -252,7 +252,7 @@ preact-render-spy (1 nodes)
             <figure class="user-avatar-container">
               <img
                 class="user-avatar"
-                src="ben.jpg"
+                src="apple-icon.png"
                 alt="profile"
                />
             </figure>

app/models/site_config.rb

@@ -62,7 +62,7 @@ class SiteConfig < RailsSettings::Base
 
   # Mascot
   field :mascot_user_id, type: :integer, default: 1
-  field :mascot_image_url, type: :string, default: "https://practicaldev-herokuapp-com.freetls.fastly.net/assets/sloan.png"
+  field :mascot_image_url, type: :string, default: "https://dev-to-uploads.s3.amazonaws.com/i/y5767q6brm62skiyywvc.png"
   field :mascot_image_description, type: :string, default: "Sloan, the sloth mascot"
 
   # Meta keywords

app/views/comments/_comment_proper.html.erb

@@ -12,7 +12,7 @@
 
       <% if decorated_comment.low_quality %>
         <div class="low-quality-comment-marker">
-          <%= image_tag(cl_image_path(asset_path("/assets/sloan.png"),
+          <%= image_tag(cl_image_path(SiteConfig.mascot_image_url,
                                       type: "fetch",
                                       width: 50,
                                       height: 50,

app/views/comments/deleted_commentable_comment.html.erb

@@ -15,7 +15,7 @@
 
         <% if decorated_comment.low_quality %>
           <div class="low-quality-comment-marker">
-            <%= image_tag(cl_image_path(asset_path("/assets/sloan.png"),
+            <%= image_tag(cl_image_path(SiteConfig.mascot_image_url,
                                         type: "fetch",
                                         width: 50,
                                         height: 50,

app/views/dashboards/show.html.erb

@@ -40,7 +40,7 @@
       <a href="/new" class="cta big">
         Write your first post now
       </a>
-      <%= image_tag(cl_image_path(asset_path("/assets/sloan.png"),
+      <%= image_tag(cl_image_path(SiteConfig.mascot_image_url,
                                   type: "fetch",
                                   width: 300,
                                   crop: "imagga_scale",

app/views/pages/crayons.html.erb

@@ -984,11 +984,11 @@
     <p>Remember to use descriptive alt="" values!</p>
   </div>
   <div>
-    <span class="crayons-avatar"><img src="<%= asset_path("ben.jpg") %>" class="crayons-avatar__image" alt="Ben" /></span>
-    <span class="crayons-avatar crayons-avatar--l"><img src="<%= asset_path("ben.jpg") %>" class="crayons-avatar__image" alt="Ben" /></span>
-    <span class="crayons-avatar crayons-avatar--xl"><img src="<%= asset_path("ben.jpg") %>" class="crayons-avatar__image" alt="Ben" /></span>
-    <span class="crayons-avatar crayons-avatar--2xl"><img src="<%= asset_path("ben.jpg") %>" class="crayons-avatar__image" alt="Ben" /></span>
-    <span class="crayons-avatar crayons-avatar--3xl"><img src="<%= asset_path("ben.jpg") %>" class="crayons-avatar__image" alt="Ben" /></span>
+    <span class="crayons-avatar"><img src="<%= SiteConfig.mascot_image_url %>" class="crayons-avatar__image" alt="Ben" /></span>
+    <span class="crayons-avatar crayons-avatar--l"><img src="<%= SiteConfig.mascot_image_url %>" class="crayons-avatar__image" alt="Ben" /></span>
+    <span class="crayons-avatar crayons-avatar--xl"><img src="<%= SiteConfig.mascot_image_url %>" class="crayons-avatar__image" alt="Ben" /></span>
+    <span class="crayons-avatar crayons-avatar--2xl"><img src="<%= SiteConfig.mascot_image_url %>" class="crayons-avatar__image" alt="Ben" /></span>
+    <span class="crayons-avatar crayons-avatar--3xl"><img src="<%= SiteConfig.mascot_image_url %>" class="crayons-avatar__image" alt="Ben" /></span>
   </div>
 
   <pre><%= '

spec/system/comments/user_fills_out_comment_spec.rb

@@ -93,7 +93,7 @@ RSpec.describe "Creating Comment", type: :system, js: true do
 
     attach_file(
       "image-upload-main",
-      Rails.root.join("app/assets/images/sloan.png"),
+      Rails.root.join("app/assets/images/apple-icon.png"),
       visible: :hidden,
     )
 
@@ -109,7 +109,7 @@ RSpec.describe "Creating Comment", type: :system, js: true do
 
     attach_file(
       "image-upload-main",
-      Rails.root.join("app/assets/images/sloan.png"),
+      Rails.root.join("app/assets/images/onboarding-background.png"),
       visible: :hidden,
     )
 
@@ -118,7 +118,7 @@ RSpec.describe "Creating Comment", type: :system, js: true do
     expect(page).to have_css("div.file-upload-error")
     expect(page).to have_css(
       "div.file-upload-error",
-      text: "File size too large (0.29 MB). The limit is 0 MB.",
+      text: "File size too large (0.07 MB). The limit is 0 MB.",
     )
   end
 
@@ -131,7 +131,7 @@ RSpec.describe "Creating Comment", type: :system, js: true do
 
     attach_file(
       "image-upload-main",
-      Rails.root.join("app/assets/images/sloan.png"),
+      Rails.root.join("app/assets/images/apple-icon.png"),
       visible: :hidden,
     )
 
@@ -151,7 +151,7 @@ RSpec.describe "Creating Comment", type: :system, js: true do
 
     attach_file(
       "image-upload-main",
-      Rails.root.join("app/assets/images/sloan.png"),
+      Rails.root.join("app/assets/images/apple-icon.png"),
       visible: :hidden,
     )