breadcrumb updates

client/components/Breadcrumb/Breadcrumb.module.scss

@@ -0,0 +1,3 @@
+.breadcrumb {
+    margin-left: -10px;
+}

client/components/Breadcrumb/Breadcrumb.tsx

@@ -3,12 +3,16 @@ import { ReusableComponent } from 'components/types'
 import React from 'react'
 import { renderBreadcrumbItem } from './renderBreadcrumbItem'
 import { IBreadcrumbComponentProps } from './types'
+import styles from './Breadcrumb.module.scss'
+import { mergeClasses } from '@fluentui/react-components'
 
 export const BreadcrumbComponent: ReusableComponent<
   IBreadcrumbComponentProps
 > = (props) => {
   return (
-    <div className={props.className}>
+    <div
+      className={mergeClasses(BreadcrumbComponent.className, props.className)}
+    >
       <Breadcrumb size='large'>
         {props.items.map((item) => renderBreadcrumbItem(item, props.items))}
       </Breadcrumb>
@@ -17,6 +21,7 @@ export const BreadcrumbComponent: ReusableComponent<
 }
 
 BreadcrumbComponent.displayName = 'Breadcrumb'
+BreadcrumbComponent.className = styles.breadcrumb
 BreadcrumbComponent.defaultProps = {
   items: []
 }

client/components/List/reducer.ts

@@ -45,12 +45,12 @@ function applyFilters<T = any>(
     (item) =>
       _.filter(Object.keys(filterValues), (key) => {
         const value = get(item as any, key, '')
-        switch (typeof value) {
+        switch (typeof filterValues[key]) {
           case 'boolean': {
             return filterValues[key] === value
           }
           default: {
-            return filterValues[key].includes(value)
+            return filterValues[key]?.includes(value)
           }
         }
       }).length === Object.keys(filterValues).length