fix(js): Apply fixes suggested by CoPilot.

- Fix inverted logic from previous commit in feature-callouts.js
- Pass  to other functions in flux-group-keys.js

assets/js/feature-callouts.js

@@ -2,8 +2,7 @@
   This feature is designed to callout new features added to the documentation
   CSS is required for the callout bubble to determine look and position, but the
   element must have the `callout` class and a unique id.
-  Callouts are treated as notifications and use the notification cookie API in
+  Callouts are treated as notifications and use the LocalStorage notification API.
-  assets/js/cookies.js.
 */
 
 import $ from 'jquery';
@@ -14,19 +13,11 @@ function getCalloutID(el) {
   return $(el).attr('id');
 }
 
-// Hide a callout and update the cookie with the viewed callout
-function hideCallout(calloutID) {
-  if (!LocalStorageAPI.notificationIsRead(calloutID)) {
-    LocalStorageAPI.setNotificationAsRead(calloutID, 'callout');
-    $(`#${calloutID}`).fadeOut(200);
-  }
-}
-
 // Show the url feature callouts on page load
 export default function FeatureCallout({ component }) {
   const calloutID = getCalloutID($(component));
 
-  if (LocalStorageAPI.notificationIsRead(calloutID, 'callout')) {
+  if (!LocalStorageAPI.notificationIsRead(calloutID, 'callout')) {
     $(`#${calloutID}.feature-callout`)
       .fadeIn(300)
       .removeClass('start-position');

assets/js/flux-group-keys.js

@@ -240,8 +240,8 @@ function toggleCheckbox(element) {
 }
 
 // Build example group function
-function buildGroupExample() {
+function buildGroupExample($component) {
-  var columnCollection = getChecked()
+  var columnCollection = getChecked($component)
     .map((i) => '<span class=\"s2\">"' + i + '"</span>')
     .join(', ');
   $('pre#group-by-example')[0].innerHTML =