@oanda/labs-currency-cross-table 1.0.25 → 1.0.27
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.
- package/CHANGELOG.md +220 -0
- package/dist/main/CurrencyCrossTableWidget/components/CellWithData.js +21 -11
- package/dist/main/CurrencyCrossTableWidget/components/CellWithData.js.map +1 -1
- package/dist/main/CurrencyCrossTableWidget/utils.js +13 -3
- package/dist/main/CurrencyCrossTableWidget/utils.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/components/CellWithData.js +22 -12
- package/dist/module/CurrencyCrossTableWidget/components/CellWithData.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/utils.js +13 -3
- package/dist/module/CurrencyCrossTableWidget/utils.js.map +1 -1
- package/dist/types/CurrencyCrossTableWidget/utils.d.ts +6 -1
- package/package.json +3 -3
- package/src/CurrencyCrossTableWidget/components/CellWithData.tsx +23 -21
- package/src/CurrencyCrossTableWidget/utils.ts +23 -7
- package/test/utils.test.ts +22 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,226 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 1.0.27 (2025-01-10)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
## 1.0.175 (2025-01-08)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## 1.0.174 (2024-12-16)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
## 1.0.173 (2024-12-11)
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## 1.0.172 (2024-11-29)
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
## 1.0.171 (2024-11-28)
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## 1.0.170 (2024-11-28)
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
## 1.0.169 (2024-11-20)
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
## 1.0.168 (2024-11-19)
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
## 1.0.167 (2024-10-14)
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
## 1.0.166 (2024-10-07)
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
## 1.0.165 (2024-10-03)
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
## 1.0.164 (2024-09-26)
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
## 1.0.163 (2024-09-18)
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
## 1.0.162 (2024-09-12)
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
## 1.0.161 (2024-09-11)
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
## 1.0.160 (2024-09-10)
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
## 1.0.159 (2024-09-09)
|
|
75
|
+
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
## 1.0.158 (2024-09-04)
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
## 1.0.157 (2024-09-04)
|
|
83
|
+
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
## 1.0.156 (2024-09-02)
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
## 1.0.155 (2024-08-29)
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
## 1.0.154 (2024-08-29)
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
## 1.0.153 (2024-08-23)
|
|
99
|
+
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
## 1.0.152 (2024-08-23)
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
|
|
106
|
+
## 1.0.151 (2024-08-20)
|
|
107
|
+
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
## 1.0.150 (2024-08-19)
|
|
111
|
+
|
|
112
|
+
**Note:** Version bump only for package @oanda/labs-currency-cross-table
|
|
113
|
+
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
## 1.0.26 (2025-01-08)
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
## 1.0.174 (2024-12-16)
|
|
123
|
+
|
|
124
|
+
|
|
125
|
+
|
|
126
|
+
## 1.0.173 (2024-12-11)
|
|
127
|
+
|
|
128
|
+
|
|
129
|
+
|
|
130
|
+
## 1.0.172 (2024-11-29)
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
## 1.0.171 (2024-11-28)
|
|
135
|
+
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
## 1.0.170 (2024-11-28)
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
|
|
142
|
+
## 1.0.169 (2024-11-20)
|
|
143
|
+
|
|
144
|
+
|
|
145
|
+
|
|
146
|
+
## 1.0.168 (2024-11-19)
|
|
147
|
+
|
|
148
|
+
|
|
149
|
+
|
|
150
|
+
## 1.0.167 (2024-10-14)
|
|
151
|
+
|
|
152
|
+
|
|
153
|
+
|
|
154
|
+
## 1.0.166 (2024-10-07)
|
|
155
|
+
|
|
156
|
+
|
|
157
|
+
|
|
158
|
+
## 1.0.165 (2024-10-03)
|
|
159
|
+
|
|
160
|
+
|
|
161
|
+
|
|
162
|
+
## 1.0.164 (2024-09-26)
|
|
163
|
+
|
|
164
|
+
|
|
165
|
+
|
|
166
|
+
## 1.0.163 (2024-09-18)
|
|
167
|
+
|
|
168
|
+
|
|
169
|
+
|
|
170
|
+
## 1.0.162 (2024-09-12)
|
|
171
|
+
|
|
172
|
+
|
|
173
|
+
|
|
174
|
+
## 1.0.161 (2024-09-11)
|
|
175
|
+
|
|
176
|
+
|
|
177
|
+
|
|
178
|
+
## 1.0.160 (2024-09-10)
|
|
179
|
+
|
|
180
|
+
|
|
181
|
+
|
|
182
|
+
## 1.0.159 (2024-09-09)
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
|
|
186
|
+
## 1.0.158 (2024-09-04)
|
|
187
|
+
|
|
188
|
+
|
|
189
|
+
|
|
190
|
+
## 1.0.157 (2024-09-04)
|
|
191
|
+
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
## 1.0.156 (2024-09-02)
|
|
195
|
+
|
|
196
|
+
|
|
197
|
+
|
|
198
|
+
## 1.0.155 (2024-08-29)
|
|
199
|
+
|
|
200
|
+
|
|
201
|
+
|
|
202
|
+
## 1.0.154 (2024-08-29)
|
|
203
|
+
|
|
204
|
+
|
|
205
|
+
|
|
206
|
+
## 1.0.153 (2024-08-23)
|
|
207
|
+
|
|
208
|
+
|
|
209
|
+
|
|
210
|
+
## 1.0.152 (2024-08-23)
|
|
211
|
+
|
|
212
|
+
|
|
213
|
+
|
|
214
|
+
## 1.0.151 (2024-08-20)
|
|
215
|
+
|
|
216
|
+
|
|
217
|
+
|
|
218
|
+
## 1.0.150 (2024-08-19)
|
|
219
|
+
|
|
220
|
+
**Note:** Version bump only for package @oanda/labs-currency-cross-table
|
|
221
|
+
|
|
222
|
+
|
|
223
|
+
|
|
224
|
+
|
|
225
|
+
|
|
6
226
|
## 1.0.25 (2024-12-16)
|
|
7
227
|
|
|
8
228
|
|
|
@@ -20,21 +20,16 @@ const CellWithData = _ref => {
|
|
|
20
20
|
setSelectedCurrency,
|
|
21
21
|
setSelectedPair
|
|
22
22
|
} = _ref;
|
|
23
|
-
const [hovered, setHovered] = (0, _react.useState)(false);
|
|
24
23
|
const instrument = `${currency}${(0, _utils.divisionMapper)(division)}${pair}`;
|
|
25
24
|
const instrumentForUpdates = isValid ? instrument : `${pair}${(0, _utils.divisionMapper)(division)}${currency}`;
|
|
26
25
|
const {
|
|
27
26
|
update,
|
|
28
27
|
error: liveRatesError
|
|
29
28
|
} = (0, _labsWidgetCommon.useLiveRatesMessage)(instrumentForUpdates, target);
|
|
30
|
-
const
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
buyPriceMovement: update?.askPriceMovement,
|
|
35
|
-
displayPrecision: currency === 'JPY' && !isValid ? 6 : update?.displayPrecision
|
|
36
|
-
};
|
|
37
|
-
const checkLoading = () => !liveRatesError && updatedRecord.buy === undefined;
|
|
29
|
+
const [hovered, setHovered] = (0, _react.useState)(false);
|
|
30
|
+
const prevBuyPrice = (0, _react.useRef)();
|
|
31
|
+
const [priceMovement, setPriceMovement] = (0, _react.useState)();
|
|
32
|
+
const checkLoading = () => !liveRatesError && update?.ask === undefined;
|
|
38
33
|
const handleMouseEnter = () => {
|
|
39
34
|
setHovered(true);
|
|
40
35
|
setSelectedCurrency(currency);
|
|
@@ -45,6 +40,21 @@ const CellWithData = _ref => {
|
|
|
45
40
|
setSelectedCurrency('');
|
|
46
41
|
setSelectedPair('');
|
|
47
42
|
};
|
|
43
|
+
(0, _react.useEffect)(() => {
|
|
44
|
+
if (!update) return;
|
|
45
|
+
const {
|
|
46
|
+
ask,
|
|
47
|
+
displayPrecision
|
|
48
|
+
} = update;
|
|
49
|
+
const movement = (0, _utils.getPriceMovement)({
|
|
50
|
+
previous: prevBuyPrice.current,
|
|
51
|
+
update: ask,
|
|
52
|
+
displayPrecision: currency === 'JPY' && !isValid ? 6 : displayPrecision,
|
|
53
|
+
isReversed: !isValid
|
|
54
|
+
});
|
|
55
|
+
prevBuyPrice.current = ask;
|
|
56
|
+
setPriceMovement(movement);
|
|
57
|
+
}, [isValid, update, currency]);
|
|
48
58
|
return _react.default.createElement(_Cell.Cell, {
|
|
49
59
|
hovered: hovered,
|
|
50
60
|
isError: !!liveRatesError,
|
|
@@ -53,8 +63,8 @@ const CellWithData = _ref => {
|
|
|
53
63
|
mouseLeaveHandler: handleMouseLeave
|
|
54
64
|
}, _react.default.createElement(_labsWidgetCommon.Price, {
|
|
55
65
|
movementIndicator: "background",
|
|
56
|
-
priceMovement:
|
|
57
|
-
}, _react.default.createElement("span", null, (0, _utils.getBuyPrice)(
|
|
66
|
+
priceMovement: priceMovement
|
|
67
|
+
}, _react.default.createElement("span", null, (0, _utils.getBuyPrice)(update?.ask, !isValid).toFixed(currency === 'JPY' && !isValid ? 6 : update?.displayPrecision))));
|
|
58
68
|
};
|
|
59
69
|
exports.CellWithData = CellWithData;
|
|
60
70
|
//# sourceMappingURL=CellWithData.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellWithData.js","names":["_labsWidgetCommon","require","_react","_interopRequireWildcard","_utils","_Cell","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CellWithData","_ref","currency","pair","isValid","target","division","setSelectedCurrency","setSelectedPair","
|
|
1
|
+
{"version":3,"file":"CellWithData.js","names":["_labsWidgetCommon","require","_react","_interopRequireWildcard","_utils","_Cell","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CellWithData","_ref","currency","pair","isValid","target","division","setSelectedCurrency","setSelectedPair","instrument","divisionMapper","instrumentForUpdates","update","error","liveRatesError","useLiveRatesMessage","hovered","setHovered","useState","prevBuyPrice","useRef","priceMovement","setPriceMovement","checkLoading","ask","undefined","handleMouseEnter","handleMouseLeave","useEffect","displayPrecision","movement","getPriceMovement","previous","current","isReversed","createElement","Cell","isError","isLoading","mouseEnterHandler","mouseLeaveHandler","Price","movementIndicator","getBuyPrice","toFixed","exports"],"sources":["../../../../src/CurrencyCrossTableWidget/components/CellWithData.tsx"],"sourcesContent":["import { Price, useLiveRatesMessage } from '@oanda/labs-widget-common';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { divisionMapper, getBuyPrice, getPriceMovement } from '../utils';\nimport { Cell } from './Cell';\nimport type { CellWithDataProps } from './types';\n\nconst CellWithData = ({\n currency,\n pair,\n isValid,\n target,\n division,\n setSelectedCurrency,\n setSelectedPair,\n}: CellWithDataProps) => {\n const instrument = `${currency}${divisionMapper(division)}${pair}`;\n const instrumentForUpdates = isValid\n ? instrument\n : `${pair}${divisionMapper(division)}${currency}`;\n\n const { update, error: liveRatesError } = useLiveRatesMessage(\n instrumentForUpdates,\n target\n );\n\n const [hovered, setHovered] = useState(false);\n const prevBuyPrice = useRef<number>();\n const [priceMovement, setPriceMovement] = useState<number | undefined>();\n\n const checkLoading = () => !liveRatesError && update?.ask === undefined;\n\n const handleMouseEnter = () => {\n setHovered(true);\n setSelectedCurrency(currency);\n setSelectedPair(pair);\n };\n\n const handleMouseLeave = () => {\n setHovered(false);\n setSelectedCurrency('');\n setSelectedPair('');\n };\n\n useEffect(() => {\n if (!update) return;\n\n const { ask, displayPrecision } = update;\n const movement = getPriceMovement({\n previous: prevBuyPrice.current,\n update: ask,\n displayPrecision: currency === 'JPY' && !isValid ? 6 : displayPrecision,\n isReversed: !isValid,\n });\n\n prevBuyPrice.current = ask;\n setPriceMovement(movement);\n }, [isValid, update, currency]);\n\n return (\n <Cell\n hovered={hovered}\n isError={!!liveRatesError}\n isLoading={checkLoading()}\n mouseEnterHandler={handleMouseEnter}\n mouseLeaveHandler={handleMouseLeave}\n >\n <Price movementIndicator=\"background\" priceMovement={priceMovement}>\n <span>\n {getBuyPrice(update?.ask, !isValid).toFixed(\n currency === 'JPY' && !isValid ? 6 : update?.displayPrecision\n )}\n </span>\n </Price>\n </Cell>\n );\n};\n\nexport { CellWithData };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -17,9 +17,19 @@ const currenciesToInstruments = (currencies, division) => {
|
|
|
17
17
|
return pairs;
|
|
18
18
|
};
|
|
19
19
|
exports.currenciesToInstruments = currenciesToInstruments;
|
|
20
|
-
const getPriceMovement =
|
|
21
|
-
|
|
22
|
-
|
|
20
|
+
const getPriceMovement = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
previous,
|
|
23
|
+
update,
|
|
24
|
+
displayPrecision,
|
|
25
|
+
isReversed
|
|
26
|
+
} = _ref;
|
|
27
|
+
const roundedPrevious = getBuyPrice(previous, isReversed)?.toFixed(displayPrecision);
|
|
28
|
+
const roundedUpdate = getBuyPrice(update, isReversed)?.toFixed(displayPrecision);
|
|
29
|
+
if (roundedPrevious === roundedUpdate || update === undefined) {
|
|
30
|
+
return 0;
|
|
31
|
+
}
|
|
32
|
+
return roundedUpdate > roundedPrevious ? 1 : -1;
|
|
23
33
|
};
|
|
24
34
|
exports.getPriceMovement = getPriceMovement;
|
|
25
35
|
const getBuyPrice = (price, isReversed) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","names":["_constant","require","validCurrencies","currencies","every","currency","MAJOR_CURRENCIES","includes","exports","divisionMapper","division","currenciesToInstruments","pairs","reduce","acc","cV","index","array","unique","filter","_item","idx","map","el","getPriceMovement","
|
|
1
|
+
{"version":3,"file":"utils.js","names":["_constant","require","validCurrencies","currencies","every","currency","MAJOR_CURRENCIES","includes","exports","divisionMapper","division","currenciesToInstruments","pairs","reduce","acc","cV","index","array","unique","filter","_item","idx","map","el","getPriceMovement","_ref","previous","update","displayPrecision","isReversed","roundedPrevious","getBuyPrice","toFixed","roundedUpdate","undefined","price"],"sources":["../../../src/CurrencyCrossTableWidget/utils.ts"],"sourcesContent":["import type { Division } from '../gql/types/graphql';\nimport { MAJOR_CURRENCIES } from './constant';\n\nconst validCurrencies = (currencies: string[]) =>\n currencies.every((currency) => MAJOR_CURRENCIES.includes(currency));\n\nconst divisionMapper = (division: Division) => (division === 'OGM' ? '' : '_');\n\nconst currenciesToInstruments = (currencies: string[], division: Division) => {\n const pairs = currencies.reduce((acc, cV, index, array) => {\n const unique = array.filter((_item, idx) => index !== idx);\n\n return [\n ...acc,\n ...unique.map((el) => `${cV}${divisionMapper(division)}${el}`),\n ];\n }, [] as string[]);\n\n return pairs;\n};\n\nconst getPriceMovement = ({\n previous,\n update,\n displayPrecision,\n isReversed,\n}: {\n previous?: number;\n update?: number;\n displayPrecision?: number;\n isReversed: boolean;\n}) => {\n const roundedPrevious = getBuyPrice(previous, isReversed)?.toFixed(\n displayPrecision\n );\n const roundedUpdate = getBuyPrice(update, isReversed)?.toFixed(\n displayPrecision\n );\n\n if (roundedPrevious === roundedUpdate || update === undefined) {\n return 0;\n }\n\n return roundedUpdate > roundedPrevious ? 1 : -1;\n};\n\nconst getBuyPrice = (price: number | undefined, isReversed: boolean) => {\n if (price === undefined) return 0;\n\n return isReversed ? 1 / price : price;\n};\n\nexport {\n currenciesToInstruments,\n divisionMapper,\n getBuyPrice,\n getPriceMovement,\n validCurrencies,\n};\n"],"mappings":";;;;;;AACA,IAAAA,SAAA,GAAAC,OAAA;AAEA,MAAMC,eAAe,GAAIC,UAAoB,IAC3CA,UAAU,CAACC,KAAK,CAAEC,QAAQ,IAAKC,0BAAgB,CAACC,QAAQ,CAACF,QAAQ,CAAC,CAAC;AAACG,OAAA,CAAAN,eAAA,GAAAA,eAAA;AAEtE,MAAMO,cAAc,GAAIC,QAAkB,IAAMA,QAAQ,KAAK,KAAK,GAAG,EAAE,GAAG,GAAI;AAACF,OAAA,CAAAC,cAAA,GAAAA,cAAA;AAE/E,MAAME,uBAAuB,GAAGA,CAACR,UAAoB,EAAEO,QAAkB,KAAK;EAC5E,MAAME,KAAK,GAAGT,UAAU,CAACU,MAAM,CAAC,CAACC,GAAG,EAAEC,EAAE,EAAEC,KAAK,EAAEC,KAAK,KAAK;IACzD,MAAMC,MAAM,GAAGD,KAAK,CAACE,MAAM,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAKL,KAAK,KAAKK,GAAG,CAAC;IAE1D,OAAO,CACL,GAAGP,GAAG,EACN,GAAGI,MAAM,CAACI,GAAG,CAAEC,EAAE,IAAK,GAAGR,EAAE,GAAGN,cAAc,CAACC,QAAQ,CAAC,GAAGa,EAAE,EAAE,CAAC,CAC/D;EACH,CAAC,EAAE,EAAc,CAAC;EAElB,OAAOX,KAAK;AACd,CAAC;AAACJ,OAAA,CAAAG,uBAAA,GAAAA,uBAAA;AAEF,MAAMa,gBAAgB,GAAGC,IAAA,IAUnB;EAAA,IAVoB;IACxBC,QAAQ;IACRC,MAAM;IACNC,gBAAgB;IAChBC;EAMF,CAAC,GAAAJ,IAAA;EACC,MAAMK,eAAe,GAAGC,WAAW,CAACL,QAAQ,EAAEG,UAAU,CAAC,EAAEG,OAAO,CAChEJ,gBACF,CAAC;EACD,MAAMK,aAAa,GAAGF,WAAW,CAACJ,MAAM,EAAEE,UAAU,CAAC,EAAEG,OAAO,CAC5DJ,gBACF,CAAC;EAED,IAAIE,eAAe,KAAKG,aAAa,IAAIN,MAAM,KAAKO,SAAS,EAAE;IAC7D,OAAO,CAAC;EACV;EAEA,OAAOD,aAAa,GAAGH,eAAe,GAAG,CAAC,GAAG,CAAC,CAAC;AACjD,CAAC;AAACtB,OAAA,CAAAgB,gBAAA,GAAAA,gBAAA;AAEF,MAAMO,WAAW,GAAGA,CAACI,KAAyB,EAAEN,UAAmB,KAAK;EACtE,IAAIM,KAAK,KAAKD,SAAS,EAAE,OAAO,CAAC;EAEjC,OAAOL,UAAU,GAAG,CAAC,GAAGM,KAAK,GAAGA,KAAK;AACvC,CAAC;AAAC3B,OAAA,CAAAuB,WAAA,GAAAA,WAAA","ignoreList":[]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Price, useLiveRatesMessage } from '@oanda/labs-widget-common';
|
|
2
|
-
import React, { useState } from 'react';
|
|
2
|
+
import React, { useEffect, useRef, useState } from 'react';
|
|
3
3
|
import { divisionMapper, getBuyPrice, getPriceMovement } from '../utils';
|
|
4
4
|
import { Cell } from './Cell';
|
|
5
5
|
const CellWithData = _ref => {
|
|
@@ -12,21 +12,16 @@ const CellWithData = _ref => {
|
|
|
12
12
|
setSelectedCurrency,
|
|
13
13
|
setSelectedPair
|
|
14
14
|
} = _ref;
|
|
15
|
-
const [hovered, setHovered] = useState(false);
|
|
16
15
|
const instrument = `${currency}${divisionMapper(division)}${pair}`;
|
|
17
16
|
const instrumentForUpdates = isValid ? instrument : `${pair}${divisionMapper(division)}${currency}`;
|
|
18
17
|
const {
|
|
19
18
|
update,
|
|
20
19
|
error: liveRatesError
|
|
21
20
|
} = useLiveRatesMessage(instrumentForUpdates, target);
|
|
22
|
-
const
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
buyPriceMovement: update?.askPriceMovement,
|
|
27
|
-
displayPrecision: currency === 'JPY' && !isValid ? 6 : update?.displayPrecision
|
|
28
|
-
};
|
|
29
|
-
const checkLoading = () => !liveRatesError && updatedRecord.buy === undefined;
|
|
21
|
+
const [hovered, setHovered] = useState(false);
|
|
22
|
+
const prevBuyPrice = useRef();
|
|
23
|
+
const [priceMovement, setPriceMovement] = useState();
|
|
24
|
+
const checkLoading = () => !liveRatesError && update?.ask === undefined;
|
|
30
25
|
const handleMouseEnter = () => {
|
|
31
26
|
setHovered(true);
|
|
32
27
|
setSelectedCurrency(currency);
|
|
@@ -37,6 +32,21 @@ const CellWithData = _ref => {
|
|
|
37
32
|
setSelectedCurrency('');
|
|
38
33
|
setSelectedPair('');
|
|
39
34
|
};
|
|
35
|
+
useEffect(() => {
|
|
36
|
+
if (!update) return;
|
|
37
|
+
const {
|
|
38
|
+
ask,
|
|
39
|
+
displayPrecision
|
|
40
|
+
} = update;
|
|
41
|
+
const movement = getPriceMovement({
|
|
42
|
+
previous: prevBuyPrice.current,
|
|
43
|
+
update: ask,
|
|
44
|
+
displayPrecision: currency === 'JPY' && !isValid ? 6 : displayPrecision,
|
|
45
|
+
isReversed: !isValid
|
|
46
|
+
});
|
|
47
|
+
prevBuyPrice.current = ask;
|
|
48
|
+
setPriceMovement(movement);
|
|
49
|
+
}, [isValid, update, currency]);
|
|
40
50
|
return React.createElement(Cell, {
|
|
41
51
|
hovered: hovered,
|
|
42
52
|
isError: !!liveRatesError,
|
|
@@ -45,8 +55,8 @@ const CellWithData = _ref => {
|
|
|
45
55
|
mouseLeaveHandler: handleMouseLeave
|
|
46
56
|
}, React.createElement(Price, {
|
|
47
57
|
movementIndicator: "background",
|
|
48
|
-
priceMovement:
|
|
49
|
-
}, React.createElement("span", null, getBuyPrice(
|
|
58
|
+
priceMovement: priceMovement
|
|
59
|
+
}, React.createElement("span", null, getBuyPrice(update?.ask, !isValid).toFixed(currency === 'JPY' && !isValid ? 6 : update?.displayPrecision))));
|
|
50
60
|
};
|
|
51
61
|
export { CellWithData };
|
|
52
62
|
//# sourceMappingURL=CellWithData.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellWithData.js","names":["Price","useLiveRatesMessage","React","useState","divisionMapper","getBuyPrice","getPriceMovement","Cell","CellWithData","_ref","currency","pair","isValid","target","division","setSelectedCurrency","setSelectedPair","
|
|
1
|
+
{"version":3,"file":"CellWithData.js","names":["Price","useLiveRatesMessage","React","useEffect","useRef","useState","divisionMapper","getBuyPrice","getPriceMovement","Cell","CellWithData","_ref","currency","pair","isValid","target","division","setSelectedCurrency","setSelectedPair","instrument","instrumentForUpdates","update","error","liveRatesError","hovered","setHovered","prevBuyPrice","priceMovement","setPriceMovement","checkLoading","ask","undefined","handleMouseEnter","handleMouseLeave","displayPrecision","movement","previous","current","isReversed","createElement","isError","isLoading","mouseEnterHandler","mouseLeaveHandler","movementIndicator","toFixed"],"sources":["../../../../src/CurrencyCrossTableWidget/components/CellWithData.tsx"],"sourcesContent":["import { Price, useLiveRatesMessage } from '@oanda/labs-widget-common';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { divisionMapper, getBuyPrice, getPriceMovement } from '../utils';\nimport { Cell } from './Cell';\nimport type { CellWithDataProps } from './types';\n\nconst CellWithData = ({\n currency,\n pair,\n isValid,\n target,\n division,\n setSelectedCurrency,\n setSelectedPair,\n}: CellWithDataProps) => {\n const instrument = `${currency}${divisionMapper(division)}${pair}`;\n const instrumentForUpdates = isValid\n ? instrument\n : `${pair}${divisionMapper(division)}${currency}`;\n\n const { update, error: liveRatesError } = useLiveRatesMessage(\n instrumentForUpdates,\n target\n );\n\n const [hovered, setHovered] = useState(false);\n const prevBuyPrice = useRef<number>();\n const [priceMovement, setPriceMovement] = useState<number | undefined>();\n\n const checkLoading = () => !liveRatesError && update?.ask === undefined;\n\n const handleMouseEnter = () => {\n setHovered(true);\n setSelectedCurrency(currency);\n setSelectedPair(pair);\n };\n\n const handleMouseLeave = () => {\n setHovered(false);\n setSelectedCurrency('');\n setSelectedPair('');\n };\n\n useEffect(() => {\n if (!update) return;\n\n const { ask, displayPrecision } = update;\n const movement = getPriceMovement({\n previous: prevBuyPrice.current,\n update: ask,\n displayPrecision: currency === 'JPY' && !isValid ? 6 : displayPrecision,\n isReversed: !isValid,\n });\n\n prevBuyPrice.current = ask;\n setPriceMovement(movement);\n }, [isValid, update, currency]);\n\n return (\n <Cell\n hovered={hovered}\n isError={!!liveRatesError}\n isLoading={checkLoading()}\n mouseEnterHandler={handleMouseEnter}\n mouseLeaveHandler={handleMouseLeave}\n >\n <Price movementIndicator=\"background\" priceMovement={priceMovement}>\n <span>\n {getBuyPrice(update?.ask, !isValid).toFixed(\n currency === 'JPY' && !isValid ? 6 : update?.displayPrecision\n )}\n </span>\n </Price>\n </Cell>\n );\n};\n\nexport { CellWithData };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,9 +8,19 @@ const currenciesToInstruments = (currencies, division) => {
|
|
|
8
8
|
}, []);
|
|
9
9
|
return pairs;
|
|
10
10
|
};
|
|
11
|
-
const getPriceMovement =
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
const getPriceMovement = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
previous,
|
|
14
|
+
update,
|
|
15
|
+
displayPrecision,
|
|
16
|
+
isReversed
|
|
17
|
+
} = _ref;
|
|
18
|
+
const roundedPrevious = getBuyPrice(previous, isReversed)?.toFixed(displayPrecision);
|
|
19
|
+
const roundedUpdate = getBuyPrice(update, isReversed)?.toFixed(displayPrecision);
|
|
20
|
+
if (roundedPrevious === roundedUpdate || update === undefined) {
|
|
21
|
+
return 0;
|
|
22
|
+
}
|
|
23
|
+
return roundedUpdate > roundedPrevious ? 1 : -1;
|
|
14
24
|
};
|
|
15
25
|
const getBuyPrice = (price, isReversed) => {
|
|
16
26
|
if (price === undefined) return 0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","names":["MAJOR_CURRENCIES","validCurrencies","currencies","every","currency","includes","divisionMapper","division","currenciesToInstruments","pairs","reduce","acc","cV","index","array","unique","filter","_item","idx","map","el","getPriceMovement","
|
|
1
|
+
{"version":3,"file":"utils.js","names":["MAJOR_CURRENCIES","validCurrencies","currencies","every","currency","includes","divisionMapper","division","currenciesToInstruments","pairs","reduce","acc","cV","index","array","unique","filter","_item","idx","map","el","getPriceMovement","_ref","previous","update","displayPrecision","isReversed","roundedPrevious","getBuyPrice","toFixed","roundedUpdate","undefined","price"],"sources":["../../../src/CurrencyCrossTableWidget/utils.ts"],"sourcesContent":["import type { Division } from '../gql/types/graphql';\nimport { MAJOR_CURRENCIES } from './constant';\n\nconst validCurrencies = (currencies: string[]) =>\n currencies.every((currency) => MAJOR_CURRENCIES.includes(currency));\n\nconst divisionMapper = (division: Division) => (division === 'OGM' ? '' : '_');\n\nconst currenciesToInstruments = (currencies: string[], division: Division) => {\n const pairs = currencies.reduce((acc, cV, index, array) => {\n const unique = array.filter((_item, idx) => index !== idx);\n\n return [\n ...acc,\n ...unique.map((el) => `${cV}${divisionMapper(division)}${el}`),\n ];\n }, [] as string[]);\n\n return pairs;\n};\n\nconst getPriceMovement = ({\n previous,\n update,\n displayPrecision,\n isReversed,\n}: {\n previous?: number;\n update?: number;\n displayPrecision?: number;\n isReversed: boolean;\n}) => {\n const roundedPrevious = getBuyPrice(previous, isReversed)?.toFixed(\n displayPrecision\n );\n const roundedUpdate = getBuyPrice(update, isReversed)?.toFixed(\n displayPrecision\n );\n\n if (roundedPrevious === roundedUpdate || update === undefined) {\n return 0;\n }\n\n return roundedUpdate > roundedPrevious ? 1 : -1;\n};\n\nconst getBuyPrice = (price: number | undefined, isReversed: boolean) => {\n if (price === undefined) return 0;\n\n return isReversed ? 1 / price : price;\n};\n\nexport {\n currenciesToInstruments,\n divisionMapper,\n getBuyPrice,\n getPriceMovement,\n validCurrencies,\n};\n"],"mappings":"AACA,SAASA,gBAAgB,QAAQ,YAAY;AAE7C,MAAMC,eAAe,GAAIC,UAAoB,IAC3CA,UAAU,CAACC,KAAK,CAAEC,QAAQ,IAAKJ,gBAAgB,CAACK,QAAQ,CAACD,QAAQ,CAAC,CAAC;AAErE,MAAME,cAAc,GAAIC,QAAkB,IAAMA,QAAQ,KAAK,KAAK,GAAG,EAAE,GAAG,GAAI;AAE9E,MAAMC,uBAAuB,GAAGA,CAACN,UAAoB,EAAEK,QAAkB,KAAK;EAC5E,MAAME,KAAK,GAAGP,UAAU,CAACQ,MAAM,CAAC,CAACC,GAAG,EAAEC,EAAE,EAAEC,KAAK,EAAEC,KAAK,KAAK;IACzD,MAAMC,MAAM,GAAGD,KAAK,CAACE,MAAM,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAKL,KAAK,KAAKK,GAAG,CAAC;IAE1D,OAAO,CACL,GAAGP,GAAG,EACN,GAAGI,MAAM,CAACI,GAAG,CAAEC,EAAE,IAAK,GAAGR,EAAE,GAAGN,cAAc,CAACC,QAAQ,CAAC,GAAGa,EAAE,EAAE,CAAC,CAC/D;EACH,CAAC,EAAE,EAAc,CAAC;EAElB,OAAOX,KAAK;AACd,CAAC;AAED,MAAMY,gBAAgB,GAAGC,IAAA,IAUnB;EAAA,IAVoB;IACxBC,QAAQ;IACRC,MAAM;IACNC,gBAAgB;IAChBC;EAMF,CAAC,GAAAJ,IAAA;EACC,MAAMK,eAAe,GAAGC,WAAW,CAACL,QAAQ,EAAEG,UAAU,CAAC,EAAEG,OAAO,CAChEJ,gBACF,CAAC;EACD,MAAMK,aAAa,GAAGF,WAAW,CAACJ,MAAM,EAAEE,UAAU,CAAC,EAAEG,OAAO,CAC5DJ,gBACF,CAAC;EAED,IAAIE,eAAe,KAAKG,aAAa,IAAIN,MAAM,KAAKO,SAAS,EAAE;IAC7D,OAAO,CAAC;EACV;EAEA,OAAOD,aAAa,GAAGH,eAAe,GAAG,CAAC,GAAG,CAAC,CAAC;AACjD,CAAC;AAED,MAAMC,WAAW,GAAGA,CAACI,KAAyB,EAAEN,UAAmB,KAAK;EACtE,IAAIM,KAAK,KAAKD,SAAS,EAAE,OAAO,CAAC;EAEjC,OAAOL,UAAU,GAAG,CAAC,GAAGM,KAAK,GAAGA,KAAK;AACvC,CAAC;AAED,SACExB,uBAAuB,EACvBF,cAAc,EACdsB,WAAW,EACXP,gBAAgB,EAChBpB,eAAe","ignoreList":[]}
|
|
@@ -2,6 +2,11 @@ import type { Division } from '../gql/types/graphql';
|
|
|
2
2
|
declare const validCurrencies: (currencies: string[]) => boolean;
|
|
3
3
|
declare const divisionMapper: (division: Division) => "" | "_";
|
|
4
4
|
declare const currenciesToInstruments: (currencies: string[], division: Division) => string[];
|
|
5
|
-
declare const getPriceMovement: (
|
|
5
|
+
declare const getPriceMovement: ({ previous, update, displayPrecision, isReversed, }: {
|
|
6
|
+
previous?: number;
|
|
7
|
+
update?: number;
|
|
8
|
+
displayPrecision?: number;
|
|
9
|
+
isReversed: boolean;
|
|
10
|
+
}) => 0 | 1 | -1;
|
|
6
11
|
declare const getBuyPrice: (price: number | undefined, isReversed: boolean) => number;
|
|
7
12
|
export { currenciesToInstruments, divisionMapper, getBuyPrice, getPriceMovement, validCurrencies, };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oanda/labs-currency-cross-table",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.27",
|
|
4
4
|
"description": "Labs Currency Cross Table",
|
|
5
5
|
"main": "dist/main/index.js",
|
|
6
6
|
"module": "dist/module/index.js",
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"author": "OANDA",
|
|
13
13
|
"license": "UNLICENSED",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@oanda/labs-widget-common": "^1.0.
|
|
15
|
+
"@oanda/labs-widget-common": "^1.0.176",
|
|
16
16
|
"@oanda/mono-i18n": "10.0.1",
|
|
17
17
|
"graphql": "16.8.1"
|
|
18
18
|
},
|
|
@@ -20,5 +20,5 @@
|
|
|
20
20
|
"@graphql-codegen/cli": "5.0.0",
|
|
21
21
|
"@graphql-codegen/client-preset": "4.1.0"
|
|
22
22
|
},
|
|
23
|
-
"gitHead": "
|
|
23
|
+
"gitHead": "1f4de950884abacb03c4a930e3d2984f433ff6ec"
|
|
24
24
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Price, useLiveRatesMessage } from '@oanda/labs-widget-common';
|
|
2
|
-
import React, { useState } from 'react';
|
|
2
|
+
import React, { useEffect, useRef, useState } from 'react';
|
|
3
3
|
|
|
4
4
|
import { divisionMapper, getBuyPrice, getPriceMovement } from '../utils';
|
|
5
5
|
import { Cell } from './Cell';
|
|
@@ -14,8 +14,6 @@ const CellWithData = ({
|
|
|
14
14
|
setSelectedCurrency,
|
|
15
15
|
setSelectedPair,
|
|
16
16
|
}: CellWithDataProps) => {
|
|
17
|
-
const [hovered, setHovered] = useState(false);
|
|
18
|
-
|
|
19
17
|
const instrument = `${currency}${divisionMapper(division)}${pair}`;
|
|
20
18
|
const instrumentForUpdates = isValid
|
|
21
19
|
? instrument
|
|
@@ -26,16 +24,11 @@ const CellWithData = ({
|
|
|
26
24
|
target
|
|
27
25
|
);
|
|
28
26
|
|
|
29
|
-
const
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
buy: update?.ask,
|
|
33
|
-
buyPriceMovement: update?.askPriceMovement,
|
|
34
|
-
displayPrecision:
|
|
35
|
-
currency === 'JPY' && !isValid ? 6 : update?.displayPrecision,
|
|
36
|
-
};
|
|
27
|
+
const [hovered, setHovered] = useState(false);
|
|
28
|
+
const prevBuyPrice = useRef<number>();
|
|
29
|
+
const [priceMovement, setPriceMovement] = useState<number | undefined>();
|
|
37
30
|
|
|
38
|
-
const checkLoading = () => !liveRatesError &&
|
|
31
|
+
const checkLoading = () => !liveRatesError && update?.ask === undefined;
|
|
39
32
|
|
|
40
33
|
const handleMouseEnter = () => {
|
|
41
34
|
setHovered(true);
|
|
@@ -49,6 +42,21 @@ const CellWithData = ({
|
|
|
49
42
|
setSelectedPair('');
|
|
50
43
|
};
|
|
51
44
|
|
|
45
|
+
useEffect(() => {
|
|
46
|
+
if (!update) return;
|
|
47
|
+
|
|
48
|
+
const { ask, displayPrecision } = update;
|
|
49
|
+
const movement = getPriceMovement({
|
|
50
|
+
previous: prevBuyPrice.current,
|
|
51
|
+
update: ask,
|
|
52
|
+
displayPrecision: currency === 'JPY' && !isValid ? 6 : displayPrecision,
|
|
53
|
+
isReversed: !isValid,
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
prevBuyPrice.current = ask;
|
|
57
|
+
setPriceMovement(movement);
|
|
58
|
+
}, [isValid, update, currency]);
|
|
59
|
+
|
|
52
60
|
return (
|
|
53
61
|
<Cell
|
|
54
62
|
hovered={hovered}
|
|
@@ -57,16 +65,10 @@ const CellWithData = ({
|
|
|
57
65
|
mouseEnterHandler={handleMouseEnter}
|
|
58
66
|
mouseLeaveHandler={handleMouseLeave}
|
|
59
67
|
>
|
|
60
|
-
<Price
|
|
61
|
-
movementIndicator="background"
|
|
62
|
-
priceMovement={getPriceMovement(
|
|
63
|
-
updatedRecord.buyPriceMovement,
|
|
64
|
-
!isValid
|
|
65
|
-
)}
|
|
66
|
-
>
|
|
68
|
+
<Price movementIndicator="background" priceMovement={priceMovement}>
|
|
67
69
|
<span>
|
|
68
|
-
{getBuyPrice(
|
|
69
|
-
|
|
70
|
+
{getBuyPrice(update?.ask, !isValid).toFixed(
|
|
71
|
+
currency === 'JPY' && !isValid ? 6 : update?.displayPrecision
|
|
70
72
|
)}
|
|
71
73
|
</span>
|
|
72
74
|
</Price>
|
|
@@ -19,13 +19,29 @@ const currenciesToInstruments = (currencies: string[], division: Division) => {
|
|
|
19
19
|
return pairs;
|
|
20
20
|
};
|
|
21
21
|
|
|
22
|
-
const getPriceMovement = (
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
22
|
+
const getPriceMovement = ({
|
|
23
|
+
previous,
|
|
24
|
+
update,
|
|
25
|
+
displayPrecision,
|
|
26
|
+
isReversed,
|
|
27
|
+
}: {
|
|
28
|
+
previous?: number;
|
|
29
|
+
update?: number;
|
|
30
|
+
displayPrecision?: number;
|
|
31
|
+
isReversed: boolean;
|
|
32
|
+
}) => {
|
|
33
|
+
const roundedPrevious = getBuyPrice(previous, isReversed)?.toFixed(
|
|
34
|
+
displayPrecision
|
|
35
|
+
);
|
|
36
|
+
const roundedUpdate = getBuyPrice(update, isReversed)?.toFixed(
|
|
37
|
+
displayPrecision
|
|
38
|
+
);
|
|
39
|
+
|
|
40
|
+
if (roundedPrevious === roundedUpdate || update === undefined) {
|
|
41
|
+
return 0;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
return roundedUpdate > roundedPrevious ? 1 : -1;
|
|
29
45
|
};
|
|
30
46
|
|
|
31
47
|
const getBuyPrice = (price: number | undefined, isReversed: boolean) => {
|
package/test/utils.test.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
currenciesToInstruments,
|
|
3
|
+
getPriceMovement,
|
|
3
4
|
validCurrencies,
|
|
4
5
|
} from '../src/CurrencyCrossTableWidget/utils';
|
|
5
6
|
import { Division } from '../src/gql/types/graphql';
|
|
@@ -145,3 +146,24 @@ describe('currenciesToInstruments', () => {
|
|
|
145
146
|
]);
|
|
146
147
|
});
|
|
147
148
|
});
|
|
149
|
+
|
|
150
|
+
describe('getPriceMovement()', () => {
|
|
151
|
+
it.each([
|
|
152
|
+
[-1, 0.63386, 0.63385, 5, false],
|
|
153
|
+
[1, 163.219, 163.22, 3, false],
|
|
154
|
+
[1, 163.204, 163.173, 6, true],
|
|
155
|
+
[0, 163.219, 163.219, 3, false],
|
|
156
|
+
[0, 163.219, 163.22, 6, true],
|
|
157
|
+
])(
|
|
158
|
+
'should return %s when previous = %s, update = %s, displayPrecision = %s, isReversed = %s',
|
|
159
|
+
(expected, previous, update, displayPrecision, isReversed) => {
|
|
160
|
+
const result = getPriceMovement({
|
|
161
|
+
previous,
|
|
162
|
+
update,
|
|
163
|
+
displayPrecision,
|
|
164
|
+
isReversed,
|
|
165
|
+
});
|
|
166
|
+
expect(result).toBe(expected);
|
|
167
|
+
}
|
|
168
|
+
);
|
|
169
|
+
});
|