[PostReplacements] Add a DNP notice (#776)

app/javascript/src/javascripts/utility/storage.js

@@ -8,6 +8,8 @@ LStorage.get = function (name) {
 };
 LStorage.getObject = function (name) {
   const value = this.get(name);
+  if (!value) return null;
+
   try {
     return JSON.parse(value);
   } catch (error) {

app/javascript/src/styles/specific/post_replacements.scss

@@ -32,4 +32,8 @@ div#c-post-replacements {
     font-weight: bold;
     width: fit-content;
   }
+
+  #avoid-posting-notice ul {
+    margin-left: 1em;
+  }
 }

app/javascript/src/styles/specific/posts.scss

@@ -331,30 +331,6 @@ div#c-posts {
       }
     }
 
-    div#avoid-posting-notice {
-      font-size: 1.25rem;
-      line-height: 1.5rem;
-      padding: $padding-025 $padding-050;
-
-      background-color: themed("color-section");
-      border: 1px solid themed("color-foreground");
-
-      ul {
-        list-style: disc;
-      }
-
-      li {
-        .artist, .separator, .details {
-          display: table-cell;
-        }
-
-        .separator {
-          color: var(--color-text-muted);
-          padding: 0 0.3rem;
-        }
-      }
-    }
-
     div.quick-mod {
 
       .quick-mod-group {
@@ -453,6 +429,30 @@ div#c-posts {
   }
 }
 
+div#avoid-posting-notice {
+  font-size: 1.25rem;
+  line-height: 1.5rem;
+  padding: $padding-025 $padding-050;
+
+  background-color: themed("color-section");
+  border: 1px solid themed("color-foreground");
+
+  ul {
+    list-style: disc;
+  }
+
+  li {
+    .artist, .separator, .details {
+      display: table-cell;
+    }
+
+    .separator {
+      color: var(--color-text-muted);
+      padding: 0 0.3rem;
+    }
+  }
+}
+
 div#c-post-versions, div#c-artist-versions {
   div#a-index {
     a {

app/views/post_replacements/_new.html.erb

@@ -10,6 +10,9 @@
     <div><%= "#{post.image_width}x#{post.image_height} (#{post.file_size.to_fs(:human_size, precision: 5)})" %></div>
   </div>
   <br>
+  
+  <%= render "posts/partials/show/avoid_posting", post: post %>
+  <br />
   <div id="replacement-uploader" class="simple_form"></div>
 </div>