diff --git a/apps/web/tests/misc/combobox-order-options.test.ts b/apps/web/tests/misc/combobox-order-options.test.ts new file mode 100644 index 00000000000..5d14498d024 --- /dev/null +++ b/apps/web/tests/misc/combobox-order-options.test.ts @@ -0,0 +1,52 @@ +import { describe, expect, it } from "vitest"; +import { orderComboboxOptions } from "../../../../packages/ui/src/combobox/order-options"; + +const options = [ + { value: "a", label: "A", first: true }, + { value: "b", label: "B" }, + { value: "c", label: "C" }, + { value: "d", label: "D" }, +]; + +describe("orderComboboxOptions", () => { + it("moves the selection to the top, after options marked first", () => { + expect( + orderComboboxOptions(options, [{ value: "c", label: "C" }], ""), + ).toEqual([ + { value: "a", label: "A", first: true }, + { value: "c", label: "C" }, + { value: "b", label: "B" }, + { value: "d", label: "D" }, + ]); + }); + + it("keeps the incoming order while a search is active", () => { + expect( + orderComboboxOptions(options, [{ value: "c", label: "C" }], "b"), + ).toEqual(options); + }); + + it("keeps the caller's order when preserveOrder is set", () => { + expect( + orderComboboxOptions(options, [{ value: "c", label: "C" }], "", true), + ).toBe(options); + }); + + it("appends a selection that is missing from the options without reordering", () => { + expect( + orderComboboxOptions(options, [{ value: "z", label: "Z" }], "", true), + ).toEqual([...options, { value: "z", label: "Z" }]); + }); + + it("still shows a selection that is missing from the options", () => { + expect( + orderComboboxOptions(options, [{ value: "z", label: "Z" }], ""), + ).toEqual([ + { value: "a", label: "A", first: true }, + { value: "z", label: "Z" }, + { value: "b", label: "B" }, + { value: "c", label: "C" }, + { value: "d", label: "D" }, + ]); + }); +}); diff --git a/apps/web/ui/partners/groups/group-selector.tsx b/apps/web/ui/partners/groups/group-selector.tsx index cbe4a18185b..f4b8917f9d1 100644 --- a/apps/web/ui/partners/groups/group-selector.tsx +++ b/apps/web/ui/partners/groups/group-selector.tsx @@ -119,6 +119,7 @@ export function GroupSelector({ }, })} {...rest} + preserveOrder > {variant === "header" && !selectedOption?.label ? (
diff --git a/packages/ui/src/combobox/index.tsx b/packages/ui/src/combobox/index.tsx index 7a4f14c3474..2a07cfadc36 100644 --- a/packages/ui/src/combobox/index.tsx +++ b/packages/ui/src/combobox/index.tsx @@ -18,6 +18,7 @@ import { Check2, CheckboxIcon, Icon, LoadingSpinner, Plus } from "../icons"; import { Popover, PopoverProps } from "../popover"; import { ScrollContainer } from "../scroll-container"; import { Tooltip } from "../tooltip"; +import { orderComboboxOptions } from "./order-options"; export type ComboboxOption