Removed disabled rules from the user_callout_spec.js

Also changed the cookie sets to true and false values to make
it consistent with the rest of the javascript.

Fixed some haml and a missing new line

app/assets/javascripts/user_callout.js

-/* eslint-disable arrow-parens, class-methods-use-this, no-param-reassign */
+/* eslint-disable class-methods-use-this */
 /* global Cookies */
 const userCalloutElementName = '.user-callout';
@@ -11,21 +11,20 @@ class UserCallout {
   constructor() {
     this.isCalloutDismissed = Cookies.get(USER_CALLOUT_COOKIE);
     this.init();
-    this.isUserCalloutDismissed();
+    this.toggleUserCallout();
   }
   init() {
     $(document)
-      .on('click', closeButton, () => this.closeAndDismissCallout())
-      .on('click', userCalloutBtn, () => this.closeAndDismissCallout());
+      .on('click', closeButton, () => this.dismissCallout())
+      .on('click', userCalloutBtn, () => this.dismissCallout());
   }
-  closeAndDismissCallout() {
-    $(userCalloutElementName).hide();
-    Cookies.set(USER_CALLOUT_COOKIE, '1');
+  dismissCallout() {
+    Cookies.set(USER_CALLOUT_COOKIE, 'true');
   }
-  isUserCalloutDismissed() {
+  toggleUserCallout() {
     if (!this.isCalloutDismissed) {
       $(userCalloutElementName).show();
     }

app/views/shared/icons/_icon_customization.svg

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112 90" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="none" fill-rule="evenodd"><rect width="112" height="90" fill="#fff" rx="6"/><path fill="#eee" fill-rule="nonzero" d="m4 6.01v77.98c0 1.11.899 2.01 2 2.01h100c1.105 0 2-.898 2-2.01v-77.98c0-1.11-.899-2.01-2-2.01h-100c-1.105 0-2 .898-2 2.01m-4 0c0-3.319 2.686-6.01 6-6.01h100c3.315 0 6 2.694 6 6.01v77.98c0 3.319-2.686 6.01-6 6.01h-100c-3.315 0-6-2.694-6-6.01v-77.98"/><g transform="translate(26 35)"><rect width="4" height="39" x="5" fill="#eee" rx="2" id="0"/><rect width="4" height="21" x="5" y="18" fill="#fef0ea" rx="2"/><circle cx="7" cy="13" r="5" fill="#fff"/><path fill="#fb722e" fill-rule="nonzero" d="m7 20c-3.866 0-7-3.134-7-7 0-3.866 3.134-7 7-7 3.866 0 7 3.134 7 7 0 3.866-3.134 7-7 7m0-4c1.657 0 3-1.343 3-3 0-1.657-1.343-3-3-3-1.657 0-3 1.343-3 3 0 1.657 1.343 3 3 3"/></g><g transform="translate(49 35)"><use xlink:href="#0"/><rect width="4" height="21" x="5" y="18" fill="#b5a7dd" rx="2"/><circle cx="7" cy="25" r="5" fill="#fff"/><path fill="#6b4fbb" fill-rule="nonzero" d="m7 32c-3.866 0-7-3.134-7-7 0-3.866 3.134-7 7-7 3.866 0 7 3.134 7 7 0 3.866-3.134 7-7 7m0-4c1.657 0 3-1.343 3-3 0-1.657-1.343-3-3-3-1.657 0-3 1.343-3 3 0 1.657 1.343 3 3 3"/></g><g transform="translate(72 33)"><rect width="4" height="39" x="5" y="2" fill="#eee" rx="2"/><rect width="4" height="34" x="5" y="7" fill="#fef0ea" rx="2"/><circle cx="7" cy="7" r="5" fill="#fff"/><path fill="#fb722e" fill-rule="nonzero" d="m7 14c-3.866 0-7-3.134-7-7 0-3.866 3.134-7 7-7 3.866 0 7 3.134 7 7 0 3.866-3.134 7-7 7m0-4c1.657 0 3-1.343 3-3 0-1.657-1.343-3-3-3-1.657 0-3 1.343-3 3 0 1.657 1.343 3 3 3"/></g><g fill="#6b4fbb"><circle cx="13.5" cy="11.5" r="2.5"/><circle cx="23.5" cy="11.5" r="2.5" opacity=".5"/><circle cx="33.5" cy="11.5" r="2.5" opacity=".5"/></g><path fill="#eee" d="m0 19h111v4h-111z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112 90" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="none" fill-rule="evenodd"><rect width="112" height="90" fill="#fff" rx="6"/><path fill="#eee" fill-rule="nonzero" d="m4 6.01v77.98c0 1.11.899 2.01 2 2.01h100c1.105 0 2-.898 2-2.01v-77.98c0-1.11-.899-2.01-2-2.01h-100c-1.105 0-2 .898-2 2.01m-4 0c0-3.319 2.686-6.01 6-6.01h100c3.315 0 6 2.694 6 6.01v77.98c0 3.319-2.686 6.01-6 6.01h-100c-3.315 0-6-2.694-6-6.01v-77.98"/><g transform="translate(26 35)"><rect width="4" height="39" x="5" fill="#eee" rx="2" id="0"/><rect width="4" height="21" x="5" y="18" fill="#fef0ea" rx="2"/><circle cx="7" cy="13" r="5" fill="#fff"/><path fill="#fb722e" fill-rule="nonzero" d="m7 20c-3.866 0-7-3.134-7-7 0-3.866 3.134-7 7-7 3.866 0 7 3.134 7 7 0 3.866-3.134 7-7 7m0-4c1.657 0 3-1.343 3-3 0-1.657-1.343-3-3-3-1.657 0-3 1.343-3 3 0 1.657 1.343 3 3 3"/></g><g transform="translate(49 35)"><use xlink:href="#0"/><rect width="4" height="21" x="5" y="18" fill="#b5a7dd" rx="2"/><circle cx="7" cy="25" r="5" fill="#fff"/><path fill="#6b4fbb" fill-rule="nonzero" d="m7 32c-3.866 0-7-3.134-7-7 0-3.866 3.134-7 7-7 3.866 0 7 3.134 7 7 0 3.866-3.134 7-7 7m0-4c1.657 0 3-1.343 3-3 0-1.657-1.343-3-3-3-1.657 0-3 1.343-3 3 0 1.657 1.343 3 3 3"/></g><g transform="translate(72 33)"><rect width="4" height="39" x="5" y="2" fill="#eee" rx="2"/><rect width="4" height="34" x="5" y="7" fill="#fef0ea" rx="2"/><circle cx="7" cy="7" r="5" fill="#fff"/><path fill="#fb722e" fill-rule="nonzero" d="m7 14c-3.866 0-7-3.134-7-7 0-3.866 3.134-7 7-7 3.866 0 7 3.134 7 7 0 3.866-3.134 7-7 7m0-4c1.657 0 3-1.343 3-3 0-1.657-1.343-3-3-3-1.657 0-3 1.343-3 3 0 1.657 1.343 3 3 3"/></g><g fill="#6b4fbb"><circle cx="13.5" cy="11.5" r="2.5"/><circle cx="23.5" cy="11.5" r="2.5" opacity=".5"/><circle cx="33.5" cy="11.5" r="2.5" opacity=".5"/></g><path fill="#eee" d="m0 19h111v4h-111z"/></g></svg>

app/views/users/show.html.haml

@@ -96,10 +96,9 @@
       %li.js-snippets-tab
         = link_to user_snippets_path, data: {target: 'div#snippets', action: 'snippets', toggle: 'tab'} do
           Snippets
-
+    
   %div{ class: container_class }
     = render partial: 'shared/user_callout'
-  %div{ class: container_class }
     .tab-content
       #activity.tab-pane
         .row-content-block.calender-block.white.second-block.hidden-xs

spec/javascripts/user_callout_spec.js

-/* esint-disable space-before-function-paren, arrow-body-style */
 const UserCallout = require('~/user_callout');
 const USER_CALLOUT_COOKIE = 'user_callout_dismissed';
@@ -14,7 +13,7 @@ describe('UserCallout', function () {
     this.closeButton = $('.close-user-callout');
     this.userCalloutContainer = $('.user-callout');
     this.userCalloutBtn = $('.user-callout-btn');
-    Cookie.set(USER_CALLOUT_COOKIE, 0);
+    Cookie.set(USER_CALLOUT_COOKIE, 'false');
   });
   it('shows when cookie is set to false', () => {
@@ -24,13 +23,11 @@ describe('UserCallout', function () {
   it('hides when user clicks on the dismiss-icon', () => {
     this.closeButton.click();
-    expect(this.userCalloutContainer.is(':visible')).toBe(false);
-    expect(Cookie.get(USER_CALLOUT_COOKIE)).toBe('1');
+    expect(Cookie.get(USER_CALLOUT_COOKIE)).toBe('true');
   });
   it('hides when user clicks on the "check it out" button', () => {
     this.userCalloutBtn.click();
-    expect(this.userCalloutContainer.is(':visible')).toBe(false);
-    expect(Cookie.get(USER_CALLOUT_COOKIE)).toBe('1');
+    expect(Cookie.get(USER_CALLOUT_COOKIE)).toBe('true');
   });
 });