@jasperoosthoek/react-toolbox 0.8.0 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/change-log.md +330 -309
  2. package/dist/components/buttons/ConfirmButton.d.ts +2 -2
  3. package/dist/components/buttons/DeleteConfirmButton.d.ts +2 -2
  4. package/dist/components/buttons/IconButtons.d.ts +40 -41
  5. package/dist/components/errors/Errors.d.ts +1 -2
  6. package/dist/components/forms/FormField.d.ts +22 -0
  7. package/dist/components/forms/FormFields.d.ts +1 -56
  8. package/dist/components/forms/FormModal.d.ts +7 -34
  9. package/dist/components/forms/FormModalProvider.d.ts +19 -26
  10. package/dist/components/forms/FormProvider.d.ts +66 -0
  11. package/dist/components/forms/fields/FormBadgesSelection.d.ts +26 -0
  12. package/dist/components/forms/fields/FormCheckbox.d.ts +7 -0
  13. package/dist/components/forms/fields/FormDropdown.d.ts +19 -0
  14. package/dist/components/forms/fields/FormInput.d.ts +17 -0
  15. package/dist/components/forms/fields/FormSelect.d.ts +12 -0
  16. package/dist/components/forms/fields/index.d.ts +5 -0
  17. package/dist/components/indicators/CheckIndicator.d.ts +1 -2
  18. package/dist/components/indicators/LoadingIndicator.d.ts +4 -4
  19. package/dist/components/login/LoginPage.d.ts +1 -1
  20. package/dist/components/tables/DataTable.d.ts +2 -2
  21. package/dist/components/tables/DragAndDropList.d.ts +2 -2
  22. package/dist/components/tables/SearchBox.d.ts +2 -2
  23. package/dist/index.d.ts +4 -1
  24. package/dist/index.js +2 -2
  25. package/dist/index.js.LICENSE.txt +0 -4
  26. package/dist/localization/LocalizationContext.d.ts +1 -1
  27. package/dist/utils/hooks.d.ts +1 -1
  28. package/dist/utils/timeAndDate.d.ts +5 -2
  29. package/dist/utils/utils.d.ts +3 -3
  30. package/package.json +10 -11
  31. package/src/__tests__/buttons.test.tsx +545 -0
  32. package/src/__tests__/errors.test.tsx +339 -0
  33. package/src/__tests__/forms.test.tsx +3021 -0
  34. package/src/__tests__/hooks.test.tsx +413 -0
  35. package/src/__tests__/indicators.test.tsx +284 -0
  36. package/src/__tests__/localization.test.tsx +462 -0
  37. package/src/__tests__/login.test.tsx +417 -0
  38. package/src/__tests__/setupTests.ts +328 -0
  39. package/src/__tests__/tables.test.tsx +609 -0
  40. package/src/__tests__/timeAndDate.test.tsx +308 -0
  41. package/src/__tests__/utils.test.tsx +422 -0
  42. package/src/components/forms/FormField.tsx +92 -0
  43. package/src/components/forms/FormFields.tsx +3 -423
  44. package/src/components/forms/FormModal.tsx +168 -243
  45. package/src/components/forms/FormModalProvider.tsx +141 -95
  46. package/src/components/forms/FormProvider.tsx +218 -0
  47. package/src/components/forms/fields/FormBadgesSelection.tsx +108 -0
  48. package/src/components/forms/fields/FormCheckbox.tsx +76 -0
  49. package/src/components/forms/fields/FormDropdown.tsx +123 -0
  50. package/src/components/forms/fields/FormInput.tsx +114 -0
  51. package/src/components/forms/fields/FormSelect.tsx +47 -0
  52. package/src/components/forms/fields/index.ts +6 -0
  53. package/src/index.ts +32 -28
  54. package/src/localization/LocalizationContext.tsx +156 -131
  55. package/src/localization/localization.ts +131 -131
  56. package/src/utils/hooks.ts +108 -94
  57. package/src/utils/timeAndDate.ts +33 -4
  58. package/src/utils/utils.ts +74 -66
  59. package/dist/components/forms/CreateEditModal.d.ts +0 -41
  60. package/dist/components/forms/CreateEditModalProvider.d.ts +0 -41
  61. package/dist/components/forms/FormFields.test.d.ts +0 -4
  62. package/dist/login/Login.d.ts +0 -70
  63. package/src/components/forms/FormFields.test.tsx +0 -107
