chore: add username on register + beautify edit profile page

apps/backend/openApi.json

@@ -283,16 +283,6 @@
               }
             }
           },
-          "401": {
-            "description": "Could not validate and verify the provided JWT token",
-            "content": {
-              "application/json": {
-                "schema": {
-                  "$ref": "#/components/schemas/UnauthorizedException"
-                }
-              }
-            }
-          },
           "500": {
             "description": "Internal server error.",
             "content": {
@@ -304,8 +294,7 @@
             }
           }
         },
-        "tags": ["Auth"],
-        "security": [{ "bearer": [] }]
+        "tags": ["Auth"]
       }
     },
     "/auth/refresh": {
@@ -761,12 +750,12 @@
           "createdAt": {
             "type": "string",
             "description": "Post created at",
-            "example": "Fri May 10 2024 14:19:53 GMT+0200 (Central European Summer Time)"
+            "example": "Fri May 17 2024 16:33:54 GMT+0200 (Central European Summer Time)"
           },
           "updatedAt": {
             "type": "string",
             "description": "Post updated at",
-            "example": "Fri May 10 2024 14:19:53 GMT+0200 (Central European Summer Time)"
+            "example": "Fri May 17 2024 16:33:54 GMT+0200 (Central European Summer Time)"
           }
         },
         "required": [

apps/backend/src/modules/post/dto/post.dto.ts

@@ -41,13 +41,15 @@ export class PostDto implements Post {
 
   @ApiProperty({
     description: 'Post created at',
-    example: new Date().toString(),
+    example:
+      'Fri May 17 2024 16:33:54 GMT+0200 (Central European Summer Time)',
   })
   createdAt: string;
 
   @ApiProperty({
     description: 'Post updated at',
-    example: new Date().toString(),
+    example:
+      'Fri May 17 2024 16:33:54 GMT+0200 (Central European Summer Time)',
   })
   updatedAt: string;
 }

apps/frontend/src/app/profile/[username]/edit/page.tsx

@@ -34,7 +34,7 @@ const VisuallyHiddenInput = styled('input')({
 });
 const EditProfileGrid2Box = styled(Grid2)({
   width: '100%',
-  backgroundColor: '#455572',
+  backgroundColor: '#45557211',
   borderRadius: '8px',
 });
 const EditProfileTitle = ({
@@ -63,7 +63,7 @@ export default function EditProfile({
   };
 
   return (
-    <Container>
+    <Container sx={{ paddingY: 3 }}>
       <Box
         display="flex"
         alignItems="center"

apps/frontend/src/shared/components/header/desktop-toolbar/account-button.component.tsx

@@ -47,7 +47,7 @@ export function AccountButton() {
   const name = userInfo?.family_name ?? 'Family';
   const email = userInfo?.email ?? '[email protected]';
   // TODO: https://github.com/FusionAuth/fusionauth-javascript-sdk/issues/94
-  const username = 'userInfo?.preferred_username';
+  const username = userInfo?.preferred_username;
   // TODO: fetch countdown data in quests collection!
   const handleComplete = () => {
     console.log('');
@@ -96,6 +96,7 @@ export function AccountButton() {
                       component={Link}
                       href={`/profile/${username}/edit`}
                       underline="none"
+                      onClick={closeModal}
                     >
                       Edit
                     </MuiLink>

deployment/fusionauth/main.tf

@@ -260,7 +260,7 @@ data "httpclient_request" "set-default-tenant-theme" {
 resource "fusionauth_user" "you-say-admin-user" {
   tenant_id  = fusionauth_tenant.you-say-tenant.id
   email      = "[email protected]"
-  username   = "admin@you-say.com"
+  username   = "admin"
   first_name = "Admin"
   last_name  = "Admin"
   password   = "adminadmin"
@@ -275,7 +275,7 @@ resource "fusionauth_registration" "you-say-admin-registration" {
 resource "fusionauth_user" "you-say-temp-user" {
   tenant_id                = fusionauth_tenant.you-say-tenant.id
   email                    = "[email protected]"
-  username                 = "[email protected]"
+  username                 = "souma_kazuya"
   first_name               = "Souma"
   last_name                = "Kazuya"
   password                 = "souma.kazuya"
@@ -305,7 +305,7 @@ data "httpclient_request" "create-super-admin-user" {
       "skipVerification" : true,
       "registration" : {
         "roles" : ["admin"],
-        "username" : "admin@admin.com"
+        "username" : "admin"
         "applicationId" : "${local.fusionauth_default_application_id}",
       }
       "user" : {

libs/backend/auth/src/lib/services/fusionauth-client-helper.service.spec.ts

@@ -367,6 +367,7 @@ describe('FusionAuthClientHelper', () => {
               firstName: registerArgs.firstName,
               password: registerArgs.password,
               fullName: `${registerArgs.firstName} ${registerArgs.lastName}`,
+              username: Sinon.match.string,
               data: {},
             },
           }),

libs/backend/auth/src/lib/services/fusionauth-client-helper.service.ts

@@ -142,6 +142,10 @@ export class FusionAuthClientHelper implements OnModuleInit {
     applicationId,
   }: Register): Promise<string> | never {
     const memberships = this.getMemberships(groups);
+    const username = email
+      .substring(0, email.indexOf('@'))
+      .replace(/[!#$%&'*+-/=?^_`{|}~]/g, '_')
+      .trim();
 
     try {
       // Passing an empty string as userId signifies that FusionAuth should create it automatically.
@@ -158,6 +162,7 @@ export class FusionAuthClientHelper implements OnModuleInit {
           memberships,
           ...(password ? { password } : {}),
           fullName: `${firstName} ${lastName}`,
+          username,
           data: {
             // Here we can save meta data, or settings and other info
           },