@coorpacademy/components 11.32.20-alpha.38.37 → 11.32.20-alpha.40

package/es/molecule/learning-priority-modal/index.d.ts

@@ -14,16 +14,13 @@ declare namespace LearningPriorityModal {
         const preselected: PropTypes.Requireable<(string | null | undefined)[]>;
         const isOpen: PropTypes.Requireable<boolean>;
         const isLoading: PropTypes.Requireable<boolean>;
-        const filters: PropTypes.Requireable<PropTypes.InferProps<{
-            onChange: PropTypes.Requireable<(...args: any[]) => any>;
-            options: PropTypes.Requireable<(PropTypes.InferProps<{
-                count: PropTypes.Requireable<number>;
-                name: PropTypes.Validator<string>;
-                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                selected: PropTypes.Requireable<boolean>;
-                validOption: PropTypes.Requireable<boolean>;
-            }> | null | undefined)[]>;
-        }>>;
+        const filters: PropTypes.Requireable<(PropTypes.InferProps<{
+            count: PropTypes.Requireable<number>;
+            name: PropTypes.Validator<string>;
+            value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+            selected: PropTypes.Requireable<boolean>;
+            validOption: PropTypes.Requireable<boolean>;
+        }> | null | undefined)[]>;
         const onCancel: PropTypes.Requireable<(...args: any[]) => any>;
         const onAdd: PropTypes.Requireable<(...args: any[]) => any>;
         const onClose: PropTypes.Requireable<(...args: any[]) => any>;

package/es/molecule/learning-priority-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-modal/index.js"],"names":[],"mappings":";AAgEA,qFAyJC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-modal/index.js"],"names":[],"mappings":";AAgEA,qFAkKC"}

package/es/molecule/learning-priority-modal/index.js

@@ -68,10 +68,7 @@ const LearningPriorityModal = (props, context) => {
     preselected,
     isOpen,
     isLoading,
-    filters: {
-      options,
-      onChange
-    },
+    filters,
     onCancel,
     onAdd,
     onClose
@@ -80,16 +77,20 @@ const LearningPriorityModal = (props, context) => {
     translate
   } = context;
   const [selectedPriority, setSelectedPriority] = useState('');
+  const [selectedPriorityType, setSelectedPriorityType] = useState('');
   const [searchValue, setSearchValue] = useState('');
+  const [filterValue, setFilterValue] = useState('all');
   const [searchResults, setSearchResults] = useState(priorities);
   const handleCancel = useCallback(() => {
     setSelectedPriority('');
+    setSelectedPriorityType('');
     onCancel();
-  }, [setSelectedPriority, onCancel]);
+  }, [setSelectedPriority, setSelectedPriorityType, onCancel]);
   const handleClose = useCallback(() => {
     setSelectedPriority('');
+    setSelectedPriorityType('');
     onClose();
-  }, [setSelectedPriority, onClose]);
+  }, [setSelectedPriority, setSelectedPriorityType, onClose]);
   const handleSearch = useCallback(value => {
     setSearchValue(value);
     setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));
@@ -118,7 +119,9 @@ const LearningPriorityModal = (props, context) => {
       },
       confirmButton: {
         onConfirm: () => {
-          onAdd(selectedPriority);
+          onAdd(selectedPriority, selectedPriorityType);
+          setSelectedPriority('');
+          setSelectedPriorityType('');
           onClose();
         },
         label: translate('add'),
@@ -126,7 +129,7 @@ const LearningPriorityModal = (props, context) => {
         disabled: isLoading || !selectedPriority
       }
     };