@@ -0,0 +1,308 @@
1
+ import {
2
+ getTimestamp,
3
+ getToday,
4
+ formatDate,
5
+ formatDateTime,
6
+ toUtc,
7
+ fromUtc,
8
+ } from '../utils/timeAndDate';
9
+
10
+ // Mock the getTimestamp function directly since Date.now mocking can be tricky
11
+ jest.mock('../utils/timeAndDate', () => {
12
+ const actual = jest.requireActual('../utils/timeAndDate');
13
+ return {
14
+ ...actual,
15
+ getTimestamp: jest.fn(),
16
+ getToday: jest.fn(),
17
+ };
18
+ });
19
+
20
+ // Mock date-fns functions
21
+ jest.mock('date-fns', () => ({
22
+ startOfDay: jest.fn((date) => new Date(date.getFullYear(), date.getMonth(), date.getDate())),
23
+ format: jest.fn((date, pattern) => `formatted-${pattern}`),
24
+ parseISO: jest.fn((dateString) => new Date(dateString)),
25
+ isValid: jest.fn((date) => {
26
+ if (!date) return false;
27
+ return date instanceof Date && !isNaN(date.getTime());
28
+ }),
29
+ }));
30
+
31
+ jest.mock('date-fns-tz', () => ({
32
+ toZonedTime: jest.fn((date, timezone) => date),
33
+ fromZonedTime: jest.fn((date, timezone) => date),
34
+ }));
35
+
36
+ describe('Utils - Time and Date Tests', () => {
37
+ // Store original Date to restore after tests
38
+ const OriginalDate = global.Date;
39
+
40
+ beforeEach(() => {
41
+ jest.clearAllMocks();
42
+ // Ensure Date constructor is not mocked globally
43
+ global.Date = OriginalDate;
44
+ });
45
+
46
+ afterEach(() => {
47
+ // Restore original Date constructor
48
+ global.Date = OriginalDate;
49
+ });
50
+
51
+ describe('getTimestamp', () => {
52
+ it('should return current timestamp in seconds', () => {
53
+ const mockTimestamp = 1640995200;
54
+ const { getTimestamp } = require('../utils/timeAndDate');
55
+ getTimestamp.mockReturnValue(mockTimestamp);
56
+
57
+ const timestamp = getTimestamp();
58
+
59
+ expect(timestamp).toBe(1640995200); // seconds
60
+ expect(typeof timestamp).toBe('number');
61
+ });
62
+
63
+ it('should return different values when called at different times', () => {
64
+ const mockTimestamp1 = 1640995200;
65
+ const mockTimestamp2 = 1640995260; // 1 minute later
66
+
67
+ const { getTimestamp } = require('../utils/timeAndDate');
68
+ getTimestamp.mockReturnValueOnce(mockTimestamp1);
69
+ getTimestamp.mockReturnValueOnce(mockTimestamp2);
70
+
71
+ const timestamp1 = getTimestamp();
72
+ const timestamp2 = getTimestamp();
73
+
74
+ expect(timestamp2).toBe(timestamp1 + 60);
75
+ });
76
+ });
77
+
78
+ describe('getToday', () => {
79
+ it('should return start of current day in UTC', () => {
80
+ // Mock the getToday function to return a specific date at midnight UTC
81
+ const { getToday } = require('../utils/timeAndDate');
82
+ const mockToday = new Date('2023-06-15T00:00:00.000Z'); // Explicitly UTC midnight
83
+
84
+ getToday.mockReturnValue(mockToday);
85
+
86
+ const today = getToday();
87
+
88
+ // Check if it's a Date-like object
89
+ expect(today).toBeDefined();
90
+ expect(today.getHours).toBeDefined();
91
+ expect(today.getMinutes).toBeDefined();
92
+ expect(today.getSeconds).toBeDefined();
93
+
94
+ // Check that it represents midnight UTC
95
+ expect(today.getUTCHours()).toBe(0);
96
+ expect(today.getUTCMinutes()).toBe(0);
97
+ expect(today.getUTCSeconds()).toBe(0);
98
+ });
99
+ });
100
+
101
+ describe('formatDate', () => {
102
+ it('should format Date object with default pattern', () => {
103
+ const date = new Date('2023-06-15T14:30:00Z');
104
+
105
+ // Ensure isValid returns true for this test
106
+ const { isValid } = require('date-fns');
107
+ isValid.mockReturnValueOnce(true);
108
+
109
+ const result = formatDate(date);
110
+
111
+ expect(result).toBe('formatted-yyyy-MM-dd');
112
+ });
113
+
114
+ it('should format Date object with custom pattern', () => {
115
+ const date = new Date('2023-06-15T14:30:00Z');
116
+ const pattern = 'MM/dd/yyyy';
117
+
118
+ // Ensure isValid returns true for this test
119
+ const { isValid } = require('date-fns');
120
+ isValid.mockReturnValueOnce(true);
121
+
122
+ const result = formatDate(date, pattern);
123
+
124
+ expect(result).toBe(`formatted-${pattern}`);
125
+ });
126
+
127
+ it('should format ISO string with default pattern', () => {
128
+ const dateString = '2023-06-15T14:30:00Z';
129
+
130
+ // Ensure isValid returns true for this test
131
+ const { isValid } = require('date-fns');
132
+ isValid.mockReturnValueOnce(true);
133
+
134
+ const result = formatDate(dateString);
135
+
136
+ expect(result).toBe('formatted-yyyy-MM-dd');
137
+ });
138
+
139
+ it('should format ISO string with custom pattern', () => {
140
+ const dateString = '2023-06-15T14:30:00Z';
141
+ const pattern = 'dd-MM-yyyy';
142
+
143
+ // Ensure isValid returns true for this test
144
+ const { isValid } = require('date-fns');
145
+ isValid.mockReturnValueOnce(true);
146
+
147
+ const result = formatDate(dateString, pattern);
148
+
149
+ expect(result).toBe(`formatted-${pattern}`);
150
+ });
151
+
152
+ it('should return empty string for invalid date', () => {
153
+ // Mock isValid to return false for this test
154
+ const { isValid } = require('date-fns');
155
+ isValid.mockReturnValueOnce(false);
156
+
157
+ const result = formatDate('invalid-date');
158
+
159
+ expect(result).toBe('');
160
+
161
+ // Reset the mock
162
+ isValid.mockRestore();
163
+ });
164
+ });
165
+
166
+ describe('formatDateTime', () => {
167
+ it('should format Date object with default pattern', () => {
168
+ const date = new Date('2023-06-15T14:30:00Z');
169
+
170
+ // Ensure isValid returns true for this test
171
+ const { isValid } = require('date-fns');
172
+ isValid.mockReturnValueOnce(true);
173
+
174
+ const result = formatDateTime(date);
175
+
176
+ expect(result).toBe('formatted-yyyy-MM-dd HH:mm');
177
+ });
178
+
179
+ it('should format Date object with custom pattern', () => {
180
+ const date = new Date('2023-06-15T14:30:00Z');
181
+ const pattern = 'MM/dd/yyyy HH:mm:ss';
182
+
183
+ // Ensure isValid returns true for this test
184
+ const { isValid } = require('date-fns');
185
+ isValid.mockReturnValueOnce(true);
186
+
187
+ const result = formatDateTime(date, pattern);
188
+
189
+ expect(result).toBe(`formatted-${pattern}`);
190
+ });
191
+
192
+ it('should format ISO string with default pattern', () => {
193
+ const dateString = '2023-06-15T14:30:00Z';
194
+
195
+ // Ensure isValid returns true for this test
196
+ const { isValid } = require('date-fns');
197
+ isValid.mockReturnValueOnce(true);
198
+
199
+ const result = formatDateTime(dateString);
200
+
201
+ expect(result).toBe('formatted-yyyy-MM-dd HH:mm');
202
+ });
203
+
204
+ it('should return empty string for invalid date', () => {
205
+ // Mock isValid to return false for this test
206
+ const { isValid } = require('date-fns');
207
+ isValid.mockReturnValueOnce(false);
208
+
209
+ const result = formatDateTime('invalid-date');
210
+
211
+ expect(result).toBe('');
212
+
213
+ // Reset the mock
214
+ isValid.mockRestore();
215
+ });
216
+ });
217
+
218
+ describe('toUtc', () => {
219
+ it('should convert Date object to UTC without timezone', () => {
220
+ const date = new Date('2023-06-15T14:30:00Z');
221
+
222
+ const result = toUtc(date);
223
+
224
+ expect(result).toBe(date);
225
+ });
226
+
227
+ it('should convert Date object to UTC with timezone', () => {
228
+ const date = new Date('2023-06-15T14:30:00Z');
229
+ const timezone = 'America/New_York';
230
+
231
+ const result = toUtc(date, timezone);
232
+
233
+ expect(result).toBe(date); // fromZonedTime mock returns the same date
234
+ });
235
+
236
+ it('should convert ISO string to UTC with timezone', () => {
237
+ const dateString = '2023-06-15T14:30:00Z';
238
+ const timezone = 'Europe/London';
239
+
240
+ const result = toUtc(dateString, timezone);
241
+
242
+ // Check if it's a Date-like object
243
+ expect(result).toBeDefined();
244
+ expect(typeof result.getTime).toBe('function');
245
+ });
246
+ });
247
+
248
+ describe('fromUtc', () => {
249
+ it('should convert Date object from UTC to timezone', () => {
250
+ const date = new Date('2023-06-15T14:30:00Z');
251
+ const timezone = 'Asia/Tokyo';
252
+
253
+ const result = fromUtc(date, timezone);
254
+
255
+ expect(result).toBe(date); // toZonedTime mock returns the same date
256
+ });
257
+
258
+ it('should convert ISO string from UTC to timezone', () => {
259
+ const dateString = '2023-06-15T14:30:00Z';
260
+ const timezone = 'Australia/Sydney';
261
+
262
+ const result = fromUtc(dateString, timezone);
263
+
264
+ // Check if it's a Date-like object
265
+ expect(result).toBeDefined();
266
+ expect(typeof result.getTime).toBe('function');
267
+ });
268
+ });
269
+
270
+ describe('Edge Cases', () => {
271
+ it('should handle null and undefined inputs', () => {
272
+ const { isValid } = require('date-fns');
273
+ isValid.mockReturnValue(false);
274
+
275
+ expect(formatDate(null as any)).toBe('');
276
+ expect(formatDate(undefined as any)).toBe('');
277
+ expect(formatDateTime(null as any)).toBe('');
278
+ expect(formatDateTime(undefined as any)).toBe('');
279
+ });
280
+
281
+ it('should handle invalid date strings', () => {
282
+ const { isValid } = require('date-fns');
283
+ isValid.mockReturnValue(false);
284
+
285
+ expect(formatDate('not-a-date')).toBe('');
286
+ expect(formatDateTime('invalid')).toBe('');
287
+ });
288
+
289
+ it('should handle various timezone formats', () => {
290
+ const date = new Date('2023-06-15T14:30:00Z');
291
+
292
+ expect(() => toUtc(date, 'UTC')).not.toThrow();
293
+ expect(() => toUtc(date, 'America/Los_Angeles')).not.toThrow();
294
+ expect(() => fromUtc(date, 'Europe/Paris')).not.toThrow();
295
+ });
296
+ });
297
+
298
+ describe('Function Export Verification', () => {
299
+ it('should export all time and date functions', () => {
300
+ expect(typeof getTimestamp).toBe('function');
301
+ expect(typeof getToday).toBe('function');
302
+ expect(typeof formatDate).toBe('function');
303
+ expect(typeof formatDateTime).toBe('function');
304
+ expect(typeof toUtc).toBe('function');
305
+ expect(typeof fromUtc).toBe('function');
306
+ });
307
+ });
308
+ });