1 files changed, 9 insertions, 5 deletions
diff --git a/packages/demobank-ui/src/pages/RegistrationPage.tsx b/packages/demobank-ui/src/pages/RegistrationPage.tsx
index 931a9b700..cbf5758aa 100644
--- a/packages/demobank-ui/src/pages/RegistrationPage.tsx
+++ b/packages/demobank-ui/src/pages/RegistrationPage.tsx
@@ -218,7 +218,7 @@ function RegistrationForm({
       ? "123"
       : getRandomPassword();
     const username = `_${user.first}-${user.second}_`;
-    const name = `${user.first}, ${user.second}`;
+    const name = `${capitalizeFirstLetter(user.first)} ${capitalizeFirstLetter(user.second)}`;
     await doRegistrationAndLogin(name, username, password, () => {
       onRegistrationSuccesful(username, password);
     });
@@ -248,7 +248,7 @@ function RegistrationForm({
                 for="username"
                 class="block text-sm font-medium leading-6 text-gray-900"
               >
-                <i18n.Translate>Username</i18n.Translate>
+                <i18n.Translate>Login username</i18n.Translate>
                 <b style={{ color: "red" }}> *</b>
               </label>
               <div class="mt-2">
@@ -260,7 +260,7 @@ function RegistrationForm({
                   class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
                   value={username ?? ""}
                   enterkeyhint="next"
-                  placeholder="identification"
+                  placeholder="account identification to login"
                   autocomplete="username"
                   required
                   onInput={(e): void => {
@@ -344,7 +344,7 @@ function RegistrationForm({
                   for="name"
                   class="block text-sm font-medium leading-6 text-gray-900"
                 >
-                  <i18n.Translate>Name</i18n.Translate>
+                  <i18n.Translate>Full name</i18n.Translate>
                   <b style={{ color: "red" }}> *</b>
                 </label>
               </div>
@@ -357,7 +357,7 @@ function RegistrationForm({
                   class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
                   value={name ?? ""}
                   enterkeyhint="next"
-                  placeholder="your name"
+                  placeholder="John Doe"
                   autocomplete="name"
                   required
                   onInput={(e): void => {
@@ -463,3 +463,7 @@ function RegistrationForm({
     </Fragment>
   );
 }
+
+function capitalizeFirstLetter(str: string) {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}