feat: Filter improvements

[ncomerci]

This closes #1301

[andyesp]

You can move this to a new component to reuse in CategoryOption, GroupedCategoryOption and GrantMultiCategory.

    <>
      <Link
        {...props}
        href={props.href || undefined}
        onClick={onClick}
        className={classNames(
          'CategoryOption',
          `CategoryOption--${type}`,
          active && 'CategoryOption--active',
          className
        )}
      >
        <span className="CategoryOption__TitleContainer">
          <span>
            {icon}
            <Text className="CategoryOption__Title">{title}</Text>
          </span>
        </span>
        {isNumber(count) && (
          <span className={classNames('CategoryOption__Counter', active && 'CategoryOption__Counter--active')}>
            {count}
          </span>
        )}
      </Link>
      {subcategories && (
        <div
          className={classNames(
            'CategoryOption__Subcategories',
            `CategoryOption__Subcategories--${type}`,
            isSubcategoriesExpanded && 'CategoryOption__Subcategories--active'
          )}
        >
          {subcategories}
        </div>
      )}
    </>

Maybe we can do something to add the subcategory component there too. But in the mean time you could also extract that into a "SubcategoryItem"

<Link
  className={classNames(
    'CategoryOption__SubcategoryItem',
    isActive && 'CategoryOption__SubcategoryItem--active'
  )}
  href={href}
>
  <SubItem />
  {title}
</Link>

[ginocingolani]

@ncomerci Comments:

• Implementation category should be named Governance Process
• The order of the categories with dropdowns should be Governance Process, Grants, B&T
• Not 100% related but since you're touching that part od the codebase: Replace "OOB" for "Out of Budget" on the Outcomes section