Page MenuHomePhabricator
Differential D14159

[native] replace back button with close button on the scanning QR code screen
ClosedPublic
Actions

Authored by kamil on Dec 16 2024, 3:27 AM.
Tags
None
Referenced Files
F5026136: D14159.diff
Mon, Mar 24, 9:30 AM
Unknown Object (File)
Fri, Mar 21, 7:10 AM
Unknown Object (File)
Mon, Mar 17, 6:32 PM
Unknown Object (File)
Mon, Mar 17, 6:31 AM
Unknown Object (File)
Mon, Mar 17, 6:31 AM
Unknown Object (File)
Mon, Mar 17, 6:31 AM
Unknown Object (File)
Mon, Mar 17, 6:31 AM
Unknown Object (File)
Feb 18 2025, 9:14 AM
View All 66 Files
Subscribers
None

Details

Reviewers
ashoat
tomek
Commits
rCOMM7c658ac97e62: [native] replace back button with close button on the scanning QR code screen
Summary

Part of ENG-9959.

Tracked in ENG-10026.

IMG_4827.PNG (1×828 px, 2 MB)

Depends on D14153

Test Plan

Test button

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

kamil created this revision.Dec 16 2024, 3:27 AM
kamil held this revision as a draft.
kamil edited the summary of this revision. (Show Details)Dec 16 2024, 3:29 AM
kamil added inline comments.
native/account/qr-auth/qr-code-scanner-left-button.react.js
25–31 ↗(On Diff #46458)

Inspired by close button in CameraModal but instead of Text x I used icon.

kamil published this revision for review.Dec 16 2024, 3:40 AM
Harbormaster completed remote builds in B33117: Diff 46458.Dec 16 2024, 3:44 AM
ashoat accepted this revision.Dec 16 2024, 6:10 AM
ashoat added inline comments.
native/account/qr-auth/qr-code-scanner-left-button.react.js
10–12 ↗(On Diff #46458)

It's a little weird that we're passing all of these props in but only using one. Should we just have a single prop instead? In that case we could potentially reuse this component, such as in CameraModal

25–31 ↗(On Diff #46458)

In CameraModal we actually use the text ×, not the text x. I'm okay with the icon instead, but I think either option is fine

This revision is now accepted and ready to land.Dec 16 2024, 6:10 AM
kamil added a child revision: D14161: [native] update `PrimaryButton` to handle light theme.Dec 17 2024, 2:41 AM
kamil updated this revision to Diff 46542.Dec 17 2024, 6:26 AM

address review

kamil added inline comments.Dec 17 2024, 6:32 AM
native/navigation/header-close-left-button.react.js
10–32 ↗(On Diff #46542)

This component is implemented like this because it is prepared to be used in CameraModal too (here).

I was struggling to make it work with and without forwardRef so for now I am creating a follow-up task to address this later and to not block the signed device list workstream: ENG-10029.

kamil added inline comments.Dec 17 2024, 6:33 AM
native/navigation/header-close-left-button.react.js
11 ↗(On Diff #46542)

This has to be optional because this is how it is defined in StackHeaderLeftButtonProps

Harbormaster failed remote builds in B33163: Diff 46542!Dec 17 2024, 6:46 AM
Harbormaster completed remote builds in B33163: Diff 46542.Dec 17 2024, 7:02 AM
Closed by commit rCOMM7c658ac97e62: [native] replace back button with close button on the scanning QR code screen (authored by kamil). · Explain WhyDec 17 2024, 7:06 AM
This revision was automatically updated to reflect the committed changes.
kamil added a commit: rCOMM7c658ac97e62: [native] replace back button with close button on the scanning QR code screen.

Revision Contents
Changeset List

PathSize
native/
account/
qr-auth/
11 lines
navigation/
34 lines

Diff 46554

View Options

native/account/qr-auth/qr-auth-navigator.react.js

Show First 20 Lines • Show All 174 Lines • ▼ Show 20 Lines
export const ThreadSettingsNotificationsRouteName = export const ThreadSettingsNotificationsRouteName =
'ThreadSettingsNotifications'; 'ThreadSettingsNotifications';
export const IntroTipRouteName = 'IntroTip'; export const IntroTipRouteName = 'IntroTip';
export const CommunityDrawerTipRouteName = 'CommunityDrawerTip'; export const CommunityDrawerTipRouteName = 'CommunityDrawerTip';
export const HomeTabTipRouteName = 'HomeTabTip'; export const HomeTabTipRouteName = 'HomeTabTip';
export const MutedTabTipRouteName = 'MutedTabTip'; export const MutedTabTipRouteName = 'MutedTabTip';
export const NUXTipOverlayBackdropRouteName = 'NUXTipOverlayBackdrop'; export const NUXTipOverlayBackdropRouteName = 'NUXTipOverlayBackdrop';
export const QRAuthNavigatorRouteName = 'QRAuthNavigator'; export const QRAuthNavigatorRouteName = 'QRAuthNavigator';
export const QRAuthNotPrimaryDeviceRouteName = 'QRAuthNotPrimaryDevice';
export type RootParamList = { export type RootParamList = {
+LoggedOutModal: void, +LoggedOutModal: void,
+App: void, +App: void,
+ThreadPickerModal: ThreadPickerModalParams, +ThreadPickerModal: ThreadPickerModalParams,
+AddUsersModal: AddUsersModalParams, +AddUsersModal: AddUsersModalParams,
+CustomServerModal: CustomServerModalParams, +CustomServerModal: CustomServerModalParams,
+ColorSelectorModal: ColorSelectorModalParams, +ColorSelectorModal: ColorSelectorModalParams,
▲ Show 20 Lines • Show All 158 Lines • ▼ Show 20 Lines
export type UserProfileBottomSheetParamList = { export type UserProfileBottomSheetParamList = {
+UserProfileBottomSheet: UserProfileBottomSheetParams, +UserProfileBottomSheet: UserProfileBottomSheetParams,
+UserProfileAvatarModal: UserProfileAvatarModalParams, +UserProfileAvatarModal: UserProfileAvatarModalParams,
+UserRelationshipTooltipModal: UserRelationshipTooltipModalParams, +UserRelationshipTooltipModal: UserRelationshipTooltipModalParams,
}; };
export type QRAuthNavigatorParamList = { export type QRAuthNavigatorParamList = {
+SecondaryDeviceQRCodeScanner: void, +SecondaryDeviceQRCodeScanner: void,
+QRAuthNotPrimaryDevice: void,
}; };
export type ScreenParamList = { export type ScreenParamList = {
...RootParamList, ...RootParamList,
...OverlayParamList, ...OverlayParamList,
...TabParamList, ...TabParamList,
...ChatParamList, ...ChatParamList,
...ChatTopTabsParamList, ...ChatTopTabsParamList,
▲ Show 20 Lines • Show All 50 Lines • Show Last 20 Lines
View Options

native/navigation/header-close-left-button.react.js

Show First 20 Lines • Show All 174 Lines • ▼ Show 20 Lines
export const ThreadSettingsNotificationsRouteName = export const ThreadSettingsNotificationsRouteName =
'ThreadSettingsNotifications'; 'ThreadSettingsNotifications';
export const IntroTipRouteName = 'IntroTip'; export const IntroTipRouteName = 'IntroTip';
export const CommunityDrawerTipRouteName = 'CommunityDrawerTip'; export const CommunityDrawerTipRouteName = 'CommunityDrawerTip';
export const HomeTabTipRouteName = 'HomeTabTip'; export const HomeTabTipRouteName = 'HomeTabTip';
export const MutedTabTipRouteName = 'MutedTabTip'; export const MutedTabTipRouteName = 'MutedTabTip';
export const NUXTipOverlayBackdropRouteName = 'NUXTipOverlayBackdrop'; export const NUXTipOverlayBackdropRouteName = 'NUXTipOverlayBackdrop';
export const QRAuthNavigatorRouteName = 'QRAuthNavigator'; export const QRAuthNavigatorRouteName = 'QRAuthNavigator';
export const QRAuthNotPrimaryDeviceRouteName = 'QRAuthNotPrimaryDevice';
export type RootParamList = { export type RootParamList = {
+LoggedOutModal: void, +LoggedOutModal: void,
+App: void, +App: void,
+ThreadPickerModal: ThreadPickerModalParams, +ThreadPickerModal: ThreadPickerModalParams,
+AddUsersModal: AddUsersModalParams, +AddUsersModal: AddUsersModalParams,
+CustomServerModal: CustomServerModalParams, +CustomServerModal: CustomServerModalParams,
+ColorSelectorModal: ColorSelectorModalParams, +ColorSelectorModal: ColorSelectorModalParams,
▲ Show 20 Lines • Show All 158 Lines • ▼ Show 20 Lines
export type UserProfileBottomSheetParamList = { export type UserProfileBottomSheetParamList = {
+UserProfileBottomSheet: UserProfileBottomSheetParams, +UserProfileBottomSheet: UserProfileBottomSheetParams,
+UserProfileAvatarModal: UserProfileAvatarModalParams, +UserProfileAvatarModal: UserProfileAvatarModalParams,
+UserRelationshipTooltipModal: UserRelationshipTooltipModalParams, +UserRelationshipTooltipModal: UserRelationshipTooltipModalParams,
}; };
export type QRAuthNavigatorParamList = { export type QRAuthNavigatorParamList = {
+SecondaryDeviceQRCodeScanner: void, +SecondaryDeviceQRCodeScanner: void,
+QRAuthNotPrimaryDevice: void,
}; };
export type ScreenParamList = { export type ScreenParamList = {
...RootParamList, ...RootParamList,
...OverlayParamList, ...OverlayParamList,
...TabParamList, ...TabParamList,
...ChatParamList, ...ChatParamList,
...ChatTopTabsParamList, ...ChatTopTabsParamList,
▲ Show 20 Lines • Show All 50 Lines • Show Last 20 Lines