@antscorp/antsomi-ui 2.0.121 → 2.0.123
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 +92 -92
- package/es/components/organism/BasicLogin/components/AuthenticateResult/AuthenticateResult.js +1 -1
- package/es/components/organism/BasicLogin/components/ChooseMethod/ChooseMethod.js +37 -19
- package/es/components/organism/BasicLogin/components/ChooseMethod/Method.d.ts +1 -0
- package/es/components/organism/BasicLogin/components/ChooseMethod/Method.js +4 -5
- package/es/components/organism/BasicLogin/components/ChooseMethod/styled.d.ts +10 -3
- package/es/components/organism/BasicLogin/components/ChooseMethod/styled.js +54 -6
- package/es/components/organism/BasicLogin/components/LoginWithEmail/LoginWithEmail.js +2 -2
- package/es/components/organism/BasicLogin/components/LoginWithGG/LoginWithGG.js +3 -3
- package/es/components/organism/Login/components/ChooseMethod/ChooseMethod.js +36 -19
- package/es/components/organism/Login/components/ChooseMethod/ChooseMethod.spec.d.ts +1 -0
- package/es/components/organism/Login/components/ChooseMethod/ChooseMethod.spec.js +50 -0
- package/es/components/organism/Login/components/ChooseMethod/Method.d.ts +1 -0
- package/es/components/organism/Login/components/ChooseMethod/Method.js +4 -5
- package/es/components/organism/Login/components/ChooseMethod/styled.d.ts +10 -3
- package/es/components/organism/Login/components/ChooseMethod/styled.js +54 -6
- package/es/components/organism/Login/components/LoginSelectPortal/LoginSelectPortal.js +1 -1
- package/es/components/organism/Login/components/LoginWithEmail/LoginWithEmail.js +1 -1
- package/es/components/organism/Login/components/LoginWithGG/LoginWithGG.js +1 -1
- package/es/components/organism/Login/components/WidgetLayout/styled.d.ts +3 -0
- package/es/components/organism/Login/components/WidgetLayout/styled.js +6 -0
- package/es/components/organism/Login/styled.d.ts +1 -0
- package/es/components/organism/Login/styled.js +1 -0
- package/es/components/organism/TicketEditor/Content.js +74 -35
- package/es/components/organism/TicketEditor/util.d.ts +1 -0
- package/es/components/organism/TicketEditor/util.js +1 -0
- package/es/components/organism/TicketEditorV2/Content.js +62 -28
- package/es/components/organism/TicketEditorV2/util.d.ts +1 -0
- package/es/components/organism/TicketEditorV2/util.js +1 -0
- package/es/utils/uploadEmbeddedImages.d.ts +7 -0
- package/es/utils/uploadEmbeddedImages.js +65 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,92 +1,92 @@
|
|
|
1
|
-
### Changelog
|
|
2
|
-
|
|
3
|
-
All notable changes to this project will be documented in this file. Dates are displayed in UTC.
|
|
4
|
-
|
|
5
|
-
Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
|
|
6
|
-
|
|
7
|
-
#### [v2.0.
|
|
8
|
-
|
|
9
|
-
- feat: update version antsomi-locales [`7d44aae`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7d44aae3055b3b1bbfb772e2ed3afd5fa920fd05)
|
|
10
|
-
-
|
|
11
|
-
- feat:
|
|
12
|
-
|
|
13
|
-
#### [v2.0.64-staging.60](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.64-staging.60..v2.0.64-staging.58)
|
|
14
|
-
|
|
15
|
-
> 20 March 2026
|
|
16
|
-
|
|
17
|
-
- feat: update message activity timeline [`7a3bc15`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7a3bc15dd2e2eb7caf91e6bf064edd48e97dcdb2)
|
|
18
|
-
- feat: add fallback scheme_code [`ecb8e67`](https://bitbucket.org/git-vn/at.packages.frontend/commits/ecb8e67a56b93610df913c2f7c37d89b8be98ad6)
|
|
19
|
-
- feat: update extra keys [`da5b04e`](https://bitbucket.org/git-vn/at.packages.frontend/commits/da5b04e9e1c6b5d0c3584c4e08ffe70733ad4e77)
|
|
20
|
-
|
|
21
|
-
#### [v2.0.64-staging.58](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.64-staging.58..v2.0.64-staging.54)
|
|
22
|
-
|
|
23
|
-
> 17 March 2026
|
|
24
|
-
|
|
25
|
-
- feat: add event tg [`3d5672b`](https://bitbucket.org/git-vn/at.packages.frontend/commits/3d5672bf798efc459cec8c2866692ecc48be1141)
|
|
26
|
-
- feat: update message activity timeline leads [`3b1590e`](https://bitbucket.org/git-vn/at.packages.frontend/commits/3b1590ee8c5aa8a1d671082f6fd72d9d85b6414b)
|
|
27
|
-
- feat: update message activity timeline leads [`8b4d22c`](https://bitbucket.org/git-vn/at.packages.frontend/commits/8b4d22cf8d1ad4a4cc0e7c36dcd8306ae9e2f7d7)
|
|
28
|
-
|
|
29
|
-
#### [v2.0.64-staging.54](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.64-staging.54..v2.0.22)
|
|
30
|
-
|
|
31
|
-
> 30 January 2026
|
|
32
|
-
|
|
33
|
-
- fix: build search logic [`#27`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/27)
|
|
34
|
-
- feat: add report area chart [`4a0fad4`](https://bitbucket.org/git-vn/at.packages.frontend/commits/4a0fad4b405425ef03b9cf6038f6e9389f44a366)
|
|
35
|
-
- chore: update storybook version [`d13f194`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d13f19462c2fe117934df7fe2e09fd0aa95a0167)
|
|
36
|
-
- feat: init antsomi-genai [`d898d07`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d898d07f09cf6436ff9ba2a5430e08fc44190781)
|
|
37
|
-
|
|
38
|
-
### [v2.0.22](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.22..v1.0.10)
|
|
39
|
-
|
|
40
|
-
> 19 January 2023
|
|
41
|
-
|
|
42
|
-
#### [v1.0.10](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.10..v1.0.9)
|
|
43
|
-
|
|
44
|
-
> 20 June 2024
|
|
45
|
-
|
|
46
|
-
#### [v1.0.9](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.9..v1.0.8)
|
|
47
|
-
|
|
48
|
-
> 20 June 2024
|
|
49
|
-
|
|
50
|
-
#### [v1.0.8](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.8..v1.0.3)
|
|
51
|
-
|
|
52
|
-
> 20 June 2024
|
|
53
|
-
|
|
54
|
-
- feat(SelectAccount): add component [`2f1dea0`](https://bitbucket.org/git-vn/at.packages.frontend/commits/2f1dea035af07a01a6be8da47b531d52d2977bbe)
|
|
55
|
-
- fix: update style for calendar selection [`4347b91`](https://bitbucket.org/git-vn/at.packages.frontend/commits/4347b91f5bbe31caeb64478116c1822fe443f359)
|
|
56
|
-
- feat(EditorTab): use modal async in onCloseTab [`76aece8`](https://bitbucket.org/git-vn/at.packages.frontend/commits/76aece8cc7a44385d63019058daa1f8477c8fbcb)
|
|
57
|
-
|
|
58
|
-
#### [v1.0.3](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.3..v1.0.2)
|
|
59
|
-
|
|
60
|
-
> 17 January 2023
|
|
61
|
-
|
|
62
|
-
- update timeline package [`e198927`](https://bitbucket.org/git-vn/at.packages.frontend/commits/e198927d83931f9155e90ab9a1d9d3a5ac2989c4)
|
|
63
|
-
- update-ticket-editor [`38dd7b0`](https://bitbucket.org/git-vn/at.packages.frontend/commits/38dd7b0a7b2b0b58a63e725419e9b057e053f44f)
|
|
64
|
-
- update-upload-file-ticket-editor [`bb2f2ef`](https://bitbucket.org/git-vn/at.packages.frontend/commits/bb2f2ef1c46f4239ad716c897e53856a6368ea7d)
|
|
65
|
-
|
|
66
|
-
#### v1.0.2
|
|
67
|
-
|
|
68
|
-
> 4 January 2023
|
|
69
|
-
|
|
70
|
-
- Sprint10/vinlt/feature/date advanced [`#24`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/24)
|
|
71
|
-
- Sprint10/sangndd/feature/extend value matches any [`#23`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/23)
|
|
72
|
-
- Sprint10/sangndd/feature/extend value matches any [`#22`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/22)
|
|
73
|
-
- [Scatter chart] Max X-axis giá trị bị lặp [`#20`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/20)
|
|
74
|
-
- Sprint8/vinlt/feature/show data label short [`#18`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/18)
|
|
75
|
-
- Fix duplicate axis max value [`#17`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/17)
|
|
76
|
-
- [Antalyser] Một số bug khi nhập axis giá trị thập phân [`#16`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/16)
|
|
77
|
-
- Sprint6/vinlt/fixbug/chart [`#15`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/15)
|
|
78
|
-
- - Axis allows input of decimal values [`#14`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/14)
|
|
79
|
-
- Sprint4/sangndd/feature/icons [`#12`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/12)
|
|
80
|
-
- Sprint4/sangndd/feature/icons [`#11`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/11)
|
|
81
|
-
- Sprint4/thanghn/fixbug/pivot alias border [`#10`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/10)
|
|
82
|
-
- fix scroll dimension and total column [`#9`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/9)
|
|
83
|
-
- [ANTALYSER][Filter][Khi filter filed có type date và semantic là "Month day" thì không load được danh sách các ngày trong tháng] [`#7`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/7)
|
|
84
|
-
- [ANTALYSER][Pivot chart][Tính năng Add border shadow chưa hoạt động] [`#8`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/8)
|
|
85
|
-
- Fix bug [ANTALYSER][Scatter chart][Label ở cột X và Y chưa đổi theo alias name đã change ở metric] [`#6`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/6)
|
|
86
|
-
- Fix bug [Pivot chart] Row color không hiển thị được khi chọn hiển thị data của metric là Bar [`#5`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/5)
|
|
87
|
-
- Fix bug package antscorp/charts [`#1`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/1)
|
|
88
|
-
- Fix bug package antscorp/chart [`#2`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/2)
|
|
89
|
-
- table component [`#1`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/1)
|
|
90
|
-
- Update map indonesia [`fc94208`](https://bitbucket.org/git-vn/at.packages.frontend/commits/fc9420838b3f4087a5763017e9bf7e72ee8c5e31)
|
|
91
|
-
- Update geomap [`43f3098`](https://bitbucket.org/git-vn/at.packages.frontend/commits/43f3098506f30a215dc2b30734590e5c55f8b490)
|
|
92
|
-
- sync package master [`7476118`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7476118de2fcfa1bd6b0a9e3c0f887b29fd149b6)
|
|
1
|
+
### Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to this project will be documented in this file. Dates are displayed in UTC.
|
|
4
|
+
|
|
5
|
+
Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
|
|
6
|
+
|
|
7
|
+
#### [v2.0.123](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.123..v2.0.64-staging.60)
|
|
8
|
+
|
|
9
|
+
- feat: update version antsomi-locales [`7d44aae`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7d44aae3055b3b1bbfb772e2ed3afd5fa920fd05)
|
|
10
|
+
- feat: scaffold antsomi ui v2 facade [`5bf7910`](https://bitbucket.org/git-vn/at.packages.frontend/commits/5bf7910250bbf5577bfb95b3f93c14f23c4f9584)
|
|
11
|
+
- feat: add antsomi light theme provider [`04e7fca`](https://bitbucket.org/git-vn/at.packages.frontend/commits/04e7fcae7ccb861d97e43392ab4966a11c7e8774)
|
|
12
|
+
|
|
13
|
+
#### [v2.0.64-staging.60](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.64-staging.60..v2.0.64-staging.58)
|
|
14
|
+
|
|
15
|
+
> 20 March 2026
|
|
16
|
+
|
|
17
|
+
- feat: update message activity timeline [`7a3bc15`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7a3bc15dd2e2eb7caf91e6bf064edd48e97dcdb2)
|
|
18
|
+
- feat: add fallback scheme_code [`ecb8e67`](https://bitbucket.org/git-vn/at.packages.frontend/commits/ecb8e67a56b93610df913c2f7c37d89b8be98ad6)
|
|
19
|
+
- feat: update extra keys [`da5b04e`](https://bitbucket.org/git-vn/at.packages.frontend/commits/da5b04e9e1c6b5d0c3584c4e08ffe70733ad4e77)
|
|
20
|
+
|
|
21
|
+
#### [v2.0.64-staging.58](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.64-staging.58..v2.0.64-staging.54)
|
|
22
|
+
|
|
23
|
+
> 17 March 2026
|
|
24
|
+
|
|
25
|
+
- feat: add event tg [`3d5672b`](https://bitbucket.org/git-vn/at.packages.frontend/commits/3d5672bf798efc459cec8c2866692ecc48be1141)
|
|
26
|
+
- feat: update message activity timeline leads [`3b1590e`](https://bitbucket.org/git-vn/at.packages.frontend/commits/3b1590ee8c5aa8a1d671082f6fd72d9d85b6414b)
|
|
27
|
+
- feat: update message activity timeline leads [`8b4d22c`](https://bitbucket.org/git-vn/at.packages.frontend/commits/8b4d22cf8d1ad4a4cc0e7c36dcd8306ae9e2f7d7)
|
|
28
|
+
|
|
29
|
+
#### [v2.0.64-staging.54](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.64-staging.54..v2.0.22)
|
|
30
|
+
|
|
31
|
+
> 30 January 2026
|
|
32
|
+
|
|
33
|
+
- fix: build search logic [`#27`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/27)
|
|
34
|
+
- feat: add report area chart [`4a0fad4`](https://bitbucket.org/git-vn/at.packages.frontend/commits/4a0fad4b405425ef03b9cf6038f6e9389f44a366)
|
|
35
|
+
- chore: update storybook version [`d13f194`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d13f19462c2fe117934df7fe2e09fd0aa95a0167)
|
|
36
|
+
- feat: init antsomi-genai [`d898d07`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d898d07f09cf6436ff9ba2a5430e08fc44190781)
|
|
37
|
+
|
|
38
|
+
### [v2.0.22](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.22..v1.0.10)
|
|
39
|
+
|
|
40
|
+
> 19 January 2023
|
|
41
|
+
|
|
42
|
+
#### [v1.0.10](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.10..v1.0.9)
|
|
43
|
+
|
|
44
|
+
> 20 June 2024
|
|
45
|
+
|
|
46
|
+
#### [v1.0.9](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.9..v1.0.8)
|
|
47
|
+
|
|
48
|
+
> 20 June 2024
|
|
49
|
+
|
|
50
|
+
#### [v1.0.8](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.8..v1.0.3)
|
|
51
|
+
|
|
52
|
+
> 20 June 2024
|
|
53
|
+
|
|
54
|
+
- feat(SelectAccount): add component [`2f1dea0`](https://bitbucket.org/git-vn/at.packages.frontend/commits/2f1dea035af07a01a6be8da47b531d52d2977bbe)
|
|
55
|
+
- fix: update style for calendar selection [`4347b91`](https://bitbucket.org/git-vn/at.packages.frontend/commits/4347b91f5bbe31caeb64478116c1822fe443f359)
|
|
56
|
+
- feat(EditorTab): use modal async in onCloseTab [`76aece8`](https://bitbucket.org/git-vn/at.packages.frontend/commits/76aece8cc7a44385d63019058daa1f8477c8fbcb)
|
|
57
|
+
|
|
58
|
+
#### [v1.0.3](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.3..v1.0.2)
|
|
59
|
+
|
|
60
|
+
> 17 January 2023
|
|
61
|
+
|
|
62
|
+
- update timeline package [`e198927`](https://bitbucket.org/git-vn/at.packages.frontend/commits/e198927d83931f9155e90ab9a1d9d3a5ac2989c4)
|
|
63
|
+
- update-ticket-editor [`38dd7b0`](https://bitbucket.org/git-vn/at.packages.frontend/commits/38dd7b0a7b2b0b58a63e725419e9b057e053f44f)
|
|
64
|
+
- update-upload-file-ticket-editor [`bb2f2ef`](https://bitbucket.org/git-vn/at.packages.frontend/commits/bb2f2ef1c46f4239ad716c897e53856a6368ea7d)
|
|
65
|
+
|
|
66
|
+
#### v1.0.2
|
|
67
|
+
|
|
68
|
+
> 4 January 2023
|
|
69
|
+
|
|
70
|
+
- Sprint10/vinlt/feature/date advanced [`#24`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/24)
|
|
71
|
+
- Sprint10/sangndd/feature/extend value matches any [`#23`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/23)
|
|
72
|
+
- Sprint10/sangndd/feature/extend value matches any [`#22`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/22)
|
|
73
|
+
- [Scatter chart] Max X-axis giá trị bị lặp [`#20`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/20)
|
|
74
|
+
- Sprint8/vinlt/feature/show data label short [`#18`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/18)
|
|
75
|
+
- Fix duplicate axis max value [`#17`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/17)
|
|
76
|
+
- [Antalyser] Một số bug khi nhập axis giá trị thập phân [`#16`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/16)
|
|
77
|
+
- Sprint6/vinlt/fixbug/chart [`#15`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/15)
|
|
78
|
+
- - Axis allows input of decimal values [`#14`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/14)
|
|
79
|
+
- Sprint4/sangndd/feature/icons [`#12`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/12)
|
|
80
|
+
- Sprint4/sangndd/feature/icons [`#11`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/11)
|
|
81
|
+
- Sprint4/thanghn/fixbug/pivot alias border [`#10`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/10)
|
|
82
|
+
- fix scroll dimension and total column [`#9`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/9)
|
|
83
|
+
- [ANTALYSER][Filter][Khi filter filed có type date và semantic là "Month day" thì không load được danh sách các ngày trong tháng] [`#7`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/7)
|
|
84
|
+
- [ANTALYSER][Pivot chart][Tính năng Add border shadow chưa hoạt động] [`#8`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/8)
|
|
85
|
+
- Fix bug [ANTALYSER][Scatter chart][Label ở cột X và Y chưa đổi theo alias name đã change ở metric] [`#6`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/6)
|
|
86
|
+
- Fix bug [Pivot chart] Row color không hiển thị được khi chọn hiển thị data của metric là Bar [`#5`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/5)
|
|
87
|
+
- Fix bug package antscorp/charts [`#1`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/1)
|
|
88
|
+
- Fix bug package antscorp/chart [`#2`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/2)
|
|
89
|
+
- table component [`#1`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/1)
|
|
90
|
+
- Update map indonesia [`fc94208`](https://bitbucket.org/git-vn/at.packages.frontend/commits/fc9420838b3f4087a5763017e9bf7e72ee8c5e31)
|
|
91
|
+
- Update geomap [`43f3098`](https://bitbucket.org/git-vn/at.packages.frontend/commits/43f3098506f30a215dc2b30734590e5c55f8b490)
|
|
92
|
+
- sync package master [`7476118`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7476118de2fcfa1bd6b0a9e3c0f887b29fd149b6)
|
package/es/components/organism/BasicLogin/components/AuthenticateResult/AuthenticateResult.js
CHANGED
|
@@ -17,7 +17,7 @@ export const AuthenticateResult = props => {
|
|
|
17
17
|
backLogin();
|
|
18
18
|
}
|
|
19
19
|
};
|
|
20
|
-
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx("div", { style: { marginBottom: 100 } }), gapContent:
|
|
20
|
+
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx("div", { style: { marginBottom: 100 } }), gapContent: 30, content: _jsx(Flex, { vertical: true, gap: 50, children: _jsxs(Flex, { vertical: true, gap: 20, align: "center", children: [_jsx("img", { src: authenSuccessImg, alt: "" }), _jsx(Title, { isMobile: isMobile, children: "Authenticated!" }), _jsxs(Text, { isMobile: isMobile, children: ["Sign in as ", get(loginData, 'personal.full_name')] })] }) }), footer: _jsx(Flex, { justify: "center", children: _jsx(Button, { type: "text", onClick: handleBack, style: {
|
|
21
21
|
fontSize: isMobile ? '16px' : '14px',
|
|
22
22
|
}, children: "Sign in with a different account" }) }) }));
|
|
23
23
|
};
|
|
@@ -5,7 +5,7 @@ import { Button, Flex } from 'antd';
|
|
|
5
5
|
import { get } from 'lodash';
|
|
6
6
|
import { useMemo } from 'react';
|
|
7
7
|
import { isMobile } from 'react-device-detect';
|
|
8
|
-
import { EmailTemplateIcon,
|
|
8
|
+
import { EmailTemplateIcon, PhoneIphoneIcon } from '@antscorp/antsomi-ui/es/components/icons';
|
|
9
9
|
// Components
|
|
10
10
|
import { WidgetLayout } from '../WidgetLayout';
|
|
11
11
|
import { Method } from './Method';
|
|
@@ -13,6 +13,8 @@ import { Method } from './Method';
|
|
|
13
13
|
import verifyImage from '../../../../../assets/images/components/Login/loginStep2.png';
|
|
14
14
|
// Utils
|
|
15
15
|
import { maskEmail } from './utils';
|
|
16
|
+
// Styled
|
|
17
|
+
import { SubTitle } from './styled';
|
|
16
18
|
import { Title } from '../WidgetLayout/styled';
|
|
17
19
|
import { Text } from '../../styled';
|
|
18
20
|
import { LOGIN_METHODS } from '../../constants';
|
|
@@ -24,31 +26,47 @@ export const ChooseMethod = props => {
|
|
|
24
26
|
}
|
|
25
27
|
};
|
|
26
28
|
const methods = useMemo(() => {
|
|
27
|
-
const options = loginData?.auth_options || []
|
|
28
|
-
|
|
29
|
+
const options = [...(loginData?.auth_options || [])].sort((first, second) => {
|
|
30
|
+
if (first.provider === 'email') {
|
|
31
|
+
return -1;
|
|
32
|
+
}
|
|
33
|
+
if (second.provider === 'email') {
|
|
34
|
+
return 1;
|
|
35
|
+
}
|
|
36
|
+
return 0;
|
|
37
|
+
});
|
|
38
|
+
return options
|
|
39
|
+
.filter(opt => opt.provider !== 'google' || loginData.G2FA_user === 1)
|
|
40
|
+
.flatMap(opt => {
|
|
29
41
|
switch (opt.provider) {
|
|
30
42
|
case 'google':
|
|
31
|
-
return
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
:
|
|
38
|
-
|
|
43
|
+
return [
|
|
44
|
+
{
|
|
45
|
+
disable: opt.status !== 1,
|
|
46
|
+
icon: _jsx(PhoneIphoneIcon, { color: "#005eb8" }),
|
|
47
|
+
name: LOGIN_METHODS.GOOGLE_AUTHENTICATOR,
|
|
48
|
+
label: 'Authenticator app',
|
|
49
|
+
description: opt.status === 1
|
|
50
|
+
? 'Enter the code from your authenticator app.'
|
|
51
|
+
: 'Enter the code from your authenticator app. Authenticator not available.',
|
|
52
|
+
},
|
|
53
|
+
];
|
|
39
54
|
case 'email':
|
|
40
|
-
return
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
55
|
+
return [
|
|
56
|
+
{
|
|
57
|
+
disable: opt.status !== 1,
|
|
58
|
+
icon: _jsx(EmailTemplateIcon, { color: "#005eb8" }),
|
|
59
|
+
name: LOGIN_METHODS.EMAIL,
|
|
60
|
+
label: 'Email Verification',
|
|
61
|
+
description: `We'll send a 6-digit verification code to ${maskEmail(get(loginData, 'personal.email', ''))}`,
|
|
62
|
+
},
|
|
63
|
+
];
|
|
46
64
|
default:
|
|
47
|
-
return
|
|
65
|
+
return [];
|
|
48
66
|
}
|
|
49
67
|
});
|
|
50
68
|
}, [loginData]);
|
|
51
|
-
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent:
|
|
69
|
+
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent: 20, content: _jsxs(Flex, { vertical: true, gap: 50, children: [_jsxs(Flex, { vertical: true, gap: 20, align: "center", children: [_jsx("img", { src: verifyImage, alt: "" }), _jsx(Text, { isMobile: isMobile, color: "#595959", children: "For your security, we need to verify your identity before continuing." })] }), _jsxs(Flex, { vertical: true, gap: isMobile ? 10 : 13, children: [_jsx(Flex, { gap: 5, align: "center", justify: "center", children: _jsx(SubTitle, { isMobile: isMobile, children: "How would you like to verify your identity?" }) }), _jsx(Flex, { vertical: true, gap: isMobile ? 20 : 11, children: methods.map(({ disable, icon, name, label, description }) => (_jsx(Method, { disable: disable, onClick: onChooseMethod, icon: icon, name: name, label: label, description: description }, name))) })] })] }), footer: _jsx(Flex, { justify: "center", children: _jsx(Button, { type: "text", onClick: handleBack, style: {
|
|
52
70
|
fontSize: isMobile ? '16px' : '14px',
|
|
53
71
|
}, children: "Sign in with a different account" }) }) }));
|
|
54
72
|
};
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
import { BlockMethod } from './styled';
|
|
4
|
-
import { Text } from '../../styled';
|
|
2
|
+
import { ChevronRightIcon } from '@antscorp/antsomi-ui/es/components/icons';
|
|
3
|
+
import { BlockMethod, MethodContent, MethodDescription, MethodIcon, MethodLabel } from './styled';
|
|
5
4
|
export const Method = (props) => {
|
|
6
|
-
const { onClick, icon, label, disable, name } = props;
|
|
5
|
+
const { onClick, icon, label, description, disable, name } = props;
|
|
7
6
|
const onChooseMethod = () => {
|
|
8
7
|
if (!disable && onClick) {
|
|
9
8
|
onClick(name);
|
|
10
9
|
}
|
|
11
10
|
};
|
|
12
|
-
return (_jsxs(BlockMethod, { onClick: onChooseMethod, disable: disable, "data-test": name, children: [_jsx("
|
|
11
|
+
return (_jsxs(BlockMethod, { type: "button", onClick: onChooseMethod, disabled: disable, "$disable": disable, "data-test": name, children: [_jsx(MethodIcon, { children: icon }), _jsxs(MethodContent, { children: [_jsx(MethodLabel, { "$disable": disable, children: label }), _jsx(MethodDescription, { "$disable": disable, children: description })] }), _jsx(ChevronRightIcon, { "aria-hidden": true, color: disable ? '#9c9b9b' : '#005eb8', width: 20, height: 20 })] }));
|
|
13
12
|
};
|
|
@@ -1,10 +1,17 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
export declare const TextInfo: import("styled-components").StyledComponent<"span", any, {
|
|
3
2
|
isMobile: boolean;
|
|
4
3
|
}, never>;
|
|
5
4
|
export declare const SubTitle: import("styled-components").StyledComponent<"span", any, {
|
|
6
5
|
isMobile: boolean;
|
|
7
6
|
}, never>;
|
|
8
|
-
export declare const BlockMethod: import("styled-components").StyledComponent<
|
|
9
|
-
disable?: boolean | undefined;
|
|
7
|
+
export declare const BlockMethod: import("styled-components").StyledComponent<"button", any, {
|
|
8
|
+
$disable?: boolean | undefined;
|
|
9
|
+
}, never>;
|
|
10
|
+
export declare const MethodIcon: import("styled-components").StyledComponent<"span", any, {}, never>;
|
|
11
|
+
export declare const MethodContent: import("styled-components").StyledComponent<"span", any, {}, never>;
|
|
12
|
+
export declare const MethodLabel: import("styled-components").StyledComponent<"span", any, {
|
|
13
|
+
$disable?: boolean | undefined;
|
|
14
|
+
}, never>;
|
|
15
|
+
export declare const MethodDescription: import("styled-components").StyledComponent<"span", any, {
|
|
16
|
+
$disable?: boolean | undefined;
|
|
10
17
|
}, never>;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { Flex } from 'antd';
|
|
2
1
|
import styled from 'styled-components';
|
|
3
2
|
export const TextInfo = styled.span `
|
|
4
3
|
color: #7f7f7f;
|
|
@@ -9,16 +8,65 @@ export const SubTitle = styled.span `
|
|
|
9
8
|
font-size: ${(props) => (props.isMobile ? ' 16px ' : '14px')};
|
|
10
9
|
font-weight: 500;
|
|
11
10
|
`;
|
|
12
|
-
export const BlockMethod = styled
|
|
11
|
+
export const BlockMethod = styled.button `
|
|
12
|
+
display: flex;
|
|
13
13
|
align-items: center;
|
|
14
14
|
gap: 10px;
|
|
15
|
+
width: 100%;
|
|
16
|
+
min-height: 64px;
|
|
15
17
|
padding: 10px;
|
|
16
|
-
|
|
18
|
+
box-sizing: border-box;
|
|
19
|
+
cursor: ${props => (props.$disable ? 'not-allowed' : 'pointer')};
|
|
20
|
+
background-color: #ffffff;
|
|
21
|
+
border: 1px solid #b8cfe6;
|
|
17
22
|
border-radius: 10px;
|
|
23
|
+
font-family: inherit;
|
|
24
|
+
text-align: left;
|
|
25
|
+
opacity: ${props => (props.$disable ? '0.5' : '1')};
|
|
18
26
|
|
|
19
|
-
|
|
27
|
+
&:hover:not(:disabled) {
|
|
28
|
+
background-color: #f2f9ff;
|
|
29
|
+
border-color: #81bcf4;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
&:focus-visible {
|
|
33
|
+
outline: 2px solid #005eb8;
|
|
34
|
+
outline-offset: 2px;
|
|
35
|
+
}
|
|
36
|
+
`;
|
|
37
|
+
export const MethodIcon = styled.span `
|
|
38
|
+
display: flex;
|
|
39
|
+
flex: 0 0 24px;
|
|
40
|
+
align-self: flex-start;
|
|
41
|
+
align-items: flex-start;
|
|
42
|
+
justify-content: flex-start;
|
|
43
|
+
margin-top: 2px;
|
|
44
|
+
|
|
45
|
+
svg {
|
|
46
|
+
width: 24px;
|
|
47
|
+
height: 24px;
|
|
48
|
+
}
|
|
49
|
+
`;
|
|
50
|
+
export const MethodContent = styled.span `
|
|
51
|
+
display: flex;
|
|
52
|
+
flex: 1;
|
|
53
|
+
min-width: 0;
|
|
54
|
+
flex-direction: column;
|
|
55
|
+
gap: 5px;
|
|
56
|
+
`;
|
|
57
|
+
export const MethodLabel = styled.span `
|
|
58
|
+
color: ${props => (props.$disable ? '#9c9b9b' : '#000000')};
|
|
59
|
+
font-size: 14px;
|
|
60
|
+
|
|
61
|
+
@media (max-width: 768px) {
|
|
62
|
+
font-size: 16px;
|
|
63
|
+
}
|
|
64
|
+
`;
|
|
65
|
+
export const MethodDescription = styled.span `
|
|
66
|
+
color: ${props => (props.$disable ? '#9c9b9b' : '#595959')};
|
|
67
|
+
font-size: 12px;
|
|
20
68
|
|
|
21
|
-
|
|
22
|
-
|
|
69
|
+
@media (max-width: 768px) {
|
|
70
|
+
font-size: 13px;
|
|
23
71
|
}
|
|
24
72
|
`;
|
|
@@ -186,7 +186,7 @@ export const LoginWithEmail = ({ loginData, domainLogin, codeKey = 'code', token
|
|
|
186
186
|
const renderAlternativeSignIn = () => (_jsx(Flex, { justify: "center", children: _jsx(Button, { type: "text", onClick: handleBack, style: {
|
|
187
187
|
fontSize: isMobile ? '16px' : '14px',
|
|
188
188
|
}, children: "Sign in with a different account" }) }));
|
|
189
|
-
const renderContent = () => (_jsxs(Flex, { vertical: true, gap: 50,
|
|
189
|
+
const renderContent = () => (_jsxs(Flex, { vertical: true, gap: 50, children: [_jsxs(Flex, { vertical: true, gap: 20, align: "center", children: [_jsx("img", { src: loginStep2Image, alt: "Identity Verification" }), _jsx(Text, { isMobile: isMobile, color: "#595959", children: "For your security, we need to verify your identity before continuing." })] }), _jsxs(Flex, { vertical: true, gap: isMobile ? 10 : 15, children: [renderResendSection(), _jsx(Flex, { vertical: true, gap: isMobile ? 20 : 11, children: renderCodeInput() }), _jsx(Flex, { vertical: true, gap: isMobile ? 30 : 15, style: { marginTop: isMobile ? 20 : 15 }, children: renderActionButtons() })] })] }));
|
|
190
190
|
const renderFooter = () => renderAlternativeSignIn();
|
|
191
|
-
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent:
|
|
191
|
+
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent: 20, content: renderContent(), footer: renderFooter() }));
|
|
192
192
|
};
|
|
@@ -99,9 +99,9 @@ export const LoginWithGG = ({ domainLogin, codeKey = 'code', token = '', onLogin
|
|
|
99
99
|
const renderAlternativeSignIn = () => (_jsx(Flex, { justify: "center", children: _jsx(Button, { type: "text", onClick: handleBack, style: {
|
|
100
100
|
fontSize: isMobile ? '16px' : '14px',
|
|
101
101
|
}, children: "Sign in with a different account" }) }));
|
|
102
|
-
const renderHeaderSection = () => (_jsxs(Flex, { vertical: true, gap: 20, align: "center", children: [_jsx("img", { src: loginStep2Image, alt: "Identity Verification Step" }), _jsx(Text, { isMobile: isMobile, color: "#595959", children: "For
|
|
102
|
+
const renderHeaderSection = () => (_jsxs(Flex, { vertical: true, gap: 20, align: "center", children: [_jsx("img", { src: loginStep2Image, alt: "Identity Verification Step" }), _jsx(Text, { isMobile: isMobile, color: "#595959", children: "For your security, we need to verify your identity before continuing." })] }));
|
|
103
103
|
const renderInputSection = () => (_jsxs(Flex, { vertical: true, gap: isMobile ? 10 : 15, children: [renderInstructionSection(), _jsx(Flex, { vertical: true, gap: isMobile ? 20 : 11, children: renderCodeInput() }), _jsx(Flex, { vertical: true, gap: isMobile ? 30 : 15, style: { marginTop: isMobile ? 20 : 15 }, children: renderActionButtons() })] }));
|
|
104
|
-
const renderContent = () => (_jsxs(Flex, { vertical: true, gap: 50,
|
|
104
|
+
const renderContent = () => (_jsxs(Flex, { vertical: true, gap: 50, children: [renderHeaderSection(), renderInputSection()] }));
|
|
105
105
|
const renderFooter = () => renderAlternativeSignIn();
|
|
106
|
-
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent:
|
|
106
|
+
return (_jsx(WidgetLayout, { header: null, isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent: 20, content: renderContent(), footer: renderFooter() }));
|
|
107
107
|
};
|
|
@@ -12,8 +12,9 @@ import { Method } from './Method';
|
|
|
12
12
|
// Images
|
|
13
13
|
import loginStep2Image from '../../../../../assets/images/components/Login/loginStep2.png';
|
|
14
14
|
import { Text } from '../../styled';
|
|
15
|
+
import { SubTitle } from './styled';
|
|
15
16
|
import { Title } from '../WidgetLayout/styled';
|
|
16
|
-
import { EmailTemplateIcon,
|
|
17
|
+
import { EmailTemplateIcon, PhoneIphoneIcon } from '@antscorp/antsomi-ui/es/components/icons';
|
|
17
18
|
import { maskEmail } from './utils';
|
|
18
19
|
import { LOGIN_METHODS } from '../../constants';
|
|
19
20
|
export const ChooseMethod = props => {
|
|
@@ -24,31 +25,47 @@ export const ChooseMethod = props => {
|
|
|
24
25
|
}
|
|
25
26
|
};
|
|
26
27
|
const methods = useMemo(() => {
|
|
27
|
-
const options = loginData?.auth_options || []
|
|
28
|
-
|
|
28
|
+
const options = [...(loginData?.auth_options || [])].sort((first, second) => {
|
|
29
|
+
if (first.provider === 'email') {
|
|
30
|
+
return -1;
|
|
31
|
+
}
|
|
32
|
+
if (second.provider === 'email') {
|
|
33
|
+
return 1;
|
|
34
|
+
}
|
|
35
|
+
return 0;
|
|
36
|
+
});
|
|
37
|
+
return options
|
|
38
|
+
.filter(opt => opt.provider !== 'google' || loginData.G2FA_user === 1)
|
|
39
|
+
.flatMap(opt => {
|
|
29
40
|
switch (opt.provider) {
|
|
30
41
|
case 'google':
|
|
31
|
-
return
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
:
|
|
38
|
-
|
|
42
|
+
return [
|
|
43
|
+
{
|
|
44
|
+
disable: opt.status !== 1,
|
|
45
|
+
icon: _jsx(PhoneIphoneIcon, { color: "#005eb8" }),
|
|
46
|
+
name: LOGIN_METHODS.GOOGLE_AUTHENTICATOR,
|
|
47
|
+
label: 'Authenticator app',
|
|
48
|
+
description: opt.status === 1
|
|
49
|
+
? 'Enter the code from your authenticator app.'
|
|
50
|
+
: 'Enter the code from your authenticator app. Authenticator not available.',
|
|
51
|
+
},
|
|
52
|
+
];
|
|
39
53
|
case 'email':
|
|
40
|
-
return
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
54
|
+
return [
|
|
55
|
+
{
|
|
56
|
+
disable: opt.status !== 1,
|
|
57
|
+
icon: _jsx(EmailTemplateIcon, { color: "#005eb8" }),
|
|
58
|
+
name: LOGIN_METHODS.EMAIL,
|
|
59
|
+
label: 'Email Verification',
|
|
60
|
+
description: `We'll send a 6-digit verification code to ${maskEmail(get(loginData, 'personal.email', ''))}`,
|
|
61
|
+
},
|
|
62
|
+
];
|
|
46
63
|
default:
|
|
47
|
-
return
|
|
64
|
+
return [];
|
|
48
65
|
}
|
|
49
66
|
});
|
|
50
67
|
}, [loginData]);
|
|
51
|
-
return (_jsx(WidgetLayout, { header: _jsx(Avatar, { image: get(loginData, 'personal.avatar'), name: get(loginData, 'personal.full_name'), email: get(loginData, 'personal.email') }), isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent:
|
|
68
|
+
return (_jsx(WidgetLayout, { header: _jsx(Avatar, { image: get(loginData, 'personal.avatar'), name: get(loginData, 'personal.full_name'), email: get(loginData, 'personal.email') }), isShowLogo: false, title: _jsx(Title, { isMobile: isMobile, style: { marginTop: 20 }, children: "Identity Verification" }), gapContent: 20, content: _jsxs(Flex, { vertical: true, gap: 50, children: [_jsxs(Flex, { vertical: true, gap: 20, align: "center", children: [_jsx("img", { src: loginStep2Image, alt: "" }), _jsx(Text, { isMobile: isMobile, color: "#595959", isCenter: true, children: "For your security, we need to verify your identity before continuing." })] }), _jsxs(Flex, { vertical: true, gap: isMobile ? 10 : 13, children: [_jsx(Flex, { gap: 5, align: "center", justify: "center", children: _jsx(SubTitle, { isMobile: isMobile, children: "How would you like to verify your identity?" }) }), _jsx(Flex, { vertical: true, gap: isMobile ? 20 : 11, children: methods.map(({ disable, icon, name, label, description }) => (_jsx(Method, { disable: disable, onClick: onChooseMethod, icon: icon, name: name, label: label, description: description }, name))) })] })] }), footer: _jsx(Flex, { justify: "center", children: _jsx(Button, { type: "text", onClick: handleBack, style: {
|
|
52
69
|
fontSize: isMobile ? '16px' : '14px',
|
|
53
70
|
}, children: "Sign in with a different account" }) }) }));
|
|
54
71
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { cleanup, render, screen } from '@testing-library/react';
|
|
3
|
+
import { ChooseMethod as LoginChooseMethod } from './ChooseMethod';
|
|
4
|
+
import { ChooseMethod as BasicLoginChooseMethod } from '../../../BasicLogin/components/ChooseMethod/ChooseMethod';
|
|
5
|
+
const loginDataWithout2FA = {
|
|
6
|
+
G2FA_user: 0,
|
|
7
|
+
personal: {
|
|
8
|
+
avatar: '',
|
|
9
|
+
email: 'user@example.com',
|
|
10
|
+
full_name: 'Test User',
|
|
11
|
+
language: 'en',
|
|
12
|
+
role: '',
|
|
13
|
+
user_id: '1',
|
|
14
|
+
},
|
|
15
|
+
auth_options: [
|
|
16
|
+
{ provider: 'google', status: 1 },
|
|
17
|
+
{ provider: 'email', status: 1 },
|
|
18
|
+
],
|
|
19
|
+
};
|
|
20
|
+
describe.each([
|
|
21
|
+
['Login', LoginChooseMethod],
|
|
22
|
+
['BasicLogin', BasicLoginChooseMethod],
|
|
23
|
+
])('%s ChooseMethod', (_, ChooseMethod) => {
|
|
24
|
+
afterEach(cleanup);
|
|
25
|
+
it('renders Google Authenticator only when the account has enabled 2FA', () => {
|
|
26
|
+
const { rerender } = render(_jsx(ChooseMethod, { backLogin: () => undefined, loginData: loginDataWithout2FA, onChooseMethod: () => undefined }));
|
|
27
|
+
expect(screen.queryByText('Enter the code from your authenticator app.')).toBeNull();
|
|
28
|
+
expect(screen.queryByRole('button', { name: /Email Verification/ })).not.toBeNull();
|
|
29
|
+
rerender(_jsx(ChooseMethod, { backLogin: () => undefined, loginData: { ...loginDataWithout2FA, G2FA_user: 1 }, onChooseMethod: () => undefined }));
|
|
30
|
+
expect(screen.queryByText('Enter the code from your authenticator app.')).not.toBeNull();
|
|
31
|
+
});
|
|
32
|
+
it('renders each verification method with a label and description', () => {
|
|
33
|
+
render(_jsx(ChooseMethod, { backLogin: () => undefined, loginData: { ...loginDataWithout2FA, G2FA_user: 1 }, onChooseMethod: () => undefined }));
|
|
34
|
+
expect(screen.queryByText('How would you like to verify your identity?')).not.toBeNull();
|
|
35
|
+
expect(screen.queryByRole('button', {
|
|
36
|
+
name: "Email Verification We'll send a 6-digit verification code to u****r@e*******m.",
|
|
37
|
+
})).not.toBeNull();
|
|
38
|
+
expect(screen.queryByRole('button', {
|
|
39
|
+
name: 'Authenticator app Enter the code from your authenticator app.',
|
|
40
|
+
})).not.toBeNull();
|
|
41
|
+
});
|
|
42
|
+
it('renders Email Verification before Authenticator app regardless of backend order', () => {
|
|
43
|
+
render(_jsx(ChooseMethod, { backLogin: () => undefined, loginData: { ...loginDataWithout2FA, G2FA_user: 1 }, onChooseMethod: () => undefined }));
|
|
44
|
+
const methodButtons = screen.getAllByRole('button', {
|
|
45
|
+
name: /Email Verification|Authenticator app/,
|
|
46
|
+
});
|
|
47
|
+
expect(methodButtons[0].textContent).toContain('Email Verification');
|
|
48
|
+
expect(methodButtons[1].textContent).toContain('Authenticator app');
|
|
49
|
+
});
|
|
50
|
+
});
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
import { BlockMethod } from './styled';
|
|
4
|
-
import { Text } from '../../styled';
|
|
2
|
+
import { ChevronRightIcon } from '@antscorp/antsomi-ui/es/components/icons';
|
|
3
|
+
import { BlockMethod, MethodContent, MethodDescription, MethodIcon, MethodLabel } from './styled';
|
|
5
4
|
export const Method = (props) => {
|
|
6
|
-
const { onClick, icon, label, disable, name } = props;
|
|
5
|
+
const { onClick, icon, label, description, disable, name } = props;
|
|
7
6
|
const onChooseMethod = () => {
|
|
8
7
|
if (!disable && onClick) {
|
|
9
8
|
onClick(name);
|
|
10
9
|
}
|
|
11
10
|
};
|
|
12
|
-
return (_jsxs(BlockMethod, { onClick: onChooseMethod, disable: disable, "data-test": name, children: [_jsx("
|
|
11
|
+
return (_jsxs(BlockMethod, { type: "button", onClick: onChooseMethod, disabled: disable, "$disable": disable, "data-test": name, children: [_jsx(MethodIcon, { children: icon }), _jsxs(MethodContent, { children: [_jsx(MethodLabel, { "$disable": disable, children: label }), _jsx(MethodDescription, { "$disable": disable, children: description })] }), _jsx(ChevronRightIcon, { "aria-hidden": true, color: disable ? '#9c9b9b' : '#005eb8', width: 20, height: 20 })] }));
|
|
13
12
|
};
|