diff --git a/src/l10n.json b/src/l10n.json
index 3a6403519..0c66069e4 100644
--- a/src/l10n.json
+++ b/src/l10n.json
@@ -473,8 +473,11 @@
"renameAccount.rememberToFollow": "When creating a username, please remember to follow the {communityGuidelinesLink}",
"renameAccount.CommunityGuidelines": "Community Guidelines",
"renameAccount.changeYourUsername": "Change your Username",
+ "renameAccount.changeYourUsernameSuccess": "Your username has successfully been changed!",
"renameAccount.makeSure": "Make sure the username you chose is aligned with {communityGuidelinesLink}",
+ "renameAccount.welcomeBack": "You're now allowed to use Scratch again, welcome back!",
"renameAccount.scratchsCommunityGuidelines": "Scratch's Community Guidelines",
"renameAccount.change": "Change",
+ "renameAccount.goToProfile": "Go to your profile",
"renameAccount.pastNotifications": "Here are your past admin notifications"
}
diff --git a/src/views/bad-username-splash/bad-username-splash.jsx b/src/views/bad-username-splash/bad-username-splash.jsx
index 4c5e2e40e..7acd3572b 100644
--- a/src/views/bad-username-splash/bad-username-splash.jsx
+++ b/src/views/bad-username-splash/bad-username-splash.jsx
@@ -25,16 +25,18 @@ const validateNewUsernameForm = values => {
return errors;
};
-const PIIUsernameMessage = 'username appears to contain personal information';
-const BadUsernameMessage = 'an inappropriate username';
+// PII bans won't include the old username
+const PIIUsernameMessage = 'New username: ';
+const BadUsernameMessage = 'Old username: ';
const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
const [unauthorizedError, setUnauthorizedError] = React.useState(false);
const [badUsernameError, setBadUsernameError] = React.useState(false);
const [apiError, setAPIError] = React.useState(false);
+ const [usernameChangeSuccess, setUsernameChangeSuccess] = React.useState(false);
- const latestAdminMessage = adminMessages && adminMessages[0] && adminMessages[0].message;
+ const latestAdminMessage = adminMessages && adminMessages.find(message => message.message.includes('New username: '));
React.useEffect(() => {
if (user && user.username && user.token){
@@ -66,7 +68,7 @@ const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
} else if (res.body.error){
setAPIError('error message for API error');
} else {
- window.location = '/';
+ setUsernameChangeSuccess(true);
}
});
};
@@ -92,14 +94,7 @@ const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
- {latestAdminMessage && latestAdminMessage.includes(PIIUsernameMessage) &&
- ()
- }
- {latestAdminMessage && latestAdminMessage.includes(BadUsernameMessage) &&
+ {latestAdminMessage && latestAdminMessage.message.includes(BadUsernameMessage) ?
(
@@ -116,6 +111,10 @@ const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
)
}}
/>
+
) : ()
}
@@ -135,6 +134,7 @@ const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
/* eslint-disable react/jsx-no-bind */
onSubmit={handleUpdateUsernameUnbanSubmit}
>
+
{({
errors,
handleSubmit,
@@ -142,11 +142,15 @@ const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
setFieldError,
setFieldTouched,
setFieldValue,
- validateForm
+ validateForm,
+ values
}) => (
@@ -157,73 +161,81 @@ const BannedSplash = ({hasSession, user, adminMessages, getAdminMessages}) => {
/>}
innerClassName="change-username-inner"
outerClassName="change-username-outer"
- title={}
+ title={}
waiting={isSubmitting}
- onSubmit={handleSubmit}
- nextButton={}
+ onSubmit={!usernameChangeSuccess ? () => {
+ window.location = `${window.location.origin}/users/${values.newUsername}`;
+ } : handleSubmit}
+ nextButton={ }
>
-
- Create a new username
- {
- setFieldValue('newUsername', e.target.value.substring(0, 30));
- setFieldValue('canValidate', false);
- setFieldTouched('newUsername');
- setFieldError('newUsername', null);
- }}
- />
- {
- setFieldValue('newUsernameConfirm', e.target.value.substring(0, 30));
- setFieldTouched('newUsernameConfirm');
- setFieldError('newUsernameConfirm', null);
- setFieldValue('canValidate', false);
- }}
- onBlur={() => {
- setFieldValue('canValidate', true).then(validateForm());
- }}
- />
- Password
- {
- setFieldValue('password', e.target.value);
- setFieldTouched('password');
- setFieldError('password', null);
- }}
- />
-
+ {usernameChangeSuccess ?
+ () :
+ (
+ Create a new username
+ {
+ setFieldValue('newUsername', e.target.value.substring(0, 30));
+ setFieldValue('canValidate', false);
+ setFieldTouched('newUsername');
+ setFieldError('newUsername', null);
+ }}
+ />
+ {
+ setFieldValue('newUsernameConfirm', e.target.value.substring(0, 30));
+ setFieldTouched('newUsernameConfirm');
+ setFieldError('newUsernameConfirm', null);
+ setFieldValue('canValidate', false);
+ }}
+ onBlur={() => {
+ setFieldValue('canValidate', true).then(validateForm());
+ }}
+ />
+ Password
+ {
+ setFieldValue('password', e.target.value);
+ setFieldTouched('password');
+ setFieldError('password', null);
+ }}
+ />
+
)}
)}