Changed the javascript class from using the global scope to exporting it via webpack

Also improved accesibility and change the id from user_callouts to a class

1 files changed, 24 insertions, 26 deletions

diff --git a/app/assets/javascripts/user_callout.js b/app/assets/javascripts/user_callout.js
index 5d10bfc8290..85f85674e59 100644
--- a/app/assets/javascripts/user_callout.js
+++ b/app/assets/javascripts/user_callout.js
@@ -1,37 +1,35 @@
 /* eslint-disable arrow-parens, class-methods-use-this, no-param-reassign */
 /* global Cookies */
 
-((global) => {
-  const userCalloutElementName = '#user-callout';
-  const dismissIcon = '.dismiss-icon';
-  const userCalloutBtn = '.user-callout-btn';
+const userCalloutElementName = '.user-callout';
+const dismissIcon = '.dismiss-icon';
+const userCalloutBtn = '.user-callout-btn';
 
-  const USER_CALLOUT_COOKIE = 'user_callout_dismissed';
+const USER_CALLOUT_COOKIE = 'user_callout_dismissed';
 
-  class UserCallout {
-    constructor() {
-      this.isCalloutDismissed = Cookies.get(USER_CALLOUT_COOKIE);
-      this.init();
-    }
+class UserCallout {
+  constructor() {
+    this.isCalloutDismissed = Cookies.get(USER_CALLOUT_COOKIE);
+    this.init();
+    this.isUserCalloutDismissed();
+  }
 
-    init() {
-      $(document)
-        .on('click', dismissIcon, () => this.closeAndDismissCallout())
-        .on('click', userCalloutBtn, () => this.closeAndDismissCallout())
-        .on('DOMContentLoaded', () => this.isUserCalloutDismissed());
-    }
+  init() {
+    $(document)
+      .on('click', dismissIcon, () => this.closeAndDismissCallout())
+      .on('click', userCalloutBtn, () => this.closeAndDismissCallout());
+  }
 
-    closeAndDismissCallout() {
-      $(userCalloutElementName).hide();
-      Cookies.set(USER_CALLOUT_COOKIE, '1');
-    }
+  closeAndDismissCallout() {
+    $(userCalloutElementName).hide();
+    Cookies.set(USER_CALLOUT_COOKIE, '1');
+  }
 
-    isUserCalloutDismissed() {
-      if (!this.isCalloutDismissed) {
-        $(userCalloutElementName).show();
-      }
+  isUserCalloutDismissed() {
+    if (!this.isCalloutDismissed) {
+      $(userCalloutElementName).show();
     }
   }
+}
 
-  global.UserCallout = UserCallout;
-})(window.gl || (window.gl = {}));
+module.exports = UserCallout;