[FTUE] - Email input and verification #5868

ouchadam · 2022-04-28T15:07:25Z

Type of change

WIP Feature
Bugfix
Technical
Other :

Content

Introduces new dedicated email entry and waiting for verification fragments to the FTUE onboarding flow.

Lifts the 401 verification polling error handling logic out of the fragment and into the RegisterActionHandler, adds tests around the polling.
A loading spinner is shown only when returning to the verification fragment rather than on the initial navigation
A dedicated resend email button has been added

Motivation and context

Fixes #5278

Screenshots / GIFs

Flow

Phones

INPUT	INPUT WITH CONTENT	WAITING	WAITING RETURN TO SCREEN

Small Phone

INPUT	WAITING

Tablet

INPUT	WAITING

Tests

Enable the combined register feature flag
Create an account of matrix.org
Notice the new email verification screens

Tested devices

Physical
Emulator
OS version(s): 28, 29, 31

ouchadam · 2022-04-28T15:10:32Z

vector/src/main/java/im/vector/app/features/onboarding/RegistrationActionHandler.kt

+                onSuccess = { it.toRegistrationResult() },
+                onFailure = {
+                    when {
+                        action.threePid is RegisterThreePid.Email && it.is401() -> RegistrationResult.SendEmailSuccess(action.threePid.email)


the 401 == successful pid sent logic is no longer handled at the UI/fragment layer but instead at our business logic layer

This logic feels like something that should be part of the SDK

ouchadam · 2022-04-28T15:11:32Z

vector/src/main/java/im/vector/app/features/onboarding/RegistrationActionHandler.kt

+        )
+    }
+
+    private tailrec suspend fun handleCheckIfEmailIsValidated(registrationWizard: RegistrationWizard, delayMillis: Long): RegistrationResult {


uses tailrec to provide recursion with the safety of avoiding stackoverflows, the kotlin compiler will optimise this to an imperative loop

ouchadam · 2022-04-28T15:12:46Z

vector/src/main/java/im/vector/app/features/onboarding/RegistrationActionHandler.kt

+                        else       -> RegistrationResult.Error(it)
+                    }
+                }
+        ) ?: handleCheckIfEmailIsValidated(registrationWizard, 10_000)


previously we were providing the verification polling through the entire fragment -> viewmodel -> sdk stack, now it only happens here, the start/stop api remains the same

github-actions · 2022-04-28T15:26:30Z

Unit Test Results

124 files ±  0 124 suites ±0 2m 1s ⏱️ -9s
220 tests +  3 220 ✔️ +  3 0 💤 ±0 0 ❌ ±0
726 runs +12 726 ✔️ +12 0 💤 ±0 0 ❌ ±0

Results for commit c71f9c8. ± Comparison against base commit 4094a66.

♻️ This comment has been updated with latest results.

ganfra

Some minor remarks, otherwise good work!

ganfra · 2022-05-04T09:14:25Z

vector/src/main/java/im/vector/app/features/onboarding/RegistrationActionHandler.kt

 import javax.inject.Inject
+import org.matrix.android.sdk.api.auth.registration.RegistrationResult as SdkRegistrationResult


Maybe rename SdkRegistrationResult by MatrixRegistrationResult?

will do 👍

ganfra · 2022-05-04T09:16:30Z

vector/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthEmailEntryFragment.kt

+                    views.emailEntryInput.error = null
+                    views.emailEntrySubmit.isEnabled = it.isEmail()
+                }
+                .launchIn(lifecycleScope)


It's safer to use viewLifecycleOwner.lifecycleScope

great catch, will do 👍

b2e3dd1 updated other usages as well

ganfra · 2022-05-04T09:17:29Z

vector/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthWaitForEmailFragment.kt

        viewModel.handle(OnboardingAction.PostRegisterAction(RegisterAction.CheckIfEmailHasBeenValidated(0)))
    }

