142 |
}
144 | onClick={() => i18n.changeLanguage(i18n.language === "en" ? "de" : "en")}>
145 | {t(i18n.language === "en" ? "de" : "en")}
146 |
147 |
148 | {
149 | setNewItemName(e.target.value)
150 | }}/>
151 | {
152 | setNewItemPrice(e.target.value)
153 | }}/>
154 | {
155 | setNewItemStock(e.target.value)
156 | }}/>
157 |
176 |
177 |
{
186 | setQ(result);
187 | }}
188 | onChangePage={nextPage => {
189 | setCurrentPage(nextPage);
190 | }}
191 | onChangeRowsPerPage={nextPerPage => {
192 | setCurrentPageSize(nextPerPage);
193 | setCurrentPage(0);
194 | }}
195 | onOrderChange={(newSortFieldIndex, newSortOrder) => {
196 | const newSortField = fields[newSortFieldIndex];
197 | setCurrentSortField(newSortField || undefined);
198 | setCurrentSortOrder(newSortOrder || undefined);
199 | }}
200 | data={mappedData}
201 | />
202 |
203 | );
204 | };
205 |
206 | Home.getInitialProps = async () => ({
207 | namespacesRequired: ["translation"]
208 | });
209 |
210 | export default Home;
211 |
--------------------------------------------------------------------------------
/packages/utils/test/array.ts:
--------------------------------------------------------------------------------
1 | import test from "ava";
2 | import {
3 | hasMatch,
4 | compare,
5 | sortByField,
6 | withSorting,
7 | withPagination,
8 | withFilter
9 | } from "../src/array";
10 |
11 | function range(n, start = 1) {
12 | return new Array(n).fill(Boolean).map((x, i) => i + start);
13 | }
14 |
15 | function buildEntries() {
16 | const names = ["Jack", "Jane", "John", "Jeremy", "Jenny"];
17 | return [
18 | ...range(names.length).map((x, i) => ({
19 | id: `a__${`${i}`.padStart(3, "0")}`,
20 | name: `${names[i]} Doe`,
21 | age: 20 + i
22 | })),
23 | ...range(names.length).map((x, i) => ({
24 | id: `b__${`${i}`.padStart(3, "0")}`,
25 | name: `${names[i]} Simpson`,
26 | age: 30 + i
27 | })),
28 | ...range(names.length).map((x, i) => ({
29 | id: `c__${`${i}`.padStart(3, "0")}`,
30 | name: `${names[i]} Griffin`,
31 | age: 40 + i
32 | })),
33 | ...range(names.length).map((x, i) => ({
34 | id: `d__${`${i}`.padStart(3, "0")}`,
35 | name: `${names[i]} Smith`,
36 | age: 50 + i
37 | })),
38 | ...range(names.length).map((x, i) => ({
39 | id: `e__${`${i}`.padStart(3, "0")}`,
40 | name: `${names[i]} Belcher`,
41 | age: 50 + i
42 | }))
43 | ];
44 | }
45 |
46 | test("hasMatch() matches strings", t => {
47 | const expected = "ell";
48 | const [actual] = hasMatch("hello", "ell");
49 | t.is(actual, expected);
50 | });
51 |
52 | test("hasMatch() matches numbers", t => {
53 | const expected = "10";
54 | const [actual] = hasMatch(108, "10");
55 | t.is(actual, expected);
56 | });
57 |
58 | test("hasMatch() matches case insensitive", t => {
59 | const expected = "foob";
60 | const [actual] = hasMatch("FooBar", "fOOb");
61 | t.is(actual, expected);
62 | });
63 |
64 | test("compare() compares `a` and `b` with `lt` as `a < b", t => {
65 | t.true(compare(10, 20, "lt"));
66 | t.false(compare(20, 10, "lt"));
67 | });
68 |
69 | test("compare() compares `a` and `b` with `lte` as `a <= b", t => {
70 | t.true(compare(10, 20, "lte"));
71 | t.true(compare(20, 20, "lte"));
72 | t.false(compare(20, 10, "lte"));
73 | });
74 |
75 | test("compare() compares `a` and `b` with `gt` as `a > b", t => {
76 | t.true(compare(20, 10, "gt"));
77 | t.false(compare(10, 20, "gt"));
78 | });
79 |
80 | test("compare() compares `a` and `b` with `gte` as `a >= b", t => {
81 | t.true(compare(20, 10, "gte"));
82 | t.true(compare(20, 20, "gte"));
83 | t.false(compare(10, 20, "gte"));
84 | });
85 |
86 | test("sortByField() sorts arrays of objects by field", t => {
87 | const [a, b, c, d] = [
88 | { a: 4, b: 18 },
89 | { a: 10, b: 4 },
90 | { a: 18, b: 10 },
91 | { a: 18, b: 18 }
92 | ];
93 | const original = [b, c, a, d];
94 | t.is(sortByField(original, "a")[0], a);
95 | t.is(sortByField(original, "a")[1], b);
96 | t.is(sortByField(original, "b")[0], b);
97 | t.is(sortByField(original, "b")[1], c);
98 | });
99 |
100 | test("sortByField() sorts arrays of objects case-insensitive", t => {
101 | const [a, b, c] = [
102 | { a: "AaA", b: "BbB" },
103 | { a: "aBA", b: "bCB" },
104 | { a: "AbB", b: "BcC" }
105 | ];
106 | const original = [b, c, a];
107 | t.is(sortByField(original, "a")[0], a);
108 | t.is(sortByField(original, "a")[1], b);
109 | });
110 |
111 | test("withSorting() sorts arrays of objects with config", t => {
112 | const [a, b, c] = [
113 | { a: "AaA", b: "BbB" },
114 | { a: "aBA", b: "bCB" },
115 | { a: "AbB", b: "BcC" }
116 | ];
117 | const original = [b, c, a];
118 | t.is(withSorting(original, { field: "a", order: "asc" })[0], a);
119 | t.is(withSorting(original, { field: "a", order: "asc" })[1], b);
120 | t.is(withSorting(original, { field: "a", order: "desc" })[0], c);
121 | t.is(withSorting(original, { field: "a", order: "desc" })[1], b);
122 | });
123 |
124 | test("withSorting() returns the unsorted list if `sorting` is undefined", t => {
125 | const [a, b, c] = [
126 | { a: "AaA", b: "BbB" },
127 | { a: "aBA", b: "bCB" },
128 | { a: "AbB", b: "BcC" }
129 | ];
130 |
131 | const original = [b, c, a];
132 | t.is(withSorting(original)[0], b);
133 | t.is(withSorting(original)[1], c);
134 | t.is(withSorting(original)[2], a);
135 | });
136 |
137 | test("withPagination() returns n items of an array", t => {
138 | const original = range(20);
139 | t.is(withPagination(original, { page: 0, pageSize: 3 }).length, 3);
140 | t.is(withPagination(original, { page: 1, pageSize: 12 }).length, 8);
141 | t.is(withPagination(original, { page: 0, pageSize: 20 }).length, 20);
142 | });
143 |
144 | test("withPagination() returns `undefined` for unavailable pages", t => {
145 | const original = range(20);
146 | t.is(withPagination(original, { page: 3, pageSize: 20 }), undefined);
147 | });
148 |
149 | test("withPagination() returns all items if `paging is undefined", t => {
150 | const original = range(20);
151 | t.is(withPagination(original).length, 20);
152 | });
153 | test("withFilter() filters items by `q`", t => {
154 | const original = buildEntries();
155 | t.is(withFilter(original, { q: "Doe" }).length, 5);
156 | t.is(withFilter(original, { q: "Ja" }).length, 10);
157 | t.is(withFilter(original, { q: "J" }).length, original.length);
158 | });
159 |
160 | test("withFilter() filters items by `fields`", t => {
161 | const original = buildEntries();
162 | t.is(withFilter(original, { fields: {
163 | name: "Doe"
164 | } }).length, 5);
165 | t.is(withFilter(original, { fields: {
166 | name: "Ja"
167 | } }).length, 10);
168 | t.is(withFilter(original, { fields: {
169 | age: "20"
170 | } }).length, 1);
171 | t.is(withFilter(original, { fields: {
172 | age: "2"
173 | } }).length, 9);
174 | });
175 |
176 | test("withFilter() filters items by numeric `fields` with custom operators", t => {
177 | const original = buildEntries();
178 | t.is(withFilter(original, { fields: {
179 | age_lt: "24"
180 | } }).length, 4);
181 | t.is(withFilter(original, { fields: {
182 | age_lte: "24"
183 | } }).length, 5);
184 | t.is(withFilter(original, { fields: {
185 | age_gt: "24"
186 | } }).length, 20);
187 | t.is(withFilter(original, { fields: {
188 | age_gte: "24"
189 | } }).length, 21);
190 | });
191 |
192 | test("withFilter() filters items by multiple `fields`", t => {
193 | const original = buildEntries();
194 | t.is(withFilter(original, { fields: {
195 | name: "Doe",
196 | age: "24"
197 | } }).length, 1);
198 | t.is(withFilter(original, { fields: {
199 | name: "Doe",
200 | age_lt: "24"
201 | } }).length, 4);
202 | });
203 |
204 | test("withFilter() returns all items if `filter` is undefined", t => {
205 | const original = buildEntries();
206 | const actual = withFilter(original);
207 | t.is(actual.length, original.length);
208 | });
209 |
--------------------------------------------------------------------------------