message: Sort catalog filters
diff: @@ -24,6 +24,13 @@ const CatalogFilters: React.FC<CatalogFiltersProps> = ({
  onFilterChange,
  onShowAllToggle,
  }) => {
  + const sortedActiveFilters = Object.keys(activeFilters)
  + .sort()
  + .reduce((acc, groupName) => {
  + acc[groupName] = activeFilters[groupName];
  + return acc;
  + }, {});
  +
  const renderFilterItem = (filter, filterName, groupName) => {
  const { label, active } = filter;
  const count = filterGroupCounts[groupName]?.[filterName] ?? 0;
  @@ -47,8 +54,14 @@ const CatalogFilters: React.FC<CatalogFiltersProps> = ({
  );
  };
  - const renderFilterGroup = (filterGroup, groupName) =>
  - Object.keys(filterGroup).length > 1 ? (
  + const renderFilterGroup = (filterGroup, groupName) => {
  + const filterGroupKeys = Object.keys(filterGroup);
  + if (filterGroupKeys.length > 1) {
  + const sortedFilterGroup = filterGroupKeys.sort().reduce((acc, filterName) => {
  + acc[filterName] = filterGroup[filterName];
  + return acc;
  + }, {});
  + return (
  <FilterSidePanelCategory
  key={groupName}
  title={filterGroupNameMap[groupName] || groupName}
  @@ -56,15 +69,20 @@ const CatalogFilters: React.FC<CatalogFiltersProps> = ({
  showAll={filterGroupsShowAll[groupName] ?? false}
  data-test-group-name={groupName}
  >
  - {_.map(filterGroup, (filter, filterName) =>
  + {_.map(sortedFilterGroup, (filter, filterName) =>
  renderFilterItem(filter, filterName, groupName),
  )}
  </FilterSidePanelCategory>
  - ) : null;
  + );
  + }
  + return null;
  + };
  return (
  <FilterSidePanel>
  - {_.map(activeFilters, (filterGroup, groupName) => renderFilterGroup(filterGroup, groupName))}
  + {_.map(sortedActiveFilters, (filterGroup, groupName) =>
  + renderFilterGroup(filterGroup, groupName),
  + )}
  </FilterSidePanel>
  );
  };
  