Merge pull request #809 from navikt/typescript-sort-filters

Refactor sorting utils and add tests

src/app/(sok)/_components/filters/Engagement.tsx

@@ -2,7 +2,7 @@ import React, { ReactElement } from "react";
 import { BodyShort, Checkbox, CheckboxGroup } from "@navikt/ds-react";
 import moveFilterToBottom from "@/app/(sok)/_components/utils/moveFilterToBottom";
 import mergeCount from "@/app/(sok)/_components/utils/mergeCount";
-import sortValuesByFirstLetter from "@/app/(sok)/_components/utils/sortValuesByFirstLetter";
+import sortFiltersAlphabetically from "@/app/(sok)/_components/utils/sortFiltersAlphabetically";
 import { logFilterChanged } from "@/app/_common/monitoring/amplitude";
 import { ENGAGEMENT_TYPE } from "@/app/(sok)/_components/searchParamNames";
 import useSearchQuery from "@/app/(sok)/_components/SearchQueryProvider";
@@ -27,7 +27,7 @@ interface EngagementProps {
 }
 
 export default function Engagement({ initialValues, updatedValues }: EngagementProps): ReactElement {
-    const sortedValuesByFirstLetter = sortValuesByFirstLetter(initialValues);
+    const sortedValuesByFirstLetter = sortFiltersAlphabetically(initialValues);
     const sortedValues = moveFilterToBottom(sortedValuesByFirstLetter, "Annet");
     const values = mergeCount(sortedValues, updatedValues);
     const searchQuery = useSearchQuery();

src/app/(sok)/_components/filters/Occupations.tsx

@@ -2,7 +2,7 @@ import React, { ReactElement } from "react";
 import { BodyShort, Box, Checkbox, CheckboxGroup, ReadMore } from "@navikt/ds-react";
 import moveFilterToBottom from "@/app/(sok)/_components/utils/moveFilterToBottom";
 import { mergeCountOccupations } from "@/app/(sok)/_components/utils/mergeCount";
-import sortValuesByFirstLetter from "@/app/(sok)/_components/utils/sortValuesByFirstLetter";
+import sortFiltersAlphabetically from "@/app/(sok)/_components/utils/sortFiltersAlphabetically";
 import { logFilterChanged } from "@/app/_common/monitoring/amplitude";
 import { OCCUPATION_FIRST_LEVEL, OCCUPATION_SECOND_LEVEL } from "@/app/(sok)/_components/searchParamNames";
 import useSearchQuery from "@/app/(sok)/_components/SearchQueryProvider";
@@ -21,14 +21,14 @@ interface OccupationsProps {
 
 export default function Occupations({ initialValues, updatedValues }: OccupationsProps): ReactElement {
     const withSortedSecondLevelOccupations = initialValues.map((item) => {
-        const secondLevel = sortValuesByFirstLetter(item.occupationSecondLevels);
+        const secondLevel = sortFiltersAlphabetically(item.occupationSecondLevels);
         return {
             secondLevel,
             ...item,
         };
     });
 
-    const sortedByLetterFirstLevelOccupations = sortValuesByFirstLetter(withSortedSecondLevelOccupations);
+    const sortedByLetterFirstLevelOccupations = sortFiltersAlphabetically(withSortedSecondLevelOccupations);
     const sortedValues = moveFilterToBottom(
         sortedByLetterFirstLevelOccupations,
         OCCUPATION_LEVEL_OTHER,

src/app/(sok)/_components/filters/Published.tsx

@@ -1,7 +1,7 @@
 import React, { ReactElement } from "react";
 import { Radio, RadioGroup } from "@navikt/ds-react";
 import mergeCount from "@/app/(sok)/_components/utils/mergeCount";
-import sortPublishedValues from "@/app/(sok)/_components/utils/sortPublishedValues";
+import sortPublishedFiltersByDayOffset from "@/app/(sok)/_components/utils/sortPublishedFiltersByDayOffset";
 import { logFilterChanged } from "@/app/_common/monitoring/amplitude";
 import { PUBLISHED } from "@/app/(sok)/_components/searchParamNames";
 import useSearchQuery from "@/app/(sok)/_components/SearchQueryProvider";
@@ -15,7 +15,7 @@ interface PublishedProps {
 }
 
 export default function Published({ initialValues, updatedValues, publishedTotalCount }: PublishedProps): ReactElement {
-    const sortedValues = sortPublishedValues(initialValues);
+    const sortedValues = sortPublishedFiltersByDayOffset(initialValues);
     const values = mergeCount(sortedValues, updatedValues);
     const searchQuery = useSearchQuery();
 

src/app/(sok)/_components/filters/Remote.tsx

@@ -2,7 +2,7 @@ import React, { ReactElement } from "react";
 import { BodyShort, Checkbox, CheckboxGroup } from "@navikt/ds-react";
 import moveFilterToBottom from "@/app/(sok)/_components/utils/moveFilterToBottom";
 import mergeCount from "@/app/(sok)/_components/utils/mergeCount";
-import sortRemoteValues from "@/app/(sok)/_components/utils/sortRemoteValues";
+import sortRemoteFilters from "@/app/(sok)/_components/utils/sortRemoteFilters";
 import { logFilterChanged } from "@/app/_common/monitoring/amplitude";
 import { REMOTE } from "@/app/(sok)/_components/searchParamNames";
 import useSearchQuery from "@/app/(sok)/_components/SearchQueryProvider";
@@ -14,7 +14,7 @@ interface RemoteProps {
 }
 
 export default function Remote({ initialValues, updatedValues }: RemoteProps): ReactElement {
-    const sortedValuesByFirstLetter = sortRemoteValues(initialValues);
+    const sortedValuesByFirstLetter = sortRemoteFilters(initialValues);
     const sortedValues = moveFilterToBottom(sortedValuesByFirstLetter, "Ikke oppgitt");
     const values = mergeCount(sortedValues, updatedValues);
     const searchQuery = useSearchQuery();

src/app/(sok)/_components/filters/Sector.tsx

@@ -2,7 +2,7 @@ import React, { ReactElement } from "react";
 import { BodyShort, Checkbox, CheckboxGroup } from "@navikt/ds-react";
 import moveFilterToBottom from "@/app/(sok)/_components/utils/moveFilterToBottom";
 import mergeCount from "@/app/(sok)/_components/utils/mergeCount";
-import sortValuesByFirstLetter from "@/app/(sok)/_components/utils/sortValuesByFirstLetter";
+import sortFiltersAlphabetically from "@/app/(sok)/_components/utils/sortFiltersAlphabetically";
 import { logFilterChanged } from "@/app/_common/monitoring/amplitude";
 import { SECTOR } from "@/app/(sok)/_components/searchParamNames";
 import useSearchQuery from "@/app/(sok)/_components/SearchQueryProvider";
@@ -14,7 +14,7 @@ interface SectorProps {
 }
 
 export default function Sector({ initialValues, updatedValues }: SectorProps): ReactElement {
-    const sortedValuesByFirstLetter = sortValuesByFirstLetter(initialValues);
+    const sortedValuesByFirstLetter = sortFiltersAlphabetically(initialValues);
     const sortedValues = moveFilterToBottom(sortedValuesByFirstLetter, "Ikke oppgitt");
     const values = mergeCount(sortedValues, updatedValues);
     const searchQuery = useSearchQuery();

src/app/(sok)/_components/searchBox/buildSearchBoxOptions.ts

@@ -1,6 +1,6 @@
 import { editedItemKey } from "@/app/(sok)/_components/filters/Engagement";
 import { editedItemKey as editedOccupation } from "@/app/(sok)/_components/filters/Occupations";
-import sortValuesByFirstLetter from "@/app/(sok)/_components/utils/sortValuesByFirstLetter";
+import sortFiltersAlphabetically from "@/app/(sok)/_components/utils/sortFiltersAlphabetically";
 import fixLocationName from "@/app/_common/utils/fixLocationName";
 import buildLocations from "@/app/(sok)/_components/utils/buildLocations";
 import { labelForNeedDriversLicense } from "@/app/(sok)/_components/filters/DriversLicense";
@@ -87,7 +87,7 @@ function getCountryOptions(locationList: LocationList[]): ComboboxOption[] {
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 function withSortedSecondLevelOccupations(aggregations: FilterAggregations) {
     return aggregations.occupationFirstLevels.map((item) => {
-        const secondLevel = sortValuesByFirstLetter(item.occupationSecondLevels);
+        const secondLevel = sortFiltersAlphabetically(item.occupationSecondLevels);
         return {
             secondLevel,
             ...item,
@@ -96,7 +96,7 @@ function withSortedSecondLevelOccupations(aggregations: FilterAggregations) {
 }
 
 function getFirstLevelOccupationsOptions(aggregations: FilterAggregations): ComboboxOption[] {
-    return sortValuesByFirstLetter(withSortedSecondLevelOccupations(aggregations)).map(
+    return sortFiltersAlphabetically(withSortedSecondLevelOccupations(aggregations)).map(
         (occupation: { key: string }): ComboboxOption =>
             editedOccupation(occupation.key) === "Ikke oppgitt"
                 ? { label: "Yrke ikke oppgitt", value: `${OCCUPATION_FIRST_LEVEL}-${occupation.key}` }

src/app/(sok)/_components/utils/sortFiltersAlphabetically.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, test } from "vitest";
+import { FilterAggregation } from "@/app/(sok)/_types/FilterAggregations";
+import sortFiltersAlphabetically from "@/app/(sok)/_components/utils/sortFiltersAlphabetically";
+
+describe("sortFiltersAlphabetically", () => {
+    test("Should sort filters alphabetically", () => {
+        const filters: FilterAggregation[] = [
+            { key: "a", count: 1 },
+            { key: "a2", count: 1 },
+            { key: "a1", count: 1 },
+            { key: "c", count: 1 },
+            { key: "b", count: 1 },
+        ];
+
+        const expected: FilterAggregation[] = [
+            { key: "a", count: 1 },
+            { key: "a1", count: 1 },
+            { key: "a2", count: 1 },
+            { key: "b", count: 1 },
+            { key: "c", count: 1 },
+        ];
+
+        const result = sortFiltersAlphabetically(filters);
+
+        expect(result).toEqual(expected);
+    });
+});

src/app/(sok)/_components/utils/sortFiltersAlphabetically.ts

@@ -0,0 +1,9 @@
+import { FilterAggregation } from "@/app/(sok)/_types/FilterAggregations";
+
+export default function sortFiltersAlphabetically(filters: FilterAggregation[]): FilterAggregation[] {
+    const clone = filters;
+
+    clone.sort((a, b) => a.key.localeCompare(b.key, "no"));
+
+    return clone;
+}

src/app/(sok)/_components/utils/sortPublishedFiltersByDayOffset.test.ts

@@ -0,0 +1,23 @@
+import { describe, expect, test } from "vitest";
+import { FilterAggregation } from "@/app/(sok)/_types/FilterAggregations";
+import sortPublishedFiltersByDayOffset from "@/app/(sok)/_components/utils/sortPublishedFiltersByDayOffset";
+
+describe("sortPublishedFiltersByDayOffset", () => {
+    test("Should sort filters by days offset", () => {
+        const filters: FilterAggregation[] = [
+            { key: "now-3d", count: 1 },
+            { key: "now-7d", count: 1 },
+            { key: "now/d", count: 1 },
+        ];
+
+        const expected: FilterAggregation[] = [
+            { key: "now/d", count: 1 },
+            { key: "now-3d", count: 1 },
+            { key: "now-7d", count: 1 },
+        ];
+
+        const result = sortPublishedFiltersByDayOffset(filters);
+
+        expect(result).toEqual(expected);
+    });
+});

src/app/(sok)/_components/utils/sortPublishedFiltersByDayOffset.ts

@@ -0,0 +1,10 @@
+import { FilterAggregation } from "@/app/(sok)/_types/FilterAggregations";
+
+export default function sortPublishedFiltersByDayOffset(filters: FilterAggregation[]): FilterAggregation[] {
+    const publishedValuesByDayOffset = ["now/d", "now-3d", "now-7d"];
+    const clone = filters;
+
+    clone.sort((a, b) => publishedValuesByDayOffset.indexOf(a.key) - publishedValuesByDayOffset.indexOf(b.key));
+
+    return clone;
+}

src/app/(sok)/_components/utils/sortRemoteFilters.test.ts

@@ -0,0 +1,23 @@
+import { describe, expect, test } from "vitest";
+import { FilterAggregation } from "@/app/(sok)/_types/FilterAggregations";
+import sortRemoteFilters from "@/app/(sok)/_components/utils/sortRemoteFilters";
+
+describe("sortRemoteFilters", () => {
+    test("Should sort filters by expected order", () => {
+        const filters: FilterAggregation[] = [
+            { key: "Hjemmekontor ikke mulig", count: 1 },
+            { key: "Hybridkontor", count: 1 },
+            { key: "Hjemmekontor", count: 1 },
+        ];
+
+        const expected: FilterAggregation[] = [
+            { key: "Hybridkontor", count: 1 },
+            { key: "Hjemmekontor", count: 1 },
+            { key: "Hjemmekontor ikke mulig", count: 1 },
+        ];
+
+        const result = sortRemoteFilters(filters);
+
+        expect(result).toEqual(expected);
+    });
+});

src/app/(sok)/_components/utils/sortRemoteValues.js → src/app/(sok)/_components/utils/sortRemoteFilters.ts

@@ -1,9 +1,8 @@
-/**
- * Sorter publisert basert på egen array
- */
-export default function sortRemoteValues(facets) {
+import { FilterAggregation } from "@/app/(sok)/_types/FilterAggregations";
+
+export default function sortRemoteFilters(filter: FilterAggregation[]): FilterAggregation[] {
     const sortedPublishedValues = ["Hybridkontor", "Hjemmekontor", "Hjemmekontor ikke mulig"];
-    const clone = facets;
+    const clone = filter;
 
     clone.sort((a, b) => sortedPublishedValues.indexOf(a.key) - sortedPublishedValues.indexOf(b.key));