REFACTOR: Remove `Discourse.SvgIconList` and `Discourse.SvgSpritePath`

We use the session instead. This patch also removes some jQuery usage in
favor of regular HTML apis

app/assets/javascripts/discourse-common/addon/lib/icon-library.js

@@ -1,7 +1,7 @@
 import I18n from "I18n";
 import { h } from "virtual-dom";
 import attributeHook from "discourse-common/lib/attribute-hook";
-import { isDevelopment } from "discourse-common/config/environment";
+import Session from "discourse/models/session";
 
 const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
 let _renderers = [];
@@ -111,14 +111,11 @@ function iconClasses(icon, params) {
 }
 
 function warnIfMissing(id) {
-  if (
+  if (warnMissingIcons) {
-    typeof Discourse !== "undefined" &&
+    let iconList = Session.currentProp("svgIconList");
-    isDevelopment() &&
+    if (iconList.indexOf(id) === -1) {
-    warnMissingIcons &&
+      console.warn(`The icon "${id}" is missing from the SVG subset.`); // eslint-disable-line no-console
-    Discourse.SvgIconList &&
+    }
-    Discourse.SvgIconList.indexOf(id) === -1
-  ) {
-    console.warn(`The icon "${id}" is missing from the SVG subset.`); // eslint-disable-line no-console
   }
 }
 

app/assets/javascripts/discourse/app/lib/svg-sprite-loader.js

@@ -1,21 +1,25 @@
 import loadScript from "discourse/lib/load-script";
 
-export default {
+const SVG_CONTAINER_ID = "svg-sprites";
-  name: "svg-sprite-loader",
-  load(spritePath, spriteName) {
-    const c = "svg-sprites";
-    const $cEl = `#${c}`;
-    const $spriteEl = `${$cEl} .${spriteName}`;
 
-    if ($($cEl).length === 0) $("body").append(`<div id="${c}">`);
+export function loadSprites(spritePath, spriteName) {
-
+  let spriteContainer = document.getElementById(SVG_CONTAINER_ID);
-    if ($($spriteEl).length === 0)
+  if (!spriteContainer) {
-      $($cEl).append(`<div class="${spriteName}">`);
+    spriteContainer = document.createElement("div");
-
+    spriteContainer.id = SVG_CONTAINER_ID;
-    loadScript(spritePath).then(() => {
+    document.body.appendChild(spriteContainer);
-      $($spriteEl).html(window.__svg_sprite);
-      // we got to clean up here... this is one giant string
-      delete window.__svg_sprite;
-    });
   }
-};
+
+  let sprites = spriteContainer.querySelector(`.${spriteName}`);
+  if (!sprites) {
+    sprites = document.createElement("div");
+    sprites.className = spriteName;
+    spriteContainer.appendChild(sprites);
+  }
+
+  loadScript(spritePath).then(() => {
+    sprites.innerHTML = window.__svg_sprite;
+    // we got to clean up here... this is one giant string
+    delete window.__svg_sprite;
+  });
+}

app/assets/javascripts/discourse/app/pre-initializers/discourse-bootstrap.js

@@ -5,7 +5,8 @@ import RSVP from "rsvp";
 import {
   setEnvironment,
   isTesting,
-  isProduction
+  isProduction,
+  isDevelopment
 } from "discourse-common/config/environment";
 import { setupURL, setupS3CDN } from "discourse-common/lib/get-url";
 import deprecated from "discourse-common/lib/deprecated";
@@ -82,10 +83,10 @@ export default {
     }
 
     app.HighlightJSPath = setupData.highlightJsPath;
-    app.SvgSpritePath = setupData.svgSpritePath;
+    Session.currentProp("svgSpritePath", setupData.svgSpritePath);
 
-    if (app.Environment === "development") {
+    if (isDevelopment()) {
-      app.SvgIconList = setupData.svgIconList;
+      Session.currentProp("svgIconList", setupData.svgIconList);
     }
 
     if (setupData.s3BaseUrl) {

app/assets/javascripts/discourse/app/pre-initializers/svg-sprite-fontawesome.js

@@ -1,11 +1,12 @@
-import svgSpriteLoader from "discourse/lib/svg-sprite-loader";
+import { loadSprites } from "discourse/lib/svg-sprite-loader";
 
 export default {
   name: "svg-sprite-fontawesome",
 
-  initialize() {
+  initialize(container) {
-    if (Discourse && Discourse.SvgSpritePath) {
+    let session = container.lookup("session:main");
-      svgSpriteLoader.load(Discourse.SvgSpritePath, "fontawesome");
+    if (session.svgSpritePath) {
+      loadSprites(session.svgSpritePath, "fontawesome");
     }
   }
 };