@olenbetong/appframe-ds 1.3.6 → 1.3.8

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 (179) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/package.json +6 -6
  3. package/scripts/copyAssets.mjs +27 -27
  4. package/src/AfLookup/Lookup.css +130 -129
  5. package/src/AfLookup/Lookup.tsx +186 -186
  6. package/src/AfLookup/LookupCombobox.css +72 -78
  7. package/src/AfLookup/LookupCombobox.tsx +237 -237
  8. package/src/AfLookup/LookupEdit.tsx +130 -130
  9. package/src/AfLookup/LookupGrid.css +7 -12
  10. package/src/AfLookup/LookupGrid.tsx +124 -124
  11. package/src/AfLookup/index.ts +5 -5
  12. package/src/autocomplete/Autocomplete.css +256 -256
  13. package/src/autocomplete/Autocomplete.tsx +320 -320
  14. package/src/autocomplete/AutocompleteFrame.tsx +168 -168
  15. package/src/autocomplete/Combobox.tsx +286 -286
  16. package/src/autocomplete/index.ts +4 -4
  17. package/src/autocomplete/types.ts +204 -204
  18. package/src/autocomplete/utils.ts +183 -183
  19. package/src/binding/BoundNumericTextField.tsx +102 -102
  20. package/src/binding/BoundTextField.tsx +49 -49
  21. package/src/binding/CancelButton.tsx +30 -30
  22. package/src/binding/CancelIconButton.tsx +30 -30
  23. package/src/binding/DataEditToolbar.css +23 -23
  24. package/src/binding/DataEditToolbar.tsx +84 -84
  25. package/src/binding/DeleteButton.tsx +35 -35
  26. package/src/binding/DeleteIconButton.tsx +35 -35
  27. package/src/binding/RefreshButton.tsx +31 -31
  28. package/src/binding/RefreshIconButton.tsx +33 -33
  29. package/src/binding/RefreshRowIconButton.tsx +33 -33
  30. package/src/binding/SaveButton.tsx +37 -37
  31. package/src/binding/SaveIconButton.tsx +38 -38
  32. package/src/container/Container.tsx +50 -49
  33. package/src/container/index.ts +1 -1
  34. package/src/cutoff/CutOffPicker.css +12 -12
  35. package/src/cutoff/CutOffPicker.tsx +165 -165
  36. package/src/cutoff/context.tsx +194 -194
  37. package/src/cutoff/dsCutOffDates.ts +21 -21
  38. package/src/cutoff/index.ts +4 -4
  39. package/src/cutoff/utils.test.ts +59 -59
  40. package/src/cutoff/utils.ts +276 -276
  41. package/src/filter/ChipListInput.tsx +79 -79
  42. package/src/filter/FieldFilterPanel.css +150 -150
  43. package/src/filter/FieldFilterPanel.tsx +309 -309
  44. package/src/filter/FilterBuilder.css +152 -152
  45. package/src/filter/FilterBuilder.test.tsx +153 -153
  46. package/src/filter/FilterBuilder.tsx +435 -435
  47. package/src/filter/FilterEditor.css +231 -231
  48. package/src/filter/FilterEditor.test.tsx +285 -285
  49. package/src/filter/FilterEditor.tsx +75 -75
  50. package/src/filter/FilterGroupEditor.tsx +160 -160
  51. package/src/filter/FilterNameDialog.css +22 -22
  52. package/src/filter/FilterNameDialog.tsx +81 -81
  53. package/src/filter/FilterRow.tsx +117 -117
  54. package/src/filter/FilterShareDialog.css +28 -28
  55. package/src/filter/FilterShareDialog.tsx +201 -201
  56. package/src/filter/FilterStringField.tsx +78 -78
  57. package/src/filter/FilterValueEditor.tsx +239 -239
  58. package/src/filter/SavedFilterTree.css +107 -107
  59. package/src/filter/SavedFilterTree.test.tsx +94 -94
  60. package/src/filter/SavedFilterTree.tsx +218 -218
  61. package/src/filter/fieldFilter.test.ts +158 -158
  62. package/src/filter/fieldFilter.ts +139 -139
  63. package/src/filter/index.ts +27 -27
  64. package/src/filter/types.ts +38 -38
  65. package/src/filter/useDistinctValues.test.ts +102 -102
  66. package/src/filter/useDistinctValues.ts +230 -230
  67. package/src/global.d.ts +11 -11
  68. package/src/grid/AfGridColumnsPanel.tsx +118 -118
  69. package/src/grid/AfGridContext.tsx +51 -51
  70. package/src/grid/AfGridError.tsx +46 -46
  71. package/src/grid/AfHeaderFilterCell.tsx +147 -147
  72. package/src/grid/AfHeaderFilterPanel.tsx +111 -111
  73. package/src/grid/GridEditLookup.css +12 -12
  74. package/src/grid/GridEditLookup.tsx +121 -121
  75. package/src/grid/Toolbar.tsx +233 -233
  76. package/src/grid/editing.ts +100 -100
  77. package/src/grid/filter.ts +78 -78
  78. package/src/grid/formatters.ts +48 -48
  79. package/src/grid/index.css +245 -245
  80. package/src/grid/index.tsx +503 -503
  81. package/src/grid/license.ts +48 -48
  82. package/src/grid/localization.ts +369 -369
  83. package/src/grid/slots/index.tsx +334 -334
  84. package/src/grid/slots/slots.css +64 -64
  85. package/src/grid/slots/slots.test.tsx +39 -39
  86. package/src/grid/theme.tsx +138 -138
  87. package/src/grid/useAfColumns.tsx +371 -371
  88. package/src/grid/useAfCurrentIndex.ts +63 -63
  89. package/src/grid/useAfData.ts +20 -20
  90. package/src/grid/useAfFilter.ts +160 -160
  91. package/src/grid/useAfFilterFields.ts +55 -55
  92. package/src/grid/useAfGridApi.ts +71 -71
  93. package/src/grid/useAfKeyBindings.ts +36 -36
  94. package/src/grid/useAfNewItemRow.ts +258 -258
  95. package/src/grid/useAfPagination.ts +53 -53
  96. package/src/grid/useAfPersistedState.ts +230 -230
  97. package/src/grid/useAfRowEditModel.ts +145 -145
  98. package/src/grid/useAfRowGrouping.ts +47 -47
  99. package/src/grid/useAfServerAggregation.test.ts +68 -68
  100. package/src/grid/useAfServerAggregation.ts +158 -158
  101. package/src/grid/useAfSortModel.ts +84 -84
  102. package/src/i18n.ts +13 -13
  103. package/src/index.ts +14 -14
  104. package/src/input/InputAdornments.css +84 -84
  105. package/src/input/InputAdornments.tsx +102 -102
  106. package/src/input/index.ts +1 -1
  107. package/src/layout/AppMenu.tsx +74 -74
  108. package/src/layout/AppMenuDrawer.css +70 -70
  109. package/src/layout/AppMenuDrawer.tsx +122 -122
  110. package/src/layout/ErrorBoundary.tsx +162 -162
  111. package/src/layout/PageContainer.css +48 -48
  112. package/src/layout/PageContainer.tsx +41 -41
  113. package/src/layout/ResponsiveDialog.css +86 -86
  114. package/src/layout/ResponsiveDialog.tsx +55 -55
  115. package/src/layout/index.tsx +69 -69
  116. package/src/link/Link.tsx +23 -23
  117. package/src/link/index.ts +1 -1
  118. package/src/mdi/Mdi.css +138 -138
  119. package/src/mdi/Mdi.test.tsx +91 -91
  120. package/src/mdi/Mdi.tsx +141 -141
  121. package/src/mdi/MdiConfirmCloseDialog.tsx +47 -47
  122. package/src/mdi/MdiContext.tsx +59 -59
  123. package/src/mdi/MdiDocumentContext.tsx +60 -60
  124. package/src/mdi/MdiPanel.tsx +61 -61
  125. package/src/mdi/MdiRestore.test.tsx +86 -86
  126. package/src/mdi/MdiTab.tsx +30 -30
  127. package/src/mdi/controller.test.ts +382 -382
  128. package/src/mdi/controller.ts +656 -656
  129. package/src/mdi/dockviewHost.ts +132 -132
  130. package/src/mdi/fakeHost.ts +200 -200
  131. package/src/mdi/host.ts +44 -44
  132. package/src/mdi/ids.test.ts +20 -20
  133. package/src/mdi/ids.ts +18 -18
  134. package/src/mdi/index.ts +31 -31
  135. package/src/mdi/layoutRestore.test.ts +156 -156
  136. package/src/mdi/layoutRestore.ts +311 -311
  137. package/src/mdi/layoutSpec.test.ts +143 -143
  138. package/src/mdi/layoutSpec.ts +214 -214
  139. package/src/mdi/layoutStore.test.ts +93 -93
  140. package/src/mdi/layoutStore.ts +99 -99
  141. package/src/mdi/memorySettingsStore.ts +21 -21
  142. package/src/mdi/registry.ts +34 -34
  143. package/src/mdi/testTypes.ts +37 -37
  144. package/src/mdi/theme.ts +22 -22
  145. package/src/mdi/types.ts +214 -214
  146. package/src/page/Page.css +53 -53
  147. package/src/page/PageBlock.css +64 -64
  148. package/src/page/PageBlock.tsx +93 -92
  149. package/src/page/PageHeader.css +88 -88
  150. package/src/page/PageHeader.tsx +115 -115
  151. package/src/page/PageTitle.css +5 -5
  152. package/src/page/PageTitle.tsx +21 -21
  153. package/src/page/index.ts +4 -4
  154. package/src/paper/Paper.tsx +52 -52
  155. package/src/progress/LinearProgress.css +93 -93
  156. package/src/progress/LinearProgress.tsx +104 -104
  157. package/src/progress/index.ts +1 -1
  158. package/src/report-downloader/ReportDownloader.css +67 -67
  159. package/src/report-downloader/components/StatusItem.tsx +87 -87
  160. package/src/report-downloader/components/StatusList.tsx +28 -28
  161. package/src/report-downloader/index.ts +41 -41
  162. package/src/report-downloader/status.tsx +92 -92
  163. package/src/sortable/DropIndicator.css +51 -51
  164. package/src/sortable/DropIndicator.tsx +27 -27
  165. package/src/sortable/SortableItemList.css +21 -21
  166. package/src/sortable/SortableItemList.tsx +264 -264
  167. package/src/sortable/index.ts +8 -8
  168. package/src/sortable/reorderSortOrder.ts +126 -126
  169. package/src/sortable/sortOrder.ts +101 -101
  170. package/src/sortable/types.ts +9 -9
  171. package/src/sortable/useSortableContainer.ts +53 -53
  172. package/src/sortable/useSortableItem.ts +95 -95
  173. package/src/sortable/useSortableList.ts +117 -117
  174. package/src/test/happy-dom-document-class.ts +24 -24
  175. package/src/test/setup.ts +12 -12
  176. package/src/theme/useDsColorScheme.ts +53 -53
  177. package/tsconfig.build.json +9 -9
  178. package/tsconfig.json +8 -8
  179. package/vitest.config.ts +10 -10