-  }, [handleCancel, onAdd, translate, selectedPriority, isLoading]);
+  }, [handleCancel, setSelectedPriority, setSelectedPriorityType, onAdd, translate, selectedPriority, selectedPriorityType, isLoading]);
   if (!isLoading && !priorities || !isOpen) return null;
   return /*#__PURE__*/React.createElement(BaseModal, {
     title: translate('learning_priority_modal_title'),
@@ -152,16 +155,15 @@ const LearningPriorityModal = (props, context) => {
     onReset: handleSearchReset
   })), /*#__PURE__*/React.createElement("div", {
     className: style.filterWrapper
-  }, searchResults.length > 0 ? options.map((filter, index) => {
+  }, searchResults.length > 0 ? filters.map((filter, index) => {
     const {
       name,
       value,
-      selected,
       count
     } = filter;
 
     function handleChange() {
-      onChange(value);
+      setFilterValue(value);
       handleSearchReset();
     }
 
@@ -170,7 +172,7 @@ const LearningPriorityModal = (props, context) => {
       key: index,
       className: style.filterButtonWrapper
     }, /*#__PURE__*/React.createElement(FilterButton, {
-      active: selected,
+      active: filterValue === value,
       filter: name,
       onClick: handleChange,
       itemTotal: count
@@ -189,8 +191,10 @@ const LearningPriorityModal = (props, context) => {
 
     function handlePriorityClick() {
       setSelectedPriority(priorityRef);
+      setSelectedPriorityType(type);
     }
 
+    if (filterValue !== 'all' && type !== filterValue) return null;
     return /*#__PURE__*/React.createElement(ListItem, _extends({}, courses !== null ? {
       subtitle: `${courses} ${translate('courses')}`
     } : {}, {
@@ -221,12 +225,9 @@ LearningPriorityModal.propTypes = process.env.NODE_ENV !== "production" ? {
   preselected: PropTypes.arrayOf(PropTypes.string),
   isOpen: PropTypes.bool,
   isLoading: PropTypes.bool,
-  filters: PropTypes.shape({
-    onChange: PropTypes.func,
-    options: PropTypes.arrayOf(PropTypes.shape(_extends({}, SelectOptionPropTypes, {
-      count: PropTypes.number
-    })))
-  }),
+  filters: PropTypes.arrayOf(PropTypes.shape(_extends({}, SelectOptionPropTypes, {
+    count: PropTypes.number
+  }))),
   onCancel: PropTypes.func,
   onAdd: PropTypes.func,
   onClose: PropTypes.func

package/es/molecule/learning-priority-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useEffect","useMemo","useState","useCallback","PropTypes","convert","BaseModal","ListItem","ButtonLink","Loader","Provider","SelectOptionPropTypes","SearchForm","searchValueIncluded","style","FilterButton","props","context","active","filter","itemTotal","onClick","skin","primarySkinColor","Content","skillFilterNumber","skillFilterNumberInActive","backgroundColor","color","buttonProps","customStyle","transition","width","content","contextTypes","childContextTypes","translate","propTypes","bool","string","number","func","LearningPriorityModal","priorities","preselected","isOpen","isLoading","filters","options","onChange","onCancel","onAdd","onClose","selectedPriority","setSelectedPriority","searchValue","setSearchValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","title","handleSearchReset","priorityList","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","arrayOf","shape","oneOf"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport style from './style.css';\n\nconst FilterButton = (props, context) => {\n  const {active, filter, itemTotal, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const Content = useCallback(\n    () => (\n      <div>\n        {filter}\n        <span\n          className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n          style={{\n            backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n            color: active ? primarySkinColor : '#515161'\n          }}\n        >\n          {itemTotal}\n        </span>\n      </div>\n    ),\n    [filter, itemTotal, active, primarySkinColor]\n  );\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n      color: active ? primarySkinColor : '#9999A8',\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    onClick,\n    content: <Content />,\n    'data-name': 'change-skill-focus-button'\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nFilterButton.propTypes = {\n  active: PropTypes.bool,\n  filter: PropTypes.string,\n  itemTotal: PropTypes.number,\n  onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n  const {\n    priorities,\n    preselected,\n    isOpen,\n    isLoading,\n    filters: {options, onChange},\n    onCancel,\n    onAdd,\n    onClose\n  } = props;\n  const {translate} = context;\n\n  const [selectedPriority, setSelectedPriority] = useState('');\n  const [searchValue, setSearchValue] = useState('');\n  const [searchResults, setSearchResults] = useState(priorities);\n\n  const handleCancel = useCallback(() => {\n    setSelectedPriority('');\n    onCancel();\n  }, [setSelectedPriority, onCancel]);\n\n  const handleClose = useCallback(() => {\n    setSelectedPriority('');\n    onClose();\n  }, [setSelectedPriority, onClose]);\n\n  const handleSearch = useCallback(\n    value => {\n      setSearchValue(value);\n      setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n    },\n    [priorities, setSearchValue, setSearchResults]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    setSearchResults(priorities);\n  }, [priorities, setSearchValue, setSearchResults]);\n\n  useEffect(() => {\n    setSearchResults(priorities);\n  }, [priorities]);\n\n  const priorityList = useMemo(() => {\n    return searchResults.map(priority => {\n      const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n      return assign(\n        {\n          selected: isPreSelectedPriority,\n          disabled: isPreSelectedPriority\n        },\n        pick(['title', 'priorityRef', 'type', 'courses'], priority)\n      );\n    });\n  }, [searchResults, preselected]);\n\n  const footer = useMemo(() => {\n    return {\n      cancelButton: {\n        onCancel: handleCancel,\n        label: translate('cancel')\n      },\n      confirmButton: {\n        onConfirm: () => {\n          onAdd(selectedPriority);\n          onClose();\n        },\n        label: translate('add'),\n        iconName: 'plus',\n        disabled: isLoading || !selectedPriority\n      }\n    };\n  }, [handleCancel, onAdd, translate, selectedPriority, isLoading]);\n\n  if ((!isLoading && !priorities) || !isOpen) return null;\n\n  return (\n    <BaseModal\n      title={translate('learning_priority_modal_title')}\n      description={translate('learning_priority_modal_description')}\n      isOpen={isOpen}\n      onClose={handleClose}\n      footer={footer}\n    >\n      <div className={style.LearningPriorityContainer}>\n        {isLoading ? (\n          <div className={style.loaderContainer}>\n            <Loader className={style.loader} theme=\"coorpmanager\" />\n          </div>\n        ) : (\n          <>\n            <div className={style.searchWrapper}>\n              <SearchForm\n                search={{\n                  placeholder: translate('search_priority_place_holder'),\n                  value: searchValue,\n                  onChange: handleSearch\n                }}\n                onReset={handleSearchReset}\n              />\n            </div>\n            <div className={style.filterWrapper}>\n              {searchResults.length > 0\n                ? options.map((filter, index) => {\n                    const {name, value, selected, count} = filter;\n\n                    function handleChange() {\n                      onChange(value);\n                      handleSearchReset();\n                    }\n\n                    if (count === 0) return null;\n\n                    return (\n                      <div key={index} className={style.filterButtonWrapper}>\n                        <FilterButton\n                          active={selected}\n                          filter={name}\n                          onClick={handleChange}\n                          itemTotal={count}\n                        />\n                      </div>\n                    );\n                  })\n                : null}\n            </div>\n            <div className={style.priorityListWrapper}>\n              {priorityList.map(priority => {\n                const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n                function handlePriorityClick() {\n                  setSelectedPriority(priorityRef);\n                }\n\n                return (\n                  <ListItem\n                    {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n                    title={title}\n                    selected={selected || selectedPriority === priorityRef}\n                    disabled={disabled}\n                    onClick={handlePriorityClick}\n                    tags={[{label: type, type: 'default'}]}\n                    key={priorityRef}\n                    backgroundColor=\"skin\"\n                  />\n                );\n              })}\n            </div>\n          </>\n        )}\n      </div>\n    </BaseModal>\n  );\n};\n\nLearningPriorityModal.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      priorityRef: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n    })\n  ),\n  preselected: PropTypes.arrayOf(PropTypes.string),\n  isOpen: PropTypes.bool,\n  isLoading: PropTypes.bool,\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(\n      PropTypes.shape({\n        ...SelectOptionPropTypes,\n        count: PropTypes.number\n      })\n    )\n  }),\n  onCancel: PropTypes.func,\n  onAdd: PropTypes.func,\n  onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useEffect","useMemo","useState","useCallback","PropTypes","convert","BaseModal","ListItem","ButtonLink","Loader","Provider","SelectOptionPropTypes","SearchForm","searchValueIncluded","style","FilterButton","props","context","active","filter","itemTotal","onClick","skin","primarySkinColor","Content","skillFilterNumber","skillFilterNumberInActive","backgroundColor","color","buttonProps","customStyle","transition","width","content","contextTypes","childContextTypes","translate","propTypes","bool","string","number","func","LearningPriorityModal","priorities","preselected","isOpen","isLoading","filters","onCancel","onAdd","onClose","selectedPriority","setSelectedPriority","selectedPriorityType","setSelectedPriorityType","searchValue","setSearchValue","filterValue","setFilterValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","title","handleSearchReset","priorityList","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","onChange","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","arrayOf","shape","oneOf"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport style from './style.css';\n\nconst FilterButton = (props, context) => {\n  const {active, filter, itemTotal, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const Content = useCallback(\n    () => (\n      <div>\n        {filter}\n        <span\n          className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n          style={{\n            backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n            color: active ? primarySkinColor : '#515161'\n          }}\n        >\n          {itemTotal}\n        </span>\n      </div>\n    ),\n    [filter, itemTotal, active, primarySkinColor]\n  );\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n      color: active ? primarySkinColor : '#9999A8',\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    onClick,\n    content: <Content />,\n    'data-name': 'change-skill-focus-button'\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nFilterButton.propTypes = {\n  active: PropTypes.bool,\n  filter: PropTypes.string,\n  itemTotal: PropTypes.number,\n  onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n  const {priorities, preselected, isOpen, isLoading, filters, onCancel, onAdd, onClose} = props;\n  const {translate} = context;\n\n  const [selectedPriority, setSelectedPriority] = useState('');\n  const [selectedPriorityType, setSelectedPriorityType] = useState('');\n  const [searchValue, setSearchValue] = useState('');\n  const [filterValue, setFilterValue] = useState('all');\n  const [searchResults, setSearchResults] = useState(priorities);\n\n  const handleCancel = useCallback(() => {\n    setSelectedPriority('');\n    setSelectedPriorityType('');\n    onCancel();\n  }, [setSelectedPriority, setSelectedPriorityType, onCancel]);\n\n  const handleClose = useCallback(() => {\n    setSelectedPriority('');\n    setSelectedPriorityType('');\n    onClose();\n  }, [setSelectedPriority, setSelectedPriorityType, onClose]);\n\n  const handleSearch = useCallback(\n    value => {\n      setSearchValue(value);\n      setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n    },\n    [priorities, setSearchValue, setSearchResults]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    setSearchResults(priorities);\n  }, [priorities, setSearchValue, setSearchResults]);\n\n  useEffect(() => {\n    setSearchResults(priorities);\n  }, [priorities]);\n\n  const priorityList = useMemo(() => {\n    return searchResults.map(priority => {\n      const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n      return assign(\n        {\n          selected: isPreSelectedPriority,\n          disabled: isPreSelectedPriority\n        },\n        pick(['title', 'priorityRef', 'type', 'courses'], priority)\n      );\n    });\n  }, [searchResults, preselected]);\n\n  const footer = useMemo(() => {\n    return {\n      cancelButton: {\n        onCancel: handleCancel,\n        label: translate('cancel')\n      },\n      confirmButton: {\n        onConfirm: () => {\n          onAdd(selectedPriority, selectedPriorityType);\n          setSelectedPriority('');\n          setSelectedPriorityType('');\n          onClose();\n        },\n        label: translate('add'),\n        iconName: 'plus',\n        disabled: isLoading || !selectedPriority\n      }\n    };\n  }, [\n    handleCancel,\n    setSelectedPriority,\n    setSelectedPriorityType,\n    onAdd,\n    translate,\n    selectedPriority,\n    selectedPriorityType,\n    isLoading\n  ]);\n\n  if ((!isLoading && !priorities) || !isOpen) return null;\n\n  return (\n    <BaseModal\n      title={translate('learning_priority_modal_title')}\n      description={translate('learning_priority_modal_description')}\n      isOpen={isOpen}\n      onClose={handleClose}\n      footer={footer}\n    >\n      <div className={style.LearningPriorityContainer}>\n        {isLoading ? (\n          <div className={style.loaderContainer}>\n            <Loader className={style.loader} theme=\"coorpmanager\" />\n          </div>\n        ) : (\n          <>\n            <div className={style.searchWrapper}>\n              <SearchForm\n                search={{\n                  placeholder: translate('search_priority_place_holder'),\n                  value: searchValue,\n                  onChange: handleSearch\n                }}\n                onReset={handleSearchReset}\n              />\n            </div>\n            <div className={style.filterWrapper}>\n              {searchResults.length > 0\n                ? filters.map((filter, index) => {\n                    const {name, value, count} = filter;\n\n                    function handleChange() {\n                      setFilterValue(value);\n                      handleSearchReset();\n                    }\n\n                    if (count === 0) return null;\n\n                    return (\n                      <div key={index} className={style.filterButtonWrapper}>\n                        <FilterButton\n                          active={filterValue === value}\n                          filter={name}\n                          onClick={handleChange}\n                          itemTotal={count}\n                        />\n                      </div>\n                    );\n                  })\n                : null}\n            </div>\n            <div className={style.priorityListWrapper}>\n              {priorityList.map(priority => {\n                const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n                function handlePriorityClick() {\n                  setSelectedPriority(priorityRef);\n                  setSelectedPriorityType(type);\n                }\n\n                if (filterValue !== 'all' && type !== filterValue) return null;\n\n                return (\n                  <ListItem\n                    {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n                    title={title}\n                    selected={selected || selectedPriority === priorityRef}\n                    disabled={disabled}\n                    onClick={handlePriorityClick}\n                    tags={[{label: type, type: 'default'}]}\n                    key={priorityRef}\n                    backgroundColor=\"skin\"\n                  />\n                );\n              })}\n            </div>\n          </>\n        )}\n      </div>\n    </BaseModal>\n  );\n};\n\nLearningPriorityModal.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      priorityRef: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n    })\n  ),\n  preselected: PropTypes.arrayOf(PropTypes.string),\n  isOpen: PropTypes.bool,\n  isLoading: PropTypes.bool,\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...SelectOptionPropTypes,\n      count: PropTypes.number\n    })\n  ),\n  onCancel: PropTypes.func,\n  onAdd: PropTypes.func,\n  onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}

package/es/molecule/learning-priority-modal/style.css

@@ -3,6 +3,8 @@
 
 .LearningPriorityContainer {
   height: 485px;
+  width: calc(71vw - 68px);
+  max-width: 660px;
   overflow-y: auto;
 }
 
@@ -57,7 +59,7 @@
 
 .priorityListWrapper {
   display: flex;
-  flex-wrap: wrap;
+  flex-direction: column;
   gap: 16px;
 }
 

package/es/organism/brand-learning-priorities/index.d.ts

@@ -152,16 +152,13 @@ declare namespace BrandLearningPriorities {
             courses: PropTypes.Requireable<number>;
             type: PropTypes.Requireable<string>;
         }> | null | undefined)[]>;
-        const filters: PropTypes.Requireable<PropTypes.InferProps<{
-            onChange: PropTypes.Requireable<(...args: any[]) => any>;
-            options: PropTypes.Requireable<(PropTypes.InferProps<{
-                count: PropTypes.Requireable<number>;
-                name: PropTypes.Validator<string>;
-                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                selected: PropTypes.Requireable<boolean>;
-                validOption: PropTypes.Requireable<boolean>;
-            }> | null | undefined)[]>;
-        }>>;
+        const filters: PropTypes.Requireable<(PropTypes.InferProps<{
+            count: PropTypes.Requireable<number>;
+            name: PropTypes.Validator<string>;
+            value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+            selected: PropTypes.Requireable<boolean>;
+            validOption: PropTypes.Requireable<boolean>;
+        }> | null | undefined)[]>;
         const isLoading: PropTypes.Requireable<boolean>;
         const onAdd: PropTypes.Requireable<(...args: any[]) => any>;
     }

package/es/organism/brand-learning-priorities/index.js

@@ -90,12 +90,9 @@ BrandLearningPriorities.propTypes = process.env.NODE_ENV !== "production" ? {
     courses: PropTypes.number,
     type: PropTypes.string
   })),
-  filters: PropTypes.shape({
-    onChange: PropTypes.func,
-    options: PropTypes.arrayOf(PropTypes.shape(_extends({}, SelectOptionPropTypes, {
-      count: PropTypes.number
-    })))
-  }),
+  filters: PropTypes.arrayOf(PropTypes.shape(_extends({}, SelectOptionPropTypes, {
+    count: PropTypes.number
+  }))),
   isLoading: PropTypes.bool,
   onAdd: PropTypes.func
 } : {};

package/es/organism/brand-learning-priorities/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","useCallback","useMemo","PropTypes","convert","Provider","Loader","SelectOptionPropTypes","DraggableList","ButtonLink","LearningPriorityModal","style","BrandLearningPriorities","props","context","content","priorities","filters","isLoading","onAdd","openModal","setOpenModal","skin","translate","primarySkinColor","selectedPriorities","items","map","priority","priorityRef","Loading","loading","handleOpenModal","handleCloseModal","container","LPtitle","LPdescription","ctaWrapper","priorityCount","length","backgroundColor","color","transition","width","position","faIcon","name","size","contextTypes","childContextTypes","propTypes","shape","arrayOf","ref","string","title","courses","number","type","onChange","func","options","count","bool"],"sources":["../../../src/organism/brand-learning-priorities/index.js"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport DraggableList from '../../molecule/draggable-list';\nimport ButtonLink from '../../atom/button-link';\nimport LearningPriorityModal from '../../molecule/learning-priority-modal';\nimport style from './style.css';\n\nconst BrandLearningPriorities = (props, context) => {\n  const {content, priorities, filters, isLoading, onAdd} = props;\n  const [openModal, setOpenModal] = useState(false);\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const selectedPriorities = useMemo(\n    () => content.items.map(priority => priority.priorityRef),\n    [content.items]\n  );\n\n  const Loading = useCallback(\n    () => (\n      <div className={style.loading}>\n        <Loader />\n      </div>\n    ),\n    []\n  );\n\n  const handleOpenModal = useCallback(() => setOpenModal(true), [setOpenModal]);\n  const handleCloseModal = useCallback(() => setOpenModal(false), [setOpenModal]);\n  return (\n    <div className={style.container}>\n      <LearningPriorityModal\n        isLoading={isLoading}\n        isOpen={openModal}\n        onCancel={handleCloseModal}\n        onClose={handleCloseModal}\n        onAdd={onAdd}\n        priorities={priorities}\n        filters={filters}\n        preselected={selectedPriorities}\n      />\n      <div className={style.LPtitle}>{translate('learning_priorities')}</div>\n      <div className={style.LPdescription}>\n        {translate('learning_priorities_brand_description')}\n      </div>\n\n      {isLoading ? (\n        <Loading />\n      ) : (\n        <>\n          <div className={style.ctaWrapper}>\n            <div className={style.priorityCount}>\n              {`${content.items.length} ${translate('items')}`}\n            </div>\n            <ButtonLink\n              customStyle={{\n                backgroundColor: primarySkinColor,\n                color: '#FFFFFF',\n                transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n                width: 'fit-content'\n              }}\n              hoverBackgroundColor={convert(`color(${primarySkinColor} a(0.07))`)}\n              hoverColor={primarySkinColor}\n              onClick={handleOpenModal}\n              label={translate('add_learning_priority')}\n              data-name=\"add-learning-priority\"\n              icon={{\n                position: 'left',\n                faIcon: {\n                  name: 'plus',\n                  backgroundColor: primarySkinColor,\n                  color: '#FFFFFF',\n                  size: 16\n                }\n              }}\n            />\n          </div>\n          <DraggableList {...content} />\n        </>\n      )}\n    </div>\n  );\n};\n\nBrandLearningPriorities.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nBrandLearningPriorities.propTypes = {\n  content: PropTypes.shape(DraggableList.propTypes),\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      ref: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.string\n    })\n  ),\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(\n      PropTypes.shape({\n        ...SelectOptionPropTypes,\n        count: PropTypes.number\n      })\n    )\n  }),\n  isLoading: PropTypes.bool,\n  onAdd: PropTypes.func\n};\n\nexport default BrandLearningPriorities;\n"],"mappings":";;;;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,EAAsCC,OAAtC,QAAoD,OAApD;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAAQC,OAAR,QAAsB,oBAAtB;AAEA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,qBAAR,QAAoC,mBAApC;AACA,OAAOC,aAAP,MAA0B,+BAA1B;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,qBAAP,MAAkC,wCAAlC;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,uBAAuB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EAClD,MAAM;IAACC,OAAD;IAAUC,UAAV;IAAsBC,OAAtB;IAA+BC,SAA/B;IAA0CC;EAA1C,IAAmDN,KAAzD;EACA,MAAM,CAACO,SAAD,EAAYC,YAAZ,IAA4BrB,QAAQ,CAAC,KAAD,CAA1C;EACA,MAAM;IAACsB,IAAD;IAAOC;EAAP,IAAoBT,OAA1B;;EACA,MAAMU,gBAAgB,GAAG,KAAI,gBAAJ,EAAsBF,IAAtB,CAAzB;;EAEA,MAAMG,kBAAkB,GAAGvB,OAAO,CAChC,MAAMa,OAAO,CAACW,KAAR,CAAcC,GAAd,CAAkBC,QAAQ,IAAIA,QAAQ,CAACC,WAAvC,CAD0B,EAEhC,CAACd,OAAO,CAACW,KAAT,CAFgC,CAAlC;EAKA,MAAMI,OAAO,GAAG7B,WAAW,CACzB,mBACE;IAAK,SAAS,EAAEU,KAAK,CAACoB;EAAtB,gBACE,oBAAC,MAAD,OADF,CAFuB,EAMzB,EANyB,CAA3B;EASA,MAAMC,eAAe,GAAG/B,WAAW,CAAC,MAAMoB,YAAY,CAAC,IAAD,CAAnB,EAA2B,CAACA,YAAD,CAA3B,CAAnC;EACA,MAAMY,gBAAgB,GAAGhC,WAAW,CAAC,MAAMoB,YAAY,CAAC,KAAD,CAAnB,EAA4B,CAACA,YAAD,CAA5B,CAApC;EACA,oBACE;IAAK,SAAS,EAAEV,KAAK,CAACuB;EAAtB,gBACE,oBAAC,qBAAD;IACE,SAAS,EAAEhB,SADb;IAEE,MAAM,EAAEE,SAFV;IAGE,QAAQ,EAAEa,gBAHZ;IAIE,OAAO,EAAEA,gBAJX;IAKE,KAAK,EAAEd,KALT;IAME,UAAU,EAAEH,UANd;IAOE,OAAO,EAAEC,OAPX;IAQE,WAAW,EAAEQ;EARf,EADF,eAWE;IAAK,SAAS,EAAEd,KAAK,CAACwB;EAAtB,GAAgCZ,SAAS,CAAC,qBAAD,CAAzC,CAXF,eAYE;IAAK,SAAS,EAAEZ,KAAK,CAACyB;EAAtB,GACGb,SAAS,CAAC,uCAAD,CADZ,CAZF,EAgBGL,SAAS,gBACR,oBAAC,OAAD,OADQ,gBAGR,uDACE;IAAK,SAAS,EAAEP,KAAK,CAAC0B;EAAtB,gBACE;IAAK,SAAS,EAAE1B,KAAK,CAAC2B;EAAtB,GACI,GAAEvB,OAAO,CAACW,KAAR,CAAca,MAAO,IAAGhB,SAAS,CAAC,OAAD,CAAU,EADjD,CADF,eAIE,oBAAC,UAAD;IACE,WAAW,EAAE;MACXiB,eAAe,EAAEhB,gBADN;MAEXiB,KAAK,EAAE,SAFI;MAGXC,UAAU,EAAE,6DAHD;MAIXC,KAAK,EAAE;IAJI,CADf;IAOE,oBAAoB,EAAEvC,OAAO,CAAE,SAAQoB,gBAAiB,WAA3B,CAP/B;IAQE,UAAU,EAAEA,gBARd;IASE,OAAO,EAAEQ,eATX;IAUE,KAAK,EAAET,SAAS,CAAC,uBAAD,CAVlB;IAWE,aAAU,uBAXZ;IAYE,IAAI,EAAE;MACJqB,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACNC,IAAI,EAAE,MADA;QAENN,eAAe,EAAEhB,gBAFX;QAGNiB,KAAK,EAAE,SAHD;QAINM,IAAI,EAAE;MAJA;IAFJ;EAZR,EAJF,CADF,eA4BE,oBAAC,aAAD,EAAmBhC,OAAnB,CA5BF,CAnBJ,CADF;AAqDD,CA3ED;;AA6EAH,uBAAuB,CAACoC,YAAxB,GAAuC;EACrC1B,IAAI,EAAEjB,QAAQ,CAAC4C,iBAAT,CAA2B3B,IADI;EAErCC,SAAS,EAAElB,QAAQ,CAAC4C,iBAAT,CAA2B1B;AAFD,CAAvC;AAKAX,uBAAuB,CAACsC,SAAxB,2CAAoC;EAClCnC,OAAO,EAAEZ,SAAS,CAACgD,KAAV,CAAgB3C,aAAa,CAAC0C,SAA9B,CADyB;EAElClC,UAAU,EAAEb,SAAS,CAACiD,OAAV,CACVjD,SAAS,CAACgD,KAAV,CAAgB;IACdE,GAAG,EAAElD,SAAS,CAACmD,MADD;IAEdC,KAAK,EAAEpD,SAAS,CAACmD,MAFH;IAGdE,OAAO,EAAErD,SAAS,CAACsD,MAHL;IAIdC,IAAI,EAAEvD,SAAS,CAACmD;EAJF,CAAhB,CADU,CAFsB;EAUlCrC,OAAO,EAAEd,SAAS,CAACgD,KAAV,CAAgB;IACvBQ,QAAQ,EAAExD,SAAS,CAACyD,IADG;IAEvBC,OAAO,EAAE1D,SAAS,CAACiD,OAAV,CACPjD,SAAS,CAACgD,KAAV,cACK5C,qBADL;MAEEuD,KAAK,EAAE3D,SAAS,CAACsD;IAFnB,GADO;EAFc,CAAhB,CAVyB;EAmBlCvC,SAAS,EAAEf,SAAS,CAAC4D,IAnBa;EAoBlC5C,KAAK,EAAEhB,SAAS,CAACyD;AApBiB,CAApC;AAuBA,eAAehD,uBAAf"}
+{"version":3,"file":"index.js","names":["React","useState","useCallback","useMemo","PropTypes","convert","Provider","Loader","SelectOptionPropTypes","DraggableList","ButtonLink","LearningPriorityModal","style","BrandLearningPriorities","props","context","content","priorities","filters","isLoading","onAdd","openModal","setOpenModal","skin","translate","primarySkinColor","selectedPriorities","items","map","priority","priorityRef","Loading","loading","handleOpenModal","handleCloseModal","container","LPtitle","LPdescription","ctaWrapper","priorityCount","length","backgroundColor","color","transition","width","position","faIcon","name","size","contextTypes","childContextTypes","propTypes","shape","arrayOf","ref","string","title","courses","number","type","count","bool","func"],"sources":["../../../src/organism/brand-learning-priorities/index.js"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport DraggableList from '../../molecule/draggable-list';\nimport ButtonLink from '../../atom/button-link';\nimport LearningPriorityModal from '../../molecule/learning-priority-modal';\nimport style from './style.css';\n\nconst BrandLearningPriorities = (props, context) => {\n  const {content, priorities, filters, isLoading, onAdd} = props;\n  const [openModal, setOpenModal] = useState(false);\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const selectedPriorities = useMemo(\n    () => content.items.map(priority => priority.priorityRef),\n    [content.items]\n  );\n\n  const Loading = useCallback(\n    () => (\n      <div className={style.loading}>\n        <Loader />\n      </div>\n    ),\n    []\n  );\n\n  const handleOpenModal = useCallback(() => setOpenModal(true), [setOpenModal]);\n  const handleCloseModal = useCallback(() => setOpenModal(false), [setOpenModal]);\n  return (\n    <div className={style.container}>\n      <LearningPriorityModal\n        isLoading={isLoading}\n        isOpen={openModal}\n        onCancel={handleCloseModal}\n        onClose={handleCloseModal}\n        onAdd={onAdd}\n        priorities={priorities}\n        filters={filters}\n        preselected={selectedPriorities}\n      />\n      <div className={style.LPtitle}>{translate('learning_priorities')}</div>\n      <div className={style.LPdescription}>\n        {translate('learning_priorities_brand_description')}\n      </div>\n\n      {isLoading ? (\n        <Loading />\n      ) : (\n        <>\n          <div className={style.ctaWrapper}>\n            <div className={style.priorityCount}>\n              {`${content.items.length} ${translate('items')}`}\n            </div>\n            <ButtonLink\n              customStyle={{\n                backgroundColor: primarySkinColor,\n                color: '#FFFFFF',\n                transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n                width: 'fit-content'\n              }}\n              hoverBackgroundColor={convert(`color(${primarySkinColor} a(0.07))`)}\n              hoverColor={primarySkinColor}\n              onClick={handleOpenModal}\n              label={translate('add_learning_priority')}\n              data-name=\"add-learning-priority\"\n              icon={{\n                position: 'left',\n                faIcon: {\n                  name: 'plus',\n                  backgroundColor: primarySkinColor,\n                  color: '#FFFFFF',\n                  size: 16\n                }\n              }}\n            />\n          </div>\n          <DraggableList {...content} />\n        </>\n      )}\n    </div>\n  );\n};\n\nBrandLearningPriorities.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nBrandLearningPriorities.propTypes = {\n  content: PropTypes.shape(DraggableList.propTypes),\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      ref: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.string\n    })\n  ),\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...SelectOptionPropTypes,\n      count: PropTypes.number\n    })\n  ),\n  isLoading: PropTypes.bool,\n  onAdd: PropTypes.func\n};\n\nexport default BrandLearningPriorities;\n"],"mappings":"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"}

package/es/template/back-office/brand-update/index.d.ts

@@ -862,16 +862,13 @@ declare namespace BrandUpdate {
                 courses: PropTypes.Requireable<number>;
                 type: PropTypes.Requireable<string>;
             }> | null | undefined)[]>;
-            filters: PropTypes.Requireable<PropTypes.InferProps<{
-                onChange: PropTypes.Requireable<(...args: any[]) => any>;
-                options: PropTypes.Requireable<(PropTypes.InferProps<{
-                    count: PropTypes.Requireable<number>;
-                    name: PropTypes.Validator<string>;
-                    value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                    selected: PropTypes.Requireable<boolean>;
-                    validOption: PropTypes.Requireable<boolean>;
-                }> | null | undefined)[]>;
-            }>>;
+            filters: PropTypes.Requireable<(PropTypes.InferProps<{
+                count: PropTypes.Requireable<number>;
+                name: PropTypes.Validator<string>;
+                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+                selected: PropTypes.Requireable<boolean>;
+                validOption: PropTypes.Requireable<boolean>;
+            }> | null | undefined)[]>;
             isLoading: PropTypes.Requireable<boolean>;
             onAdd: PropTypes.Requireable<(...args: any[]) => any>;
         }> | null | undefined>>;

package/lib/molecule/learning-priority-modal/index.d.ts

@@ -14,16 +14,13 @@ declare namespace LearningPriorityModal {
         const preselected: PropTypes.Requireable<(string | null | undefined)[]>;
         const isOpen: PropTypes.Requireable<boolean>;
         const isLoading: PropTypes.Requireable<boolean>;
-        const filters: PropTypes.Requireable<PropTypes.InferProps<{
-            onChange: PropTypes.Requireable<(...args: any[]) => any>;
-            options: PropTypes.Requireable<(PropTypes.InferProps<{
-                count: PropTypes.Requireable<number>;
-                name: PropTypes.Validator<string>;
-                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                selected: PropTypes.Requireable<boolean>;
-                validOption: PropTypes.Requireable<boolean>;
-            }> | null | undefined)[]>;
-        }>>;
+        const filters: PropTypes.Requireable<(PropTypes.InferProps<{
+            count: PropTypes.Requireable<number>;
+            name: PropTypes.Validator<string>;
+            value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+            selected: PropTypes.Requireable<boolean>;
+            validOption: PropTypes.Requireable<boolean>;
+        }> | null | undefined)[]>;
         const onCancel: PropTypes.Requireable<(...args: any[]) => any>;
         const onAdd: PropTypes.Requireable<(...args: any[]) => any>;
         const onClose: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/molecule/learning-priority-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-modal/index.js"],"names":[],"mappings":";AAgEA,qFAyJC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-modal/index.js"],"names":[],"mappings":";AAgEA,qFAkKC"}

package/lib/molecule/learning-priority-modal/index.js

@@ -90,10 +90,7 @@ const LearningPriorityModal = (props, context) => {
     preselected,
     isOpen,
     isLoading,
-    filters: {
-      options,
-      onChange
-    },
+    filters,
     onCancel,
     onAdd,
     onClose
@@ -102,16 +99,20 @@ const LearningPriorityModal = (props, context) => {
     translate
   } = context;
   const [selectedPriority, setSelectedPriority] = (0, _react.useState)('');
+  const [selectedPriorityType, setSelectedPriorityType] = (0, _react.useState)('');
   const [searchValue, setSearchValue] = (0, _react.useState)('');
+  const [filterValue, setFilterValue] = (0, _react.useState)('all');
   const [searchResults, setSearchResults] = (0, _react.useState)(priorities);
   const handleCancel = (0, _react.useCallback)(() => {
     setSelectedPriority('');
+    setSelectedPriorityType('');
     onCancel();
-  }, [setSelectedPriority, onCancel]);
+  }, [setSelectedPriority, setSelectedPriorityType, onCancel]);
   const handleClose = (0, _react.useCallback)(() => {
     setSelectedPriority('');
+    setSelectedPriorityType('');
     onClose();
-  }, [setSelectedPriority, onClose]);
+  }, [setSelectedPriority, setSelectedPriorityType, onClose]);
   const handleSearch = (0, _react.useCallback)(value => {
     setSearchValue(value);
     setSearchResults(priorities.filter(priority => (0, _searchValueIncluded.default)(priority.title, value)));
@@ -140,7 +141,9 @@ const LearningPriorityModal = (props, context) => {
       },
       confirmButton: {
         onConfirm: () => {
-          onAdd(selectedPriority);
+          onAdd(selectedPriority, selectedPriorityType);
+          setSelectedPriority('');
+          setSelectedPriorityType('');
           onClose();
         },
         label: translate('add'),
@@ -148,7 +151,7 @@ const LearningPriorityModal = (props, context) => {
         disabled: isLoading || !selectedPriority
       }
     };
-  }, [handleCancel, onAdd, translate, selectedPriority, isLoading]);
+  }, [handleCancel, setSelectedPriority, setSelectedPriorityType, onAdd, translate, selectedPriority, selectedPriorityType, isLoading]);
   if (!isLoading && !priorities || !isOpen) return null;
   return /*#__PURE__*/_react.default.createElement(_baseModal.default, {
     title: translate('learning_priority_modal_title'),
@@ -174,16 +177,15 @@ const LearningPriorityModal = (props, context) => {
     onReset: handleSearchReset
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.filterWrapper
-  }, searchResults.length > 0 ? options.map((filter, index) => {
+  }, searchResults.length > 0 ? filters.map((filter, index) => {
     const {
       name,
       value,
-      selected,
       count
     } = filter;
 
     function handleChange() {
-      onChange(value);
+      setFilterValue(value);
       handleSearchReset();
     }
 
@@ -192,7 +194,7 @@ const LearningPriorityModal = (props, context) => {
       key: index,
       className: _style.default.filterButtonWrapper
     }, /*#__PURE__*/_react.default.createElement(FilterButton, {
-      active: selected,
+      active: filterValue === value,
       filter: name,
       onClick: handleChange,
       itemTotal: count
@@ -211,8 +213,10 @@ const LearningPriorityModal = (props, context) => {
 
     function handlePriorityClick() {
       setSelectedPriority(priorityRef);
+      setSelectedPriorityType(type);
     }
 
+    if (filterValue !== 'all' && type !== filterValue) return null;
     return /*#__PURE__*/_react.default.createElement(_listItem.default, _extends({}, courses !== null ? {
       subtitle: `${courses} ${translate('courses')}`
     } : {}, {
@@ -243,12 +247,9 @@ LearningPriorityModal.propTypes = process.env.NODE_ENV !== "production" ? {
   preselected: _propTypes.default.arrayOf(_propTypes.default.string),
   isOpen: _propTypes.default.bool,
   isLoading: _propTypes.default.bool,
-  filters: _propTypes.default.shape({
-    onChange: _propTypes.default.func,
-    options: _propTypes.default.arrayOf(_propTypes.default.shape(_extends({}, _select.SelectOptionPropTypes, {
-      count: _propTypes.default.number
-    })))
-  }),
+  filters: _propTypes.default.arrayOf(_propTypes.default.shape(_extends({}, _select.SelectOptionPropTypes, {
+    count: _propTypes.default.number
+  }))),
   onCancel: _propTypes.default.func,
   onAdd: _propTypes.default.func,
   onClose: _propTypes.default.func

package/lib/molecule/learning-priority-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["FilterButton","props","context","active","filter","itemTotal","onClick","skin","primarySkinColor","Content","useCallback","style","skillFilterNumber","skillFilterNumberInActive","backgroundColor","convert","color","buttonProps","customStyle","transition","width","content","contextTypes","Provider","childContextTypes","translate","propTypes","PropTypes","bool","string","number","func","LearningPriorityModal","priorities","preselected","isOpen","isLoading","filters","options","onChange","onCancel","onAdd","onClose","selectedPriority","setSelectedPriority","useState","searchValue","setSearchValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","searchValueIncluded","title","handleSearchReset","useEffect","priorityList","useMemo","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","arrayOf","shape","oneOf","SelectOptionPropTypes"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport style from './style.css';\n\nconst FilterButton = (props, context) => {\n  const {active, filter, itemTotal, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const Content = useCallback(\n    () => (\n      <div>\n        {filter}\n        <span\n          className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n          style={{\n            backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n            color: active ? primarySkinColor : '#515161'\n          }}\n        >\n          {itemTotal}\n        </span>\n      </div>\n    ),\n    [filter, itemTotal, active, primarySkinColor]\n  );\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n      color: active ? primarySkinColor : '#9999A8',\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    onClick,\n    content: <Content />,\n    'data-name': 'change-skill-focus-button'\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nFilterButton.propTypes = {\n  active: PropTypes.bool,\n  filter: PropTypes.string,\n  itemTotal: PropTypes.number,\n  onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n  const {\n    priorities,\n    preselected,\n    isOpen,\n    isLoading,\n    filters: {options, onChange},\n    onCancel,\n    onAdd,\n    onClose\n  } = props;\n  const {translate} = context;\n\n  const [selectedPriority, setSelectedPriority] = useState('');\n  const [searchValue, setSearchValue] = useState('');\n  const [searchResults, setSearchResults] = useState(priorities);\n\n  const handleCancel = useCallback(() => {\n    setSelectedPriority('');\n    onCancel();\n  }, [setSelectedPriority, onCancel]);\n\n  const handleClose = useCallback(() => {\n    setSelectedPriority('');\n    onClose();\n  }, [setSelectedPriority, onClose]);\n\n  const handleSearch = useCallback(\n    value => {\n      setSearchValue(value);\n      setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n    },\n    [priorities, setSearchValue, setSearchResults]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    setSearchResults(priorities);\n  }, [priorities, setSearchValue, setSearchResults]);\n\n  useEffect(() => {\n    setSearchResults(priorities);\n  }, [priorities]);\n\n  const priorityList = useMemo(() => {\n    return searchResults.map(priority => {\n      const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n      return assign(\n        {\n          selected: isPreSelectedPriority,\n          disabled: isPreSelectedPriority\n        },\n        pick(['title', 'priorityRef', 'type', 'courses'], priority)\n      );\n    });\n  }, [searchResults, preselected]);\n\n  const footer = useMemo(() => {\n    return {\n      cancelButton: {\n        onCancel: handleCancel,\n        label: translate('cancel')\n      },\n      confirmButton: {\n        onConfirm: () => {\n          onAdd(selectedPriority);\n          onClose();\n        },\n        label: translate('add'),\n        iconName: 'plus',\n        disabled: isLoading || !selectedPriority\n      }\n    };\n  }, [handleCancel, onAdd, translate, selectedPriority, isLoading]);\n\n  if ((!isLoading && !priorities) || !isOpen) return null;\n\n  return (\n    <BaseModal\n      title={translate('learning_priority_modal_title')}\n      description={translate('learning_priority_modal_description')}\n      isOpen={isOpen}\n      onClose={handleClose}\n      footer={footer}\n    >\n      <div className={style.LearningPriorityContainer}>\n        {isLoading ? (\n          <div className={style.loaderContainer}>\n            <Loader className={style.loader} theme=\"coorpmanager\" />\n          </div>\n        ) : (\n          <>\n            <div className={style.searchWrapper}>\n              <SearchForm\n                search={{\n                  placeholder: translate('search_priority_place_holder'),\n                  value: searchValue,\n                  onChange: handleSearch\n                }}\n                onReset={handleSearchReset}\n              />\n            </div>\n            <div className={style.filterWrapper}>\n              {searchResults.length > 0\n                ? options.map((filter, index) => {\n                    const {name, value, selected, count} = filter;\n\n                    function handleChange() {\n                      onChange(value);\n                      handleSearchReset();\n                    }\n\n                    if (count === 0) return null;\n\n                    return (\n                      <div key={index} className={style.filterButtonWrapper}>\n                        <FilterButton\n                          active={selected}\n                          filter={name}\n                          onClick={handleChange}\n                          itemTotal={count}\n                        />\n                      </div>\n                    );\n                  })\n                : null}\n            </div>\n            <div className={style.priorityListWrapper}>\n              {priorityList.map(priority => {\n                const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n                function handlePriorityClick() {\n                  setSelectedPriority(priorityRef);\n                }\n\n                return (\n                  <ListItem\n                    {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n                    title={title}\n                    selected={selected || selectedPriority === priorityRef}\n                    disabled={disabled}\n                    onClick={handlePriorityClick}\n                    tags={[{label: type, type: 'default'}]}\n                    key={priorityRef}\n                    backgroundColor=\"skin\"\n                  />\n                );\n              })}\n            </div>\n          </>\n        )}\n      </div>\n    </BaseModal>\n  );\n};\n\nLearningPriorityModal.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      priorityRef: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n    })\n  ),\n  preselected: PropTypes.arrayOf(PropTypes.string),\n  isOpen: PropTypes.bool,\n  isLoading: PropTypes.bool,\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(\n      PropTypes.shape({\n        ...SelectOptionPropTypes,\n        count: PropTypes.number\n      })\n    )\n  }),\n  onCancel: PropTypes.func,\n  onAdd: PropTypes.func,\n  onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["FilterButton","props","context","active","filter","itemTotal","onClick","skin","primarySkinColor","Content","useCallback","style","skillFilterNumber","skillFilterNumberInActive","backgroundColor","convert","color","buttonProps","customStyle","transition","width","content","contextTypes","Provider","childContextTypes","translate","propTypes","PropTypes","bool","string","number","func","LearningPriorityModal","priorities","preselected","isOpen","isLoading","filters","onCancel","onAdd","onClose","selectedPriority","setSelectedPriority","useState","selectedPriorityType","setSelectedPriorityType","searchValue","setSearchValue","filterValue","setFilterValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","searchValueIncluded","title","handleSearchReset","useEffect","priorityList","useMemo","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","onChange","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","arrayOf","shape","oneOf","SelectOptionPropTypes"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport style from './style.css';\n\nconst FilterButton = (props, context) => {\n  const {active, filter, itemTotal, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const Content = useCallback(\n    () => (\n      <div>\n        {filter}\n        <span\n          className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n          style={{\n            backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n            color: active ? primarySkinColor : '#515161'\n          }}\n        >\n          {itemTotal}\n        </span>\n      </div>\n    ),\n    [filter, itemTotal, active, primarySkinColor]\n  );\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n      color: active ? primarySkinColor : '#9999A8',\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    onClick,\n    content: <Content />,\n    'data-name': 'change-skill-focus-button'\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nFilterButton.propTypes = {\n  active: PropTypes.bool,\n  filter: PropTypes.string,\n  itemTotal: PropTypes.number,\n  onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n  const {priorities, preselected, isOpen, isLoading, filters, onCancel, onAdd, onClose} = props;\n  const {translate} = context;\n\n  const [selectedPriority, setSelectedPriority] = useState('');\n  const [selectedPriorityType, setSelectedPriorityType] = useState('');\n  const [searchValue, setSearchValue] = useState('');\n  const [filterValue, setFilterValue] = useState('all');\n  const [searchResults, setSearchResults] = useState(priorities);\n\n  const handleCancel = useCallback(() => {\n    setSelectedPriority('');\n    setSelectedPriorityType('');\n    onCancel();\n  }, [setSelectedPriority, setSelectedPriorityType, onCancel]);\n\n  const handleClose = useCallback(() => {\n    setSelectedPriority('');\n    setSelectedPriorityType('');\n    onClose();\n  }, [setSelectedPriority, setSelectedPriorityType, onClose]);\n\n  const handleSearch = useCallback(\n    value => {\n      setSearchValue(value);\n      setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n    },\n    [priorities, setSearchValue, setSearchResults]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    setSearchResults(priorities);\n  }, [priorities, setSearchValue, setSearchResults]);\n\n  useEffect(() => {\n    setSearchResults(priorities);\n  }, [priorities]);\n\n  const priorityList = useMemo(() => {\n    return searchResults.map(priority => {\n      const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n      return assign(\n        {\n          selected: isPreSelectedPriority,\n          disabled: isPreSelectedPriority\n        },\n        pick(['title', 'priorityRef', 'type', 'courses'], priority)\n      );\n    });\n  }, [searchResults, preselected]);\n\n  const footer = useMemo(() => {\n    return {\n      cancelButton: {\n        onCancel: handleCancel,\n        label: translate('cancel')\n      },\n      confirmButton: {\n        onConfirm: () => {\n          onAdd(selectedPriority, selectedPriorityType);\n          setSelectedPriority('');\n          setSelectedPriorityType('');\n          onClose();\n        },\n        label: translate('add'),\n        iconName: 'plus',\n        disabled: isLoading || !selectedPriority\n      }\n    };\n  }, [\n    handleCancel,\n    setSelectedPriority,\n    setSelectedPriorityType,\n    onAdd,\n    translate,\n    selectedPriority,\n    selectedPriorityType,\n    isLoading\n  ]);\n\n  if ((!isLoading && !priorities) || !isOpen) return null;\n\n  return (\n    <BaseModal\n      title={translate('learning_priority_modal_title')}\n      description={translate('learning_priority_modal_description')}\n      isOpen={isOpen}\n      onClose={handleClose}\n      footer={footer}\n    >\n      <div className={style.LearningPriorityContainer}>\n        {isLoading ? (\n          <div className={style.loaderContainer}>\n            <Loader className={style.loader} theme=\"coorpmanager\" />\n          </div>\n        ) : (\n          <>\n            <div className={style.searchWrapper}>\n              <SearchForm\n                search={{\n                  placeholder: translate('search_priority_place_holder'),\n                  value: searchValue,\n                  onChange: handleSearch\n                }}\n                onReset={handleSearchReset}\n              />\n            </div>\n            <div className={style.filterWrapper}>\n              {searchResults.length > 0\n                ? filters.map((filter, index) => {\n                    const {name, value, count} = filter;\n\n                    function handleChange() {\n                      setFilterValue(value);\n                      handleSearchReset();\n                    }\n\n                    if (count === 0) return null;\n\n                    return (\n                      <div key={index} className={style.filterButtonWrapper}>\n                        <FilterButton\n                          active={filterValue === value}\n                          filter={name}\n                          onClick={handleChange}\n                          itemTotal={count}\n                        />\n                      </div>\n                    );\n                  })\n                : null}\n            </div>\n            <div className={style.priorityListWrapper}>\n              {priorityList.map(priority => {\n                const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n                function handlePriorityClick() {\n                  setSelectedPriority(priorityRef);\n                  setSelectedPriorityType(type);\n                }\n\n                if (filterValue !== 'all' && type !== filterValue) return null;\n\n                return (\n                  <ListItem\n                    {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n                    title={title}\n                    selected={selected || selectedPriority === priorityRef}\n                    disabled={disabled}\n                    onClick={handlePriorityClick}\n                    tags={[{label: type, type: 'default'}]}\n                    key={priorityRef}\n                    backgroundColor=\"skin\"\n                  />\n                );\n              })}\n            </div>\n          </>\n        )}\n      </div>\n    </BaseModal>\n  );\n};\n\nLearningPriorityModal.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      priorityRef: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n    })\n  ),\n  preselected: PropTypes.arrayOf(PropTypes.string),\n  isOpen: PropTypes.bool,\n  isLoading: PropTypes.bool,\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...SelectOptionPropTypes,\n      count: PropTypes.number\n    })\n  ),\n  onCancel: PropTypes.func,\n  onAdd: PropTypes.func,\n  onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}

package/lib/molecule/learning-priority-modal/style.css

@@ -3,6 +3,8 @@
 
 .LearningPriorityContainer {
   height: 485px;
+  width: calc(71vw - 68px);
+  max-width: 660px;
   overflow-y: auto;
 }
 
@@ -57,7 +59,7 @@
 
 .priorityListWrapper {
   display: flex;
-  flex-wrap: wrap;
+  flex-direction: column;
   gap: 16px;
 }
 

package/lib/organism/brand-learning-priorities/index.d.ts

@@ -152,16 +152,13 @@ declare namespace BrandLearningPriorities {
             courses: PropTypes.Requireable<number>;
             type: PropTypes.Requireable<string>;
         }> | null | undefined)[]>;
-        const filters: PropTypes.Requireable<PropTypes.InferProps<{
-            onChange: PropTypes.Requireable<(...args: any[]) => any>;
-            options: PropTypes.Requireable<(PropTypes.InferProps<{
-                count: PropTypes.Requireable<number>;
-                name: PropTypes.Validator<string>;
-                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                selected: PropTypes.Requireable<boolean>;
-                validOption: PropTypes.Requireable<boolean>;
-            }> | null | undefined)[]>;
-        }>>;
+        const filters: PropTypes.Requireable<(PropTypes.InferProps<{
+            count: PropTypes.Requireable<number>;
+            name: PropTypes.Validator<string>;
+            value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+            selected: PropTypes.Requireable<boolean>;
+            validOption: PropTypes.Requireable<boolean>;
+        }> | null | undefined)[]>;
         const isLoading: PropTypes.Requireable<boolean>;
         const onAdd: PropTypes.Requireable<(...args: any[]) => any>;
     }

package/lib/organism/brand-learning-priorities/index.js

@@ -108,12 +108,9 @@ BrandLearningPriorities.propTypes = process.env.NODE_ENV !== "production" ? {
     courses: _propTypes.default.number,
     type: _propTypes.default.string
   })),
-  filters: _propTypes.default.shape({
-    onChange: _propTypes.default.func,
-    options: _propTypes.default.arrayOf(_propTypes.default.shape(_extends({}, _select.SelectOptionPropTypes, {
-      count: _propTypes.default.number
-    })))
-  }),
+  filters: _propTypes.default.arrayOf(_propTypes.default.shape(_extends({}, _select.SelectOptionPropTypes, {
+    count: _propTypes.default.number
+  }))),
   isLoading: _propTypes.default.bool,
   onAdd: _propTypes.default.func
 } : {};

package/lib/organism/brand-learning-priorities/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["BrandLearningPriorities","props","context","content","priorities","filters","isLoading","onAdd","openModal","setOpenModal","useState","skin","translate","primarySkinColor","selectedPriorities","useMemo","items","map","priority","priorityRef","Loading","useCallback","style","loading","handleOpenModal","handleCloseModal","container","LPtitle","LPdescription","ctaWrapper","priorityCount","length","backgroundColor","color","transition","width","convert","position","faIcon","name","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","shape","DraggableList","arrayOf","ref","string","title","courses","number","type","onChange","func","options","SelectOptionPropTypes","count","bool"],"sources":["../../../src/organism/brand-learning-priorities/index.js"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport DraggableList from '../../molecule/draggable-list';\nimport ButtonLink from '../../atom/button-link';\nimport LearningPriorityModal from '../../molecule/learning-priority-modal';\nimport style from './style.css';\n\nconst BrandLearningPriorities = (props, context) => {\n  const {content, priorities, filters, isLoading, onAdd} = props;\n  const [openModal, setOpenModal] = useState(false);\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const selectedPriorities = useMemo(\n    () => content.items.map(priority => priority.priorityRef),\n    [content.items]\n  );\n\n  const Loading = useCallback(\n    () => (\n      <div className={style.loading}>\n        <Loader />\n      </div>\n    ),\n    []\n  );\n\n  const handleOpenModal = useCallback(() => setOpenModal(true), [setOpenModal]);\n  const handleCloseModal = useCallback(() => setOpenModal(false), [setOpenModal]);\n  return (\n    <div className={style.container}>\n      <LearningPriorityModal\n        isLoading={isLoading}\n        isOpen={openModal}\n        onCancel={handleCloseModal}\n        onClose={handleCloseModal}\n        onAdd={onAdd}\n        priorities={priorities}\n        filters={filters}\n        preselected={selectedPriorities}\n      />\n      <div className={style.LPtitle}>{translate('learning_priorities')}</div>\n      <div className={style.LPdescription}>\n        {translate('learning_priorities_brand_description')}\n      </div>\n\n      {isLoading ? (\n        <Loading />\n      ) : (\n        <>\n          <div className={style.ctaWrapper}>\n            <div className={style.priorityCount}>\n              {`${content.items.length} ${translate('items')}`}\n            </div>\n            <ButtonLink\n              customStyle={{\n                backgroundColor: primarySkinColor,\n                color: '#FFFFFF',\n                transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n                width: 'fit-content'\n              }}\n              hoverBackgroundColor={convert(`color(${primarySkinColor} a(0.07))`)}\n              hoverColor={primarySkinColor}\n              onClick={handleOpenModal}\n              label={translate('add_learning_priority')}\n              data-name=\"add-learning-priority\"\n              icon={{\n                position: 'left',\n                faIcon: {\n                  name: 'plus',\n                  backgroundColor: primarySkinColor,\n                  color: '#FFFFFF',\n                  size: 16\n                }\n              }}\n            />\n          </div>\n          <DraggableList {...content} />\n        </>\n      )}\n    </div>\n  );\n};\n\nBrandLearningPriorities.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nBrandLearningPriorities.propTypes = {\n  content: PropTypes.shape(DraggableList.propTypes),\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      ref: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.string\n    })\n  ),\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(\n      PropTypes.shape({\n        ...SelectOptionPropTypes,\n        count: PropTypes.number\n      })\n    )\n  }),\n  isLoading: PropTypes.bool,\n  onAdd: PropTypes.func\n};\n\nexport default BrandLearningPriorities;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["BrandLearningPriorities","props","context","content","priorities","filters","isLoading","onAdd","openModal","setOpenModal","useState","skin","translate","primarySkinColor","selectedPriorities","useMemo","items","map","priority","priorityRef","Loading","useCallback","style","loading","handleOpenModal","handleCloseModal","container","LPtitle","LPdescription","ctaWrapper","priorityCount","length","backgroundColor","color","transition","width","convert","position","faIcon","name","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","shape","DraggableList","arrayOf","ref","string","title","courses","number","type","SelectOptionPropTypes","count","bool","func"],"sources":["../../../src/organism/brand-learning-priorities/index.js"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport DraggableList from '../../molecule/draggable-list';\nimport ButtonLink from '../../atom/button-link';\nimport LearningPriorityModal from '../../molecule/learning-priority-modal';\nimport style from './style.css';\n\nconst BrandLearningPriorities = (props, context) => {\n  const {content, priorities, filters, isLoading, onAdd} = props;\n  const [openModal, setOpenModal] = useState(false);\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const selectedPriorities = useMemo(\n    () => content.items.map(priority => priority.priorityRef),\n    [content.items]\n  );\n\n  const Loading = useCallback(\n    () => (\n      <div className={style.loading}>\n        <Loader />\n      </div>\n    ),\n    []\n  );\n\n  const handleOpenModal = useCallback(() => setOpenModal(true), [setOpenModal]);\n  const handleCloseModal = useCallback(() => setOpenModal(false), [setOpenModal]);\n  return (\n    <div className={style.container}>\n      <LearningPriorityModal\n        isLoading={isLoading}\n        isOpen={openModal}\n        onCancel={handleCloseModal}\n        onClose={handleCloseModal}\n        onAdd={onAdd}\n        priorities={priorities}\n        filters={filters}\n        preselected={selectedPriorities}\n      />\n      <div className={style.LPtitle}>{translate('learning_priorities')}</div>\n      <div className={style.LPdescription}>\n        {translate('learning_priorities_brand_description')}\n      </div>\n\n      {isLoading ? (\n        <Loading />\n      ) : (\n        <>\n          <div className={style.ctaWrapper}>\n            <div className={style.priorityCount}>\n              {`${content.items.length} ${translate('items')}`}\n            </div>\n            <ButtonLink\n              customStyle={{\n                backgroundColor: primarySkinColor,\n                color: '#FFFFFF',\n                transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n                width: 'fit-content'\n              }}\n              hoverBackgroundColor={convert(`color(${primarySkinColor} a(0.07))`)}\n              hoverColor={primarySkinColor}\n              onClick={handleOpenModal}\n              label={translate('add_learning_priority')}\n              data-name=\"add-learning-priority\"\n              icon={{\n                position: 'left',\n                faIcon: {\n                  name: 'plus',\n                  backgroundColor: primarySkinColor,\n                  color: '#FFFFFF',\n                  size: 16\n                }\n              }}\n            />\n          </div>\n          <DraggableList {...content} />\n        </>\n      )}\n    </div>\n  );\n};\n\nBrandLearningPriorities.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nBrandLearningPriorities.propTypes = {\n  content: PropTypes.shape(DraggableList.propTypes),\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      ref: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.string\n    })\n  ),\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...SelectOptionPropTypes,\n      count: PropTypes.number\n    })\n  ),\n  isLoading: PropTypes.bool,\n  onAdd: PropTypes.func\n};\n\nexport default BrandLearningPriorities;\n"],"mappings":"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"}

package/lib/template/back-office/brand-update/index.d.ts

@@ -862,16 +862,13 @@ declare namespace BrandUpdate {
                 courses: PropTypes.Requireable<number>;
                 type: PropTypes.Requireable<string>;
             }> | null | undefined)[]>;
-            filters: PropTypes.Requireable<PropTypes.InferProps<{
-                onChange: PropTypes.Requireable<(...args: any[]) => any>;
-                options: PropTypes.Requireable<(PropTypes.InferProps<{
-                    count: PropTypes.Requireable<number>;
-                    name: PropTypes.Validator<string>;
-                    value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                    selected: PropTypes.Requireable<boolean>;
-                    validOption: PropTypes.Requireable<boolean>;
-                }> | null | undefined)[]>;
-            }>>;
+            filters: PropTypes.Requireable<(PropTypes.InferProps<{
+                count: PropTypes.Requireable<number>;
+                name: PropTypes.Validator<string>;
+                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+                selected: PropTypes.Requireable<boolean>;
+                validOption: PropTypes.Requireable<boolean>;
+            }> | null | undefined)[]>;
             isLoading: PropTypes.Requireable<boolean>;
             onAdd: PropTypes.Requireable<(...args: any[]) => any>;
         }> | null | undefined>>;

package/locales/en/global.json

@@ -49,6 +49,7 @@
   "empty_search_result_clear_search": "Clear search",
   "keep_subscription": "Keep my subscription",
   "learning_priorities": "Learning priorities",
+  "learning_priorities_description": "Your top learning priorities defined by your company",
   "learning_priorities_brand_description": "Define learning priorities for your company with skills, playlists or certifications. They will appear on the My Learning page.",
   "media_stars_to_win_plural": "Win {{count}} additional stars in this chapter the first time you view a lesson!",
   "media_stars_to_win": "Win {{count}} additional star in this chapter the first time you view a lesson!",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "11.32.20-alpha.38.37+7a0dbaca0",
+  "version": "11.32.20-alpha.40+aa87af2bc",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -177,5 +177,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "7a0dbaca0e641701e53e18ee1951ead91b8e6873"
+  "gitHead": "aa87af2bcbbb0a59f3ffcd7fc95a1557eba39cca"
 }