@bento-core/query-bar 1.0.1-icdc.3 → 1.0.1-ins.0

package/README.md

@@ -58,16 +58,6 @@ const CONFIG = {
      * @var {number}
      */
     maxItems: 2,
-    /**
-     * overirdes maxItems to display all the active filter items
-     * @var {boolean}
-     */
-    displayAllActiveFilters: false,
-    /**
-     * key to access label text
-     * @var {boolean}
-     */
-    group: 'group',
   },
 
   /* Component Helper Functions */

package/dist/generators/QueryBarGenerator.js

@@ -38,10 +38,8 @@ const QueryBarGenerator = function QueryBarGenerator() {
   const styles = () => _objectSpread(_objectSpread({}, (0, _styles.default)()), customStyles);
   const maxItems = config && typeof config.maxItems === 'number' ? config.maxItems : _config.default.config.maxItems;
   const displayAllActiveFilters = config && typeof config.displayAllActiveFilters === 'boolean' ? config.displayAllActiveFilters : _config.default.config.displayAllActiveFilters;
-
-  // const group = config && typeof config.group === 'string'
-  //   ? config.group : DEFAULT_CONFIG.config.group;
-
+  const group = config && typeof config.group === 'string' ? config.group : _config.default.config.group;
+  const count = config && typeof config.count === 'string' ? config.count : _config.default.config.count;
   const clearAll = functions && typeof functions.clearAll === 'function' ? functions.clearAll : _config.default.functions.clearAll;
   const clearUpload = functions && typeof functions.clearUpload === 'function' ? functions.clearUpload : _config.default.functions.clearUpload;
   const clearAutocomplete = functions && typeof functions.clearAutocomplete === 'function' ? functions.clearAutocomplete : _config.default.functions.clearAutocomplete;
@@ -80,6 +78,7 @@ const QueryBarGenerator = function QueryBarGenerator() {
           return facet;
         }
         const {
+          data,
           items
         } = facet;
         const itemKeys = Object.keys(items);
@@ -87,19 +86,29 @@ const QueryBarGenerator = function QueryBarGenerator() {
 
         /* Find any SELECTED CHECKBOXES that do NOT have any data
          * and remove them from the list of selected checkboxes artificially */
-        // itemKeys.forEach((item) => {
-        //   if (data.findIndex((d) => d.group === item) < 0) {
-        //     itemKeys.splice(itemKeys.indexOf(item), 1);
-        //   }
-        // });
-
+        itemKeys.forEach(item => {
+          if (data.findIndex(d => d.group === item) < 0) {
+            itemKeys.splice(itemKeys.indexOf(item), 1);
+          }
+        });
+        // return { ...facet, items: itemKeys };
         /**
-        * commenting out line 89-93
-        * to display all the active filters in the query bar
-        * ICDC-3287
+        * Maintain consistant behavior with facet filter component
+        * Display the active filter items based on the count value
+        * Display active filter items in query bar only if count is greater than 0
+        * behavior similar to filter component
         */
+        // const { group, count } = config;
+        const displayItems = itemKeys.reduce((accumulator, item) => {
+          const itemList = data.filter(d => d[group] === item && d[count] > 0) || [];
+          if (itemList.length > 0) {
+            const labels = itemList.map(filter => filter[group]);
+            accumulator.push(labels);
+          }
+          return accumulator;
+        }, []);
         return _objectSpread(_objectSpread({}, facet), {}, {
-          items: itemKeys
+          items: displayItems
         });
       }).filter(facet => facet.items.length > 0);
       if ((mappedInputs.length || autocomplete.length || upload.length) <= 0) {

package/dist/generators/config.js

@@ -22,7 +22,12 @@ var _default = {
      * key to access label text
      * @var {boolean}
      */
-    group: 'group'
+    group: 'group',
+    /**
+     * key to access count value
+     * @var {boolean}
+     */
+    count: 'subjects'
   },
   /* Component Helper Functions */
   functions: {

package/dist/generators/styles.js

@@ -92,10 +92,10 @@ var _default = () => ({
   localFindBackground: {
     backgroundColor: '#C0E9D7'
   },
-  facetSectionCases: {
+  facetSectionProjects: {
     color: '#10A075'
   },
-  facetSectionCasesBackground: {
+  facetSectionProjectsBackground: {
     backgroundColor: '#C0E9D7'
   },
   facetSectionFiles: {

package/package.json

@@ -1,14 +1,17 @@
 {
   "name": "@bento-core/query-bar",
-  "version": "1.0.1-icdc.3",
-  "description": "",
+  "version": "1.0.1-ins.0",
+  "description": "This package provides the Query Bar component that displays the current Facet Search and Local Find filters on the Dashboard/Explore page. It also provides the direct ability to reset all or some of the filters with the click of a button. It is designed to be implemented directly with the:",
   "main": "dist/index.js",
   "scripts": {
     "build": "npm run lint && cross-env-shell rm -rf dist && NODE_ENV=production BABEL_ENV=es babel src --out-dir dist --copy-files",
     "test": "echo \"Error: no test specified\" && exit 1",
     "lint": "eslint src"
   },
-  "repository": "https://github.com/CBIIT/bento-frontend",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/CBIIT/bento-frontend.git"
+  },
   "publishConfig": {
     "access": "public"
   },
@@ -24,5 +27,9 @@
     "lodash": "^4.17.20"
   },
   "author": "CTOS Bento Team",
-  "license": "ISC"
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/CBIIT/bento-frontend/issues"
+  },
+  "homepage": "https://github.com/CBIIT/bento-frontend#readme"
 }

package/src/generators/QueryBarGenerator.js

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { withStyles, Button } from '@material-ui/core';
+// eslint-disable-next-line import/no-unresolved
 import { InputTypes } from '@bento-core/facet-filter';
 import clsx from 'clsx';
 import { Filter } from '../components/FilterMap';
@@ -27,8 +28,11 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
     ? config.displayAllActiveFilters
     : DEFAULT_CONFIG.config.displayAllActiveFilters;
 
-  // const group = config && typeof config.group === 'string'
-  //   ? config.group : DEFAULT_CONFIG.config.group;
+  const group = config && typeof config.group === 'string'
+    ? config.group : DEFAULT_CONFIG.config.group;
+
+  const count = config && typeof config.count === 'string'
+    ? config.count : DEFAULT_CONFIG.config.count;
 
   const clearAll = functions && typeof functions.clearAll === 'function'
     ? functions.clearAll
@@ -80,24 +84,35 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
         .map((facet) => {
           if (facet.type !== CHECKBOX) { return facet; }
 
-          const { items } = facet;
+          const { data, items } = facet;
           const itemKeys = Object.keys(items);
           itemKeys.sort((a, b) => a.localeCompare(b));
 
           /* Find any SELECTED CHECKBOXES that do NOT have any data
            * and remove them from the list of selected checkboxes artificially */
-          // itemKeys.forEach((item) => {
-          //   if (data.findIndex((d) => d.group === item) < 0) {
-          //     itemKeys.splice(itemKeys.indexOf(item), 1);
-          //   }
-          // });
-
+          itemKeys.forEach((item) => {
+            if (data.findIndex((d) => d.group === item) < 0) {
+              itemKeys.splice(itemKeys.indexOf(item), 1);
+            }
+          });
+          // return { ...facet, items: itemKeys };
           /**
-          * commenting out line 89-93
-          * to display all the active filters in the query bar
-          * ICDC-3287
+          * Maintain consistant behavior with facet filter component
+          * Display the active filter items based on the count value
+          * Display active filter items in query bar only if count is greater than 0
+          * behavior similar to filter component
           */
-          return { ...facet, items: itemKeys };
+          // const { group, count } = config;
+          const displayItems = itemKeys.reduce((accumulator, item) => {
+            const itemList = data.filter((d) => (d[group] === item && d[count] > 0)) || [];
+            if (itemList.length > 0) {
+              const labels = itemList.map((filter) => filter[group]);
+              accumulator.push(labels);
+            }
+            return accumulator;
+          }, []);
+
+          return { ...facet, items: displayItems };
         })
         .filter((facet) => facet.items.length > 0);
 

package/src/generators/config.js

@@ -17,6 +17,11 @@ export default {
      * @var {boolean}
      */
     group: 'group',
+    /**
+     * key to access count value
+     * @var {boolean}
+     */
+    count: 'subjects',
   },
 
   /* Component Helper Functions */

package/src/generators/styles.js

@@ -86,10 +86,10 @@ export default () => ({
   localFindBackground: {
     backgroundColor: '#C0E9D7',
   },
-  facetSectionCases: {
+  facetSectionProjects: {
     color: '#10A075',
   },
-  facetSectionCasesBackground: {
+  facetSectionProjectsBackground: {
     backgroundColor: '#C0E9D7',
   },
   facetSectionFiles: {