Skip to content

Commit b2e4432

Browse files
Merge pull request #673 from mozilla-iam/SE-3121-error-messaging
feature(onboarding): Add error messaging
2 parents 410a0cd + 3d8c352 commit b2e4432

4 files changed

Lines changed: 35 additions & 4 deletions

File tree

src/assets/js/scope.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ class Scope {
2424
this.isLoggedIn = Boolean(username || user?.loggedIn);
2525
this.firstTime =
2626
this.isLoggedIn && (username === '' || username.startsWith('r--'));
27-
this.isReady = Boolean(username);
27+
this.isReady = Boolean(username || user?.profileError);
2828
this.isStaff = isStaff;
2929
this.isNdaed =
3030
'nda' in (mozilliansorgGroups || {}) ||
@@ -34,6 +34,7 @@ class Scope {
3434
this.isGroupCreator =
3535
'group_creators' in (mozilliansorgGroups || {}) ||
3636
'group_admins' in (mozilliansorgGroups || {});
37+
this.profileError = user?.profileError
3738
}
3839

3940
hasTrust(trust) {

src/components/guide/OnboardingModal.vue

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,26 @@
2828
<p v-else>
2929
<Fluent :id="`onboarding_modal_username`" attr="paragraph_2" />
3030
</p>
31-
<section v-if="scope.isReady" class="onboarding-modal__username">
31+
<section v-if="scope.profileError" class="onboarding-modal__profile_error">
32+
<p>
33+
<Fluent :id="`onboarding_modal_profile_error`"
34+
attr="profile_error"
35+
:tags="{
36+
iam_slack: {
37+
tag: 'a',
38+
target: '_blank',
39+
href: 'https://mozilla.slack.com/archives/CBT3XRZKP',
40+
},
41+
support_email: {
42+
tag: 'a',
43+
target: '_blank',
44+
href: 'mailto:people-mozilla-org-support@mozilla.com',
45+
}
46+
}"
47+
/>
48+
</p>
49+
</section>
50+
<section v-if="scope.isReady && !scope.profileError" class="onboarding-modal__username">
3251
<label for="field-username">{{ fluent('profile_username') }}</label>
3352
<TextInput
3453
class="username__input"
@@ -337,4 +356,9 @@ export default {
337356
align-items: center;
338357
flex-direction: row;
339358
}
359+
360+
.onboarding-modal__profile_error {
361+
font-weight: bold;
362+
color: red;
363+
}
340364
</style>

src/locales/en-US/strings.ftl

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,9 @@ onboarding_modal_username = Getting started
108108
.username_space = Username must not contain spaces
109109
.username_chars = Username must only contain latin characters a-z or digits 0-9
110110
111+
onboarding_modal_profile_error =
112+
.profile_error = Error in creating profile. Please reach out in <a data-l10n-name="iam_slack">#iam</a> Slack or at <a data-l10n-name="support_email">people-mozilla-org-support@mozilla.com</a>
113+
111114
tooltip_tour = Welcome
112115
.skip = Skip tour
113116
.step1_1 = Find Mozillians (staff and volunteers) based on their chosen visibility settings.

src/store/index.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import scope from './scope.store';
99
import features from './features.store';
1010

1111
let shouldFetch = true;
12+
let userFound = false;
1213

1314
async function fetchUser(commit) {
1415
if (shouldFetch === false){
@@ -21,6 +22,7 @@ async function fetchUser(commit) {
2122
variables: { username: null },
2223
fetchPolicy,
2324
});
25+
userFound = true;
2426
commit('setUser', data.profile);
2527
return true;
2628
} catch (e) {
@@ -45,6 +47,8 @@ async function fetchUser(commit) {
4547
async function retryFetchUser(commit, retries = 120) {
4648
if (!(await fetchUser(commit)) && retries > 0) {
4749
setTimeout(() => retryFetchUser(commit, retries - 1), 1000);
50+
} else if (!userFound) {
51+
commit('setUser', {profileError: true});
4852
}
4953
}
5054

@@ -64,7 +68,6 @@ export default new Vuex.Store({
6468
onboarding: new Onboarding(),
6569
},
6670
actions: {
67-
// TODO: Create error handling for this action
6871
async fetchUser({ commit }) {
6972
await retryFetchUser(commit);
7073
},
@@ -113,4 +116,4 @@ export async function resolvePromisesSerially(promises, resolvers) {
113116
console.error(e.message);
114117
throw new Error(e.message);
115118
}
116-
}
119+
}

0 commit comments

Comments
 (0)