+    private fun showLoadingIfReturningToScreen() {
+        when (inferHasLeftAndReturnedToScreen) {
+            true  -> views.emailVerificationWaiting.isVisible = true


Why are we not always showing the loader by the way?

the idea was to avoid the impression that app was busy/loading when we're waiting for the user to click the link in the email verification

the middle ground was to show the spinner if we detect the user has left and returned to app as we're inferring that they've clicked the link and the app is now waiting for the homeserver to respond

I agree, this is a great UX improvement, thanks!

bmarty

Great work!
Some remarks on the form.
Also, out of interest, how will be managed the case where a homeserver requires either an email or a phone number to let the user create an account?
Not sure if covered by the previous question, but is the optional email case correctly handled?

vector/src/main/res/layout/fragment_ftue_wait_for_email_verification.xml

bmarty · 2022-05-12T13:28:57Z

vector/src/main/java/im/vector/app/core/di/FragmentModule.kt

+    @Binds
+    @IntoMap
+    @FragmentKey(FtueAuthEmailEntryFragment::class)
+    fun bindFtueAuthEmailEntryFragment(fragment: FtueAuthEmailEntryFragment): Fragment


Maybe one day #5420 will be implemented...

vector/src/main/java/im/vector/app/core/extensions/TextInputLayout.kt

vector/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthWaitForEmailFragment.kt

bmarty · 2022-05-12T13:53:48Z

vector/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthWaitForEmailFragment.kt

        viewModel.handle(OnboardingAction.PostRegisterAction(RegisterAction.CheckIfEmailHasBeenValidated(0)))
    }

+    private fun showLoadingIfReturningToScreen() {
+        when (inferHasLeftAndReturnedToScreen) {
+            true  -> views.emailVerificationWaiting.isVisible = true


I agree, this is a great UX improvement, thanks!

bmarty · 2022-05-12T13:54:22Z

vector/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthWaitForEmailFragment.kt

-            super.onError(throwable)
-        }
-    }
-


Thanks for moving this out of the View!

bmarty · 2022-05-12T13:59:02Z

vector/src/main/res/layout/fragment_ftue_wait_for_email_verification.xml

+        app:layout_constraintBottom_toTopOf="@id/emailVerificationSpace5"
+        app:layout_constraintEnd_toEndOf="@id/ftueAuthGutterEnd"
+        app:layout_constraintStart_toStartOf="@id/ftueAuthGutterStart"
+        app:layout_constraintTop_toBottomOf="@id/emailVerificationFooter" />


Maybe show this Button and the TextView above with the same strategy than the loader, i.e. when we detect that the user is coming back after checking their email? Or after a delay of, let's say, 30s?

will delegate this to @daniellekirkwood

I would be weary of hiding the button based on them leaving and returning as some users may use a different device to verify the email

vector/src/main/res/layout/fragment_ftue_wait_for_email_verification.xml

ouchadam · 2022-05-13T08:28:37Z

Great work! Some remarks on the form. Also, out of interest, how will be managed the case where a homeserver requires either an email or a phone number to let the user create an account? Not sure if covered by the previous question, but is the optional email case correctly handled?

I might be missing something, this PR is for the homeserver requiring an email, or is it possible to require email without also verifying it?

The phone number input case will be handled by another ticket #6043

Optional email wasn't something we were aware of, will raise with product

…ing screen

…lick logic for resending verification emails

…ying to the waiting for verification title

…tching designs - renames drawable which redirects to the attribute colorBackground

…e email entry step - matching legacy flow

…consumed

- fixes crash where the scheduled callbacks can attempt to trigger after the view has been destroyed

…fication

…it to be cancelled when resetting the auth flow - extracts an auto cancelling job delegate

bmarty

LGTM (did not make a full review)

github-actions · 2022-05-23T10:50:48Z

Matrix SDK

Integration Tests Results:

[org.matrix.android.sdk.session]
= passed=20 failures=0 errors=0 skipped=3
[org.matrix.android.sdk.account]
= passed=3 failures=0 errors=0 skipped=2
[org.matrix.android.sdk.internal]
= passed=28 failures=0 errors=0 skipped=0
[org.matrix.android.sdk.ordering]
= passed=16 failures=0 errors=0 skipped=0
[org.matrix.android.sdk.PermalinkParserTest]
= passed=2 failures=0 errors=0 skipped=0

ouchadam added the Z-FTUE Issue is relevant to the first time use project or experience label Apr 28, 2022

ouchadam commented Apr 28, 2022

View reviewed changes

ouchadam force-pushed the feature/adm/ftue-email-verification branch from 985178a to 4c114e4 Compare April 28, 2022 15:27

ouchadam changed the title ~~FTUE - Email input and verification~~ [FTUE] - Email input and verification Apr 28, 2022

ouchadam added the PR-Large PR with more than 500 updated lines label Apr 28, 2022

Boogieman2022 approved these changes Apr 28, 2022

View reviewed changes

ouchadam force-pushed the feature/adm/ftue-email-verification branch from b9ff015 to 1a68211 Compare April 28, 2022 16:19

ouchadam requested review from a team and jmartinesp and removed request for a team April 29, 2022 07:55

ouchadam marked this pull request as ready for review April 29, 2022 08:12

ouchadam requested review from a team, bmarty and ganfra and removed request for a team and jmartinesp April 29, 2022 08:16

ganfra approved these changes May 4, 2022

View reviewed changes

ouchadam force-pushed the feature/adm/ftue-email-verification branch from d037dde to 0c556a2 Compare May 5, 2022 13:02

ouchadam added the X-Needs-Design May require input from the design team label May 5, 2022

ouchadam requested a review from amshakal May 5, 2022 13:53

ouchadam force-pushed the feature/adm/ftue-email-verification branch from 6ae54a5 to e56a459 Compare May 9, 2022 08:36

ouchadam mentioned this pull request May 9, 2022

FTUE - Sign in #5995

Merged

6 tasks

bmarty requested changes May 12, 2022

View reviewed changes

ouchadam requested a review from bmarty May 18, 2022 14:29

ouchadam force-pushed the feature/adm/ftue-email-verification branch from 0422b74 to 65832ef Compare May 19, 2022 09:50

ouchadam mentioned this pull request May 19, 2022

FTUE - Stage selection and Registration action testing #6091

Merged

6 tasks

ouchadam added 23 commits May 20, 2022 12:11

adding UI for updated email verification waiting screen

02b6916

showing loading spinner when returning to the email verification wait…

4964c9f

…ing screen

renaming xml ids to the email verification domain and attaching the c…

817d692

…lick logic for resending verification emails

extracting reusable logic for styling terminating full stops and appl…

eb4d31e

…ying to the waiting for verification title

adding gradient background to the waiting for verification screen, ma…

8a53eaf

…tching designs - renames drawable which redirects to the attribute colorBackground

removing copied back behaviour, isn't needed for the email entry screen

9cc6467

resetting authentication state when the viewmodel resets whilst in th…

350643c

…e email entry step - matching legacy flow

removing extra end of file lines

8e7ae5e

adding changelog entry

735adf0

updating ignored result register action as the one being used is now …

c0efd9f

…consumed

making use of the view lifecycle scope for the view based fragment logic

8136f57

renaming sdk model to matrix

a4b5d18

aligning the carousel listener removal with the viewLifecycleOwner

c4834a4

- fixes crash where the scheduled callbacks can attempt to trigger after the view has been destroyed

adding listener suffix for consistency

c414f80

reusing editText unboxing extension

80b6b77

removing this usage for project consistency

641c06f

removing unneeded state reacting when entering email address for veri…

4dc8d23

…fication

inlining single use extension function

0979d56

adding gradient background to xml preview

bc5ebb2

avoiding cancelling the polling job when resending verification email

47635aa

using direct string reference for design preview

9fddd09

removing unused imports

4bcdaa3

adding missing punctuation

2378643

ouchadam force-pushed the feature/adm/ftue-email-verification branch from 65832ef to 98a421a Compare May 20, 2022 11:29

provides a dedicated job for the email verification polling to allow …

c71f9c8

…it to be cancelled when resetting the auth flow - extracts an auto cancelling job delegate

ouchadam force-pushed the feature/adm/ftue-email-verification branch from 98a421a to c71f9c8 Compare May 20, 2022 12:10

bmarty approved these changes May 20, 2022

View reviewed changes

ouchadam merged commit 98999c7 into develop May 23, 2022

ouchadam deleted the feature/adm/ftue-email-verification branch May 23, 2022 10:14

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[FTUE] - Email input and verification #5868

[FTUE] - Email input and verification #5868

ouchadam commented Apr 28, 2022

ouchadam Apr 28, 2022

bmarty May 12, 2022

ouchadam Apr 28, 2022

ouchadam Apr 28, 2022 •

edited

github-actions bot commented Apr 28, 2022 •

edited

ganfra left a comment

ganfra May 4, 2022

ouchadam May 5, 2022

ouchadam May 5, 2022

ganfra May 4, 2022

ouchadam May 5, 2022

ouchadam May 5, 2022

ganfra May 4, 2022

ouchadam May 5, 2022 •

edited

bmarty May 12, 2022

bmarty left a comment

bmarty May 12, 2022

bmarty May 12, 2022

bmarty May 12, 2022

bmarty May 12, 2022

ouchadam May 12, 2022

ouchadam commented May 13, 2022

bmarty left a comment

github-actions bot commented May 23, 2022

		import javax.inject.Inject
		import org.matrix.android.sdk.api.auth.registration.RegistrationResult as SdkRegistrationResult

[FTUE] - Email input and verification #5868

[FTUE] - Email input and verification #5868

Conversation

ouchadam commented Apr 28, 2022

Type of change

Content

Motivation and context

Screenshots / GIFs

Flow

Phones

Small Phone

Tablet

Tests

Tested devices

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ouchadam Apr 28, 2022 • edited

Choose a reason for hiding this comment

github-actions bot commented Apr 28, 2022 • edited

Unit Test Results

ganfra left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ouchadam May 5, 2022 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bmarty left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ouchadam commented May 13, 2022

bmarty left a comment

Choose a reason for hiding this comment

github-actions bot commented May 23, 2022

Matrix SDK

Integration Tests Results:

ouchadam Apr 28, 2022 •

edited

github-actions bot commented Apr 28, 2022 •

edited

ouchadam May 5, 2022 •

edited