@@ -1,194 +1,194 @@
1
- import type React from "react";
2
- import { createContext, useContext, useEffect, useReducer } from "react";
3
- import { useSearchParams } from "react-router";
4
-
5
- import { type CutOffDatesRecord, dsCutOffDates } from "./dsCutOffDates.js";
6
- import {
7
- defaultCutOffType,
8
- defaultPeriod,
9
- defaultPeriods,
10
- getCutOffFromSearchParams,
11
- getHistoryRangeStart,
12
- getPeriodLabel,
13
- type PeriodType,
14
- type PeriodTypeValueMap,
15
- } from "./utils.js";
16
-
17
- export type PeriodState = {
18
- /** The selected period of every type, so switching type and back keeps the choice. */
19
- periods: PeriodTypeValueMap;
20
- /** The selected period as Appframe stores it (weeks without the W). */
21
- period: string;
22
- /** The selected period in ISO form (weeks as `2026-W38`). */
23
- isoPeriod: string;
24
- cutOffType: PeriodType;
25
- /** Start of a history range ending at the period; see `getHistoryRangeStart`. */
26
- historyStart: string;
27
- label: string;
28
- /** The period's dates from the database, once fetched (`CutOffProvider fetchPeriod`). */
29
- data?: CutOffDatesRecord;
30
- };
31
-
32
- export type PeriodActions = {
33
- setPeriod: (type: PeriodType, period: string) => void;
34
- setCutOffType: (type: PeriodType) => void;
35
- };
36
-
37
- export const CutOffContext = createContext<PeriodState & PeriodActions>({
38
- historyStart: getHistoryRangeStart(defaultCutOffType, defaultPeriod),
39
- label: getPeriodLabel(defaultCutOffType, defaultPeriod),
40
- periods: defaultPeriods,
41
- period: defaultPeriod,
42
- isoPeriod: defaultPeriod,
43
- cutOffType: defaultCutOffType,
44
- setPeriod: () => null,
45
- setCutOffType: () => null,
46
- });
47
-
48
- type CutOffAction =
49
- | { type: "setCutOffType"; payload: PeriodType }
50
- | { type: "setPeriod"; payload: { type: PeriodType; period: string } }
51
- | { type: "cutOffLoaded"; payload: CutOffDatesRecord };
52
-
53
- const periodCache = new Map<string, CutOffDatesRecord>();
54
-
55
- function cutOffReducer(state: PeriodState, action: CutOffAction): PeriodState {
56
- switch (action.type) {
57
- case "setPeriod": {
58
- let { period, type } = action.payload;
59
- let isActivePeriod = type === state.cutOffType;
60
- let key = `${type}-${period}`;
61
-
62
- return {
63
- ...state,
64
- data: periodCache.get(key),
65
- period: (isActivePeriod ? action.payload.period : state.period).replace("W", ""),
66
- isoPeriod: isActivePeriod ? action.payload.period : state.period,
67
- periods: {
68
- ...state.periods,
69
- [state.cutOffType]: action.payload.period,
70
- },
71
- historyStart: isActivePeriod ? getHistoryRangeStart(type, period) : state.historyStart,
72
- label: isActivePeriod ? getPeriodLabel(type, period) : state.label,
73
- };
74
- }
75
- case "setCutOffType": {
76
- let { payload: coType } = action;
77
- let key = `${coType}-${state.periods[coType]}`;
78
-
79
- return {
80
- ...state,
81
- data: periodCache.get(key),
82
- period: state.periods[coType].replace("W", ""),
83
- isoPeriod: state.periods[coType],
84
- historyStart: getHistoryRangeStart(coType, state.periods[coType]),
85
- label: getPeriodLabel(coType, state.periods[coType]),
86
- cutOffType: coType,
87
- };
88
- }
89
- case "cutOffLoaded":
90
- return { ...state, data: action.payload };
91
- default:
92
- return state;
93
- }
94
- }
95
-
96
- function initialState(): PeriodState {
97
- let { coType, period } = getCutOffFromSearchParams(new URLSearchParams(globalThis.location?.search ?? ""));
98
-
99
- return {
100
- periods: { ...defaultPeriods, [coType]: period },
101
- historyStart: getHistoryRangeStart(coType, period),
102
- label: getPeriodLabel(coType, period),
103
- period,
104
- isoPeriod: period,
105
- cutOffType: coType,
106
- };
107
- }
108
-
109
- async function getCutOffPeriod(cutOffType: PeriodType, period: string): Promise<CutOffDatesRecord | undefined> {
110
- let key = `${cutOffType}-${period}`;
111
- let cached = periodCache.get(key);
112
- if (cached) return cached;
113
- if (!dsCutOffDates) return undefined;
114
-
115
- let result = await dsCutOffDates.retrieve({
116
- maxRecords: 1,
117
- filterString: `[COType] = '${cutOffType}' AND [Period] = '${period}'`,
118
- });
119
-
120
- if (result.length > 0) {
121
- periodCache.set(key, result[0]);
122
- }
123
-
124
- return result[0];
125
- }
126
-
127
- export type CutOffProviderProps = React.PropsWithChildren<{
128
- /**
129
- * Fetch the period's dates from the database when it changes. Without it `data` stays
130
- * undefined.
131
- */
132
- fetchPeriod?: boolean;
133
- }>;
134
-
135
- /**
136
- * Holds the selected cut-off period for the app, initialised from the `co` and `period`
137
- * search parameters. Read and change it with {@link useCutOff}; let the user pick it with
138
- * `CutOffPicker`.
139
- */
140
- export function CutOffProvider({ children, fetchPeriod }: CutOffProviderProps) {
141
- let [state, dispatch] = useReducer(cutOffReducer, undefined, initialState);
142
-
143
- useEffect(() => {
144
- if (fetchPeriod && !state.data) {
145
- getCutOffPeriod(state.cutOffType, state.period)
146
- .then((payload) => {
147
- if (payload) dispatch({ type: "cutOffLoaded", payload });
148
- })
149
- .catch((error) => console.warn(String(error)));
150
- }
151
- }, [fetchPeriod, state.cutOffType, state.period, state.data]);
152
-
153
- return (
154
- <CutOffContext.Provider
155
- value={{
156
- ...state,
157
- setPeriod: (type, period) => dispatch({ type: "setPeriod", payload: { type, period } }),
158
- setCutOffType: (type) => dispatch({ type: "setCutOffType", payload: type }),
159
- }}
160
- >
161
- {children}
162
- </CutOffContext.Provider>
163
- );
164
- }
165
-
166
- /**
167
- * The selected cut-off period and the actions that change it. Keeps the `co` and `period`
168
- * search parameters in step with the selection unless `disableSearchParams` is set (a form
169
- * that submits the period itself, say).
170
- */
171
- export function useCutOff({ disableSearchParams = false }: { disableSearchParams?: boolean } = {}) {
172
- let cutOff = useContext(CutOffContext);
173
- let [, setSearchParams] = useSearchParams();
174
-
175
- useEffect(() => {
176
- if (!disableSearchParams) {
177
- let searchParams = new URLSearchParams(window.location.search);
178
- if (cutOff.period === defaultPeriods[cutOff.cutOffType]) {
179
- searchParams.delete("period");
180
- } else {
181
- searchParams.set("period", cutOff.period);
182
- }
183
- if (cutOff.cutOffType === "MLD") {
184
- searchParams.delete("co");
185
- } else {
186
- searchParams.set("co", cutOff.cutOffType);
187
- }
188
-
189
- setSearchParams(searchParams, { replace: true });
190
- }
191
- }, [disableSearchParams, cutOff.period, cutOff.cutOffType, setSearchParams]);
192
-
193
- return cutOff;
194
- }
1
+ import type React from "react";
2
+ import { createContext, useContext, useEffect, useReducer } from "react";
3
+ import { useSearchParams } from "react-router";
4
+
5
+ import { type CutOffDatesRecord, dsCutOffDates } from "./dsCutOffDates.js";
6
+ import {
7
+ defaultCutOffType,
8
+ defaultPeriod,
9
+ defaultPeriods,
10
+ getCutOffFromSearchParams,
11
+ getHistoryRangeStart,
12
+ getPeriodLabel,
13
+ type PeriodType,
14
+ type PeriodTypeValueMap,
15
+ } from "./utils.js";
16
+
17
+ export type PeriodState = {
18
+ /** The selected period of every type, so switching type and back keeps the choice. */
19
+ periods: PeriodTypeValueMap;
20
+ /** The selected period as Appframe stores it (weeks without the W). */
21
+ period: string;
22
+ /** The selected period in ISO form (weeks as `2026-W38`). */
23
+ isoPeriod: string;
24
+ cutOffType: PeriodType;
25
+ /** Start of a history range ending at the period; see `getHistoryRangeStart`. */
26
+ historyStart: string;
27
+ label: string;
28
+ /** The period's dates from the database, once fetched (`CutOffProvider fetchPeriod`). */
29
+ data?: CutOffDatesRecord;
30
+ };
31
+
32
+ export type PeriodActions = {
33
+ setPeriod: (type: PeriodType, period: string) => void;
34
+ setCutOffType: (type: PeriodType) => void;
35
+ };
36
+
37
+ export const CutOffContext = createContext<PeriodState & PeriodActions>({
38
+ historyStart: getHistoryRangeStart(defaultCutOffType, defaultPeriod),
39
+ label: getPeriodLabel(defaultCutOffType, defaultPeriod),
40
+ periods: defaultPeriods,
41
+ period: defaultPeriod,
42
+ isoPeriod: defaultPeriod,
43
+ cutOffType: defaultCutOffType,
44
+ setPeriod: () => null,
45
+ setCutOffType: () => null,
46
+ });
47
+
48
+ type CutOffAction =
49
+ | { type: "setCutOffType"; payload: PeriodType }
50
+ | { type: "setPeriod"; payload: { type: PeriodType; period: string } }
51
+ | { type: "cutOffLoaded"; payload: CutOffDatesRecord };
52
+
53
+ const periodCache = new Map<string, CutOffDatesRecord>();
54
+
55
+ function cutOffReducer(state: PeriodState, action: CutOffAction): PeriodState {
56
+ switch (action.type) {
57
+ case "setPeriod": {
58
+ let { period, type } = action.payload;
59
+ let isActivePeriod = type === state.cutOffType;
60
+ let key = `${type}-${period}`;
61
+
62
+ return {
63
+ ...state,
64
+ data: periodCache.get(key),
65
+ period: (isActivePeriod ? action.payload.period : state.period).replace("W", ""),
66
+ isoPeriod: isActivePeriod ? action.payload.period : state.period,
67
+ periods: {
68
+ ...state.periods,
69
+ [state.cutOffType]: action.payload.period,
70
+ },
71
+ historyStart: isActivePeriod ? getHistoryRangeStart(type, period) : state.historyStart,
72
+ label: isActivePeriod ? getPeriodLabel(type, period) : state.label,
73
+ };
74
+ }
75
+ case "setCutOffType": {
76
+ let { payload: coType } = action;
77
+ let key = `${coType}-${state.periods[coType]}`;
78
+
79
+ return {
80
+ ...state,
81
+ data: periodCache.get(key),
82
+ period: state.periods[coType].replace("W", ""),
83
+ isoPeriod: state.periods[coType],
84
+ historyStart: getHistoryRangeStart(coType, state.periods[coType]),
85
+ label: getPeriodLabel(coType, state.periods[coType]),
86
+ cutOffType: coType,
87
+ };
88
+ }
89
+ case "cutOffLoaded":
90
+ return { ...state, data: action.payload };
91
+ default:
92
+ return state;
93
+ }
94
+ }
95
+
96
+ function initialState(): PeriodState {
97
+ let { coType, period } = getCutOffFromSearchParams(new URLSearchParams(globalThis.location?.search ?? ""));
98
+
99
+ return {
100
+ periods: { ...defaultPeriods, [coType]: period },
101
+ historyStart: getHistoryRangeStart(coType, period),
102
+ label: getPeriodLabel(coType, period),
103
+ period,
104
+ isoPeriod: period,
105
+ cutOffType: coType,
106
+ };
107
+ }
108
+
109
+ async function getCutOffPeriod(cutOffType: PeriodType, period: string): Promise<CutOffDatesRecord | undefined> {
110
+ let key = `${cutOffType}-${period}`;
111
+ let cached = periodCache.get(key);
112
+ if (cached) return cached;
113
+ if (!dsCutOffDates) return undefined;
114
+
115
+ let result = await dsCutOffDates.retrieve({
116
+ maxRecords: 1,
117
+ filterString: `[COType] = '${cutOffType}' AND [Period] = '${period}'`,
118
+ });
119
+
120
+ if (result.length > 0) {
121
+ periodCache.set(key, result[0]);
122
+ }
123
+
124
+ return result[0];
125
+ }
126
+
127
+ export type CutOffProviderProps = React.PropsWithChildren<{
128
+ /**
129
+ * Fetch the period's dates from the database when it changes. Without it `data` stays
130
+ * undefined.
131
+ */
132
+ fetchPeriod?: boolean;
133
+ }>;
134
+
135
+ /**
136
+ * Holds the selected cut-off period for the app, initialised from the `co` and `period`
137
+ * search parameters. Read and change it with {@link useCutOff}; let the user pick it with
138
+ * `CutOffPicker`.
139
+ */
140
+ export function CutOffProvider({ children, fetchPeriod }: CutOffProviderProps) {
141
+ let [state, dispatch] = useReducer(cutOffReducer, undefined, initialState);
142
+
143
+ useEffect(() => {
144
+ if (fetchPeriod && !state.data) {
145
+ getCutOffPeriod(state.cutOffType, state.period)
146
+ .then((payload) => {
147
+ if (payload) dispatch({ type: "cutOffLoaded", payload });
148
+ })
149
+ .catch((error) => console.warn(String(error)));
150
+ }
151
+ }, [fetchPeriod, state.cutOffType, state.period, state.data]);
152
+
153
+ return (
154
+ <CutOffContext.Provider
155
+ value={{
156
+ ...state,
157
+ setPeriod: (type, period) => dispatch({ type: "setPeriod", payload: { type, period } }),
158
+ setCutOffType: (type) => dispatch({ type: "setCutOffType", payload: type }),
159
+ }}
160
+ >
161
+ {children}
162
+ </CutOffContext.Provider>
163
+ );
164
+ }
165
+
166
+ /**
167
+ * The selected cut-off period and the actions that change it. Keeps the `co` and `period`
168
+ * search parameters in step with the selection unless `disableSearchParams` is set (a form
169
+ * that submits the period itself, say).
170
+ */
171
+ export function useCutOff({ disableSearchParams = false }: { disableSearchParams?: boolean } = {}) {
172
+ let cutOff = useContext(CutOffContext);
173
+ let [, setSearchParams] = useSearchParams();
174
+
175
+ useEffect(() => {
176
+ if (!disableSearchParams) {
177
+ let searchParams = new URLSearchParams(window.location.search);
178
+ if (cutOff.period === defaultPeriods[cutOff.cutOffType]) {
179
+ searchParams.delete("period");
180
+ } else {
181
+ searchParams.set("period", cutOff.period);
182
+ }
183
+ if (cutOff.cutOffType === "MLD") {
184
+ searchParams.delete("co");
185
+ } else {
186
+ searchParams.set("co", cutOff.cutOffType);
187
+ }
188
+
189
+ setSearchParams(searchParams, { replace: true });
190
+ }
191
+ }, [disableSearchParams, cutOff.period, cutOff.cutOffType, setSearchParams]);
192
+
193
+ return cutOff;
194
+ }
@@ -1,21 +1,21 @@
1
- import type { AfData } from "@olenbetong/appframe-data";
2
-
3
- export type CutOffDatesRecord = {
4
- COType: string;
5
- PeriodStart: Date;
6
- PeriodEnd: Date;
7
- Period: string;
8
- };
9
-
10
- /** `aviw_System_CutOffDates`: the start and end dates the database assigns to a period. */
11
- export const dsCutOffDates = (
12
- (globalThis as { af?: { data?: AfData } }).af?.data as AfData | undefined
13
- )?.generateApiDataHandler?.<CutOffDatesRecord>({
14
- resource: "aviw_System_CutOffDates",
15
- fields: [
16
- { name: "COType", type: "string", nullable: false },
17
- { name: "PeriodStart", type: "datetime", nullable: true },
18
- { name: "PeriodEnd", type: "datetime", nullable: true },
19
- { name: "Period", type: "string", nullable: true },
20
- ],
21
- });
1
+ import type { AfData } from "@olenbetong/appframe-data";
2
+
3
+ export type CutOffDatesRecord = {
4
+ COType: string;
5
+ PeriodStart: Date;
6
+ PeriodEnd: Date;
7
+ Period: string;
8
+ };
9
+
10
+ /** `aviw_System_CutOffDates`: the start and end dates the database assigns to a period. */
11
+ export const dsCutOffDates = (
12
+ (globalThis as { af?: { data?: AfData } }).af?.data as AfData | undefined
13
+ )?.generateApiDataHandler?.<CutOffDatesRecord>({
14
+ resource: "aviw_System_CutOffDates",
15
+ fields: [
16
+ { name: "COType", type: "string", nullable: false },
17
+ { name: "PeriodStart", type: "datetime", nullable: true },
18
+ { name: "PeriodEnd", type: "datetime", nullable: true },
19
+ { name: "Period", type: "string", nullable: true },
20
+ ],
21
+ });
@@ -1,4 +1,4 @@
1
- export * from "./context.js";
2
- export * from "./CutOffPicker.js";
3
- export * from "./dsCutOffDates.js";
4
- export * from "./utils.js";
1
+ export * from "./context.js";
2
+ export * from "./CutOffPicker.js";
3
+ export * from "./dsCutOffDates.js";
4
+ export * from "./utils.js";
@@ -1,59 +1,59 @@
1
- import { describe, expect, test } from "vitest";
2
-
3
- import {
4
- cutOffToPlainDate,
5
- getCutOffFromSearchParams,
6
- getHistoryRangeStart,
7
- getWeekRange,
8
- isPeriodValidForCoType,
9
- plainDateToCutOff,
10
- subWeekString,
11
- } from "./utils.js";
12
-
13
- describe("cut-off periods", () => {
14
- test("a date maps to every period type", () => {
15
- expect(plainDateToCutOff("2026-09-21", "AllDates")).toBe("2026-09-21");
16
- expect(plainDateToCutOff("2026-09-21", "WS")).toBe("2026-W39");
17
- expect(plainDateToCutOff("2026-09-21", "MLD")).toBe("2026-09");
18
- expect(plainDateToCutOff("2026-09-21", "QLS")).toBe("2026-Q3");
19
- expect(plainDateToCutOff("2026-09-21", "YLD")).toBe("2026");
20
- });
21
-
22
- test("ISO weeks follow the ISO year, not the calendar year", () => {
23
- expect(plainDateToCutOff("2026-01-01", "WS")).toBe("2026-W01");
24
- expect(plainDateToCutOff("2027-01-01", "WS")).toBe("2026-W53");
25
- expect(plainDateToCutOff("2024-12-30", "WS")).toBe("2025-W01");
26
- });
27
-
28
- test("a period maps back to its first day", () => {
29
- expect(cutOffToPlainDate("WS", "2026-W39").toString()).toBe("2026-09-21");
30
- expect(cutOffToPlainDate("WS", "2026-39").toString()).toBe("2026-09-21");
31
- expect(cutOffToPlainDate("QLD", "2026-Q3").toString()).toBe("2026-07-01");
32
- expect(cutOffToPlainDate("MLS", "2026-09").toString()).toBe("2026-09-01");
33
- expect(cutOffToPlainDate("YLD", "2026").toString()).toBe("2026-01-01");
34
- });
35
-
36
- test("week arithmetic", () => {
37
- expect(subWeekString("2026-W02", 3)).toBe("2025-W51");
38
- expect(getWeekRange("2025-W52", "2026-W02")).toEqual(["2025-W52", "2026-W01", "2026-W02"]);
39
- });
40
-
41
- test("history ranges", () => {
42
- expect(getHistoryRangeStart("YLD", "2026")).toBe("2021");
43
- expect(getHistoryRangeStart("QLD", "2026-Q3")).toBe("2024-Q3");
44
- expect(getHistoryRangeStart("MLD", "2026-09")).toBe("2025-09");
45
- expect(getHistoryRangeStart("WS", "2026-W39")).toBe("2026-W13");
46
- expect(getHistoryRangeStart("AllDates", "2026-09-21")).toBe("2026-08-21");
47
- });
48
-
49
- test("search parameters: defaults for missing or invalid values, weeks without the W", () => {
50
- expect(getCutOffFromSearchParams(new URLSearchParams("co=WS&period=2026-W39"))).toEqual({
51
- coType: "WS",
52
- period: "2026-39",
53
- });
54
- expect(getCutOffFromSearchParams(new URLSearchParams("co=QLD&period=2026-Q7")).period).toMatch(/^\d{4}-Q[1-4]$/);
55
- expect(getCutOffFromSearchParams(new URLSearchParams("co=nope")).coType).toBe("MLD");
56
- expect(isPeriodValidForCoType("MLS", "2026-09")).toBe(true);
57
- expect(isPeriodValidForCoType("QLS", "2026-Q2")).toBe(true);
58
- });
59
- });
1
+ import { describe, expect, test } from "vitest";
2
+
3
+ import {
4
+ cutOffToPlainDate,
5
+ getCutOffFromSearchParams,
6
+ getHistoryRangeStart,
7
+ getWeekRange,
8
+ isPeriodValidForCoType,
9
+ plainDateToCutOff,
10
+ subWeekString,
11
+ } from "./utils.js";
12
+
13
+ describe("cut-off periods", () => {
14
+ test("a date maps to every period type", () => {
15
+ expect(plainDateToCutOff("2026-09-21", "AllDates")).toBe("2026-09-21");
16
+ expect(plainDateToCutOff("2026-09-21", "WS")).toBe("2026-W39");
17
+ expect(plainDateToCutOff("2026-09-21", "MLD")).toBe("2026-09");
18
+ expect(plainDateToCutOff("2026-09-21", "QLS")).toBe("2026-Q3");
19
+ expect(plainDateToCutOff("2026-09-21", "YLD")).toBe("2026");
20
+ });
21
+
22
+ test("ISO weeks follow the ISO year, not the calendar year", () => {
23
+ expect(plainDateToCutOff("2026-01-01", "WS")).toBe("2026-W01");
24
+ expect(plainDateToCutOff("2027-01-01", "WS")).toBe("2026-W53");
25
+ expect(plainDateToCutOff("2024-12-30", "WS")).toBe("2025-W01");
26
+ });
27
+
28
+ test("a period maps back to its first day", () => {
29
+ expect(cutOffToPlainDate("WS", "2026-W39").toString()).toBe("2026-09-21");
30
+ expect(cutOffToPlainDate("WS", "2026-39").toString()).toBe("2026-09-21");
31
+ expect(cutOffToPlainDate("QLD", "2026-Q3").toString()).toBe("2026-07-01");
32
+ expect(cutOffToPlainDate("MLS", "2026-09").toString()).toBe("2026-09-01");
33
+ expect(cutOffToPlainDate("YLD", "2026").toString()).toBe("2026-01-01");
34
+ });
35
+
36
+ test("week arithmetic", () => {
37
+ expect(subWeekString("2026-W02", 3)).toBe("2025-W51");
38
+ expect(getWeekRange("2025-W52", "2026-W02")).toEqual(["2025-W52", "2026-W01", "2026-W02"]);
39
+ });
40
+
41
+ test("history ranges", () => {
42
+ expect(getHistoryRangeStart("YLD", "2026")).toBe("2021");
43
+ expect(getHistoryRangeStart("QLD", "2026-Q3")).toBe("2024-Q3");
44
+ expect(getHistoryRangeStart("MLD", "2026-09")).toBe("2025-09");
45
+ expect(getHistoryRangeStart("WS", "2026-W39")).toBe("2026-W13");
46
+ expect(getHistoryRangeStart("AllDates", "2026-09-21")).toBe("2026-08-21");
47
+ });
48
+
49
+ test("search parameters: defaults for missing or invalid values, weeks without the W", () => {
50
+ expect(getCutOffFromSearchParams(new URLSearchParams("co=WS&period=2026-W39"))).toEqual({
51
+ coType: "WS",
52
+ period: "2026-39",
53
+ });
54
+ expect(getCutOffFromSearchParams(new URLSearchParams("co=QLD&period=2026-Q7")).period).toMatch(/^\d{4}-Q[1-4]$/);
55
+ expect(getCutOffFromSearchParams(new URLSearchParams("co=nope")).coType).toBe("MLD");
56
+ expect(isPeriodValidForCoType("MLS", "2026-09")).toBe(true);
57
+ expect(isPeriodValidForCoType("QLS", "2026-Q2")).toBe(true);
58
+ });
59
+ });