t3code/apps/web/src/components/chat/composerMenuHighlight.test.ts at 83a00449c8b8ad8efde030d04eeb339437568701 · pingdotgg/t3code · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
import { describe, expect, it } from "vitest";

import {
  resolveComposerMenuActiveItemId,
  resolveComposerMenuNudgedItemId,
} from "./composerMenuHighlight";

describe("resolveComposerMenuActiveItemId", () => {
  const items = [{ id: "top" }, { id: "second" }, { id: "third" }] as const;

  it("defaults to the first item when nothing is highlighted", () => {
    expect(
      resolveComposerMenuActiveItemId({
        items,
        highlightedItemId: null,
        currentSearchKey: "skill:u",
        highlightedSearchKey: null,
      }),
    ).toBe("top");
  });

  it("preserves the highlighted item within the same query", () => {
    expect(
      resolveComposerMenuActiveItemId({
        items,
        highlightedItemId: "second",
        currentSearchKey: "skill:u",
        highlightedSearchKey: "skill:u",
      }),
    ).toBe("second");
  });

  it("resets to the top result when the query changes", () => {
    expect(
      resolveComposerMenuActiveItemId({
        items,
        highlightedItemId: "second",
        currentSearchKey: "skill:ui",
        highlightedSearchKey: "skill:u",
      }),
    ).toBe("top");
  });

  it("falls back to the first item when the highlighted item disappears", () => {
    expect(
      resolveComposerMenuActiveItemId({
        items,
        highlightedItemId: "missing",
        currentSearchKey: "skill:ui",
        highlightedSearchKey: "skill:ui",
      }),
    ).toBe("top");
  });
});

describe("resolveComposerMenuNudgedItemId", () => {
  const items = [{ id: "top" }, { id: "second" }, { id: "third" }] as const;

  it("moves from the active item", () => {
    expect(
      resolveComposerMenuNudgedItemId({
        items,
        activeItemId: "second",
        direction: "next",
      }),
    ).toBe("third");

    expect(
      resolveComposerMenuNudgedItemId({
        items,
        activeItemId: "second",
        direction: "previous",
      }),
    ).toBe("top");
  });

  it("wraps around at either edge", () => {
    expect(
      resolveComposerMenuNudgedItemId({
        items,
        activeItemId: "third",
        direction: "next",
      }),
    ).toBe("top");

    expect(
      resolveComposerMenuNudgedItemId({
        items,
        activeItemId: "top",
        direction: "previous",
      }),
    ).toBe("third");
  });

  it("starts from the first visible item when active state is stale", () => {
    expect(
      resolveComposerMenuNudgedItemId({
        items,
        activeItemId: "missing",
        direction: "next",
      }),
    ).toBe("top");

    expect(
      resolveComposerMenuNudgedItemId({
        items,
        activeItemId: "missing",
        direction: "previous",
      }),
    ).toBe("third");
  });
});