LIME-69: Add Profile Settings

backend/src/bundles/users/enums/enums.ts

@@ -1,3 +1,4 @@
 export { UserAttributes } from './user-attributes.enum.js';
 export { UserDetailsAttributes } from './user-details-attributes.enum.js';
 export { Gender, UsersApiPath } from 'shared';
+export { AuthApiPath, UserValidationMessage } from 'shared';

backend/src/bundles/users/types/types.ts

@@ -2,5 +2,6 @@ export {
     type UserAuthRequestDto,
     type UserAuthResponseDto,
     type UserGetAllResponseDto,
+    type UserUpdateProfileRequestDto,
     type ValueOf,
 } from 'shared';

backend/src/bundles/users/user-details.model.ts

@@ -26,6 +26,8 @@ class UserDetailsModel extends AbstractModel {
     public static override get tableName(): string {
         return DatabaseTableName.USER_DETAILS;
     }
+
+    [key: string]: unknown;
 }
 
 export { UserDetailsModel };

backend/src/bundles/users/user.controller.ts

@@ -1,13 +1,16 @@
 import { type UserService } from '~/bundles/users/user.service.js';
-import { type UserAuthResponseDto } from '~/bundles/users/users.js';
+import {
+    type UserAuthResponseDto,
+    type UserUpdateProfileRequestDto,
+} from '~/bundles/users/users.js';
 import {
     type ApiHandlerOptions,
     type ApiHandlerResponse,
     ApiHandlerResponseType,
-    BaseController,
 } from '~/common/controller/controller.js';
+import { BaseController } from '~/common/controller/controller.js';
 import { ApiPath } from '~/common/enums/enums.js';
-import { HttpCode } from '~/common/http/http.js';
+import { HttpCode, HttpError } from '~/common/http/http.js';
 import { type Logger } from '~/common/logger/logger.js';
 
 import { UsersApiPath } from './enums/enums.js';
@@ -96,6 +99,19 @@ class UserController extends BaseController {
                     }>,
                 ),
         });
+
+        this.addRoute({
+            path: UsersApiPath.UPDATE_USER,
+            method: 'PATCH',
+            isProtected: true,
+            handler: (options) =>
+                this.updateUser(
+                    options as ApiHandlerOptions<{
+                        user: UserAuthResponseDto;
+                        body: UserUpdateProfileRequestDto;
+                    }>,
+                ),
+        });
     }
 
     /**
@@ -170,6 +186,32 @@ class UserController extends BaseController {
             payload: user,
         };
     }
+
+    private async updateUser(
+        options: ApiHandlerOptions<{
+            user: UserAuthResponseDto;
+            body: UserUpdateProfileRequestDto;
+        }>,
+    ): Promise<ApiHandlerResponse> {
+        const { user, body } = options;
+        const { id } = user;
+        try {
+            const updatedUser = await this.userService.updateUserProfile(
+                id,
+                body,
+            );
+            return {
+                type: ApiHandlerResponseType.DATA,
+                status: HttpCode.OK,
+                payload: updatedUser,
+            };
+        } catch (error) {
+            throw new HttpError({
+                message: `Something went wrong ${error}`,
+                status: HttpCode.BAD_REQUEST,
+            });
+        }
+    }
 }
 
 export { UserController };

backend/src/bundles/users/user.repository.ts

@@ -2,6 +2,8 @@ import { UserEntity } from '~/bundles/users/user.entity.js';
 import { type UserModel } from '~/bundles/users/user.model.js';
 import { type Repository } from '~/common/types/types.js';
 
+import { type UserDetailsModel } from './user-details.model.js';
+
 class UserRepository implements Repository {
     private userModel: typeof UserModel;
 
@@ -96,7 +98,6 @@ class UserRepository implements Repository {
             throw error;
         }
     }
-
     public async update(
         query: Record<string, unknown>,
         payload: Record<string, unknown>,
@@ -110,6 +111,44 @@ class UserRepository implements Repository {
             .execute();
     }
 
+    public async updateUserProfile(
+        userId: number,
+        payload: Partial<UserDetailsModel>,
+    ): Promise<UserEntity | null> {
+        const trx = await this.userModel.startTransaction();
+        try {
+            const user = await this.userModel.query(trx).findById(userId);
+
+            if (!user) {
+                return null;
+            }
+
+            const userDetails = await user
+                .$relatedQuery('userDetails', trx)
+                .patch(payload)
+                .returning('*')
+                .first();
+
+            await trx.commit();
+
+            if (!userDetails) {
+                return null;
+            }
+            return UserEntity.initialize({
+                ...user,
+                fullName: userDetails.fullName,
+                avatarUrl: userDetails.avatarUrl,
+                username: userDetails.username,
+                dateOfBirth: userDetails.dateOfBirth,
+                weight: userDetails.weight,
+                height: userDetails.height,
+                gender: userDetails.gender,
+            });
+        } catch (error) {
+            await trx.rollback();
+            throw new Error(`Error updating user details: ${error}`);
+        }
+    }
     public delete(): ReturnType<Repository['delete']> {
         return Promise.resolve(true);
     }

backend/src/bundles/users/user.service.ts

@@ -1,13 +1,17 @@
 import { UserEntity } from '~/bundles/users/user.entity.js';
 import { type UserRepository } from '~/bundles/users/user.repository.js';
+import { HttpCode, HttpError } from '~/common/http/http.js';
 import { cryptService, stripeService } from '~/common/services/services.js';
 import { type Service } from '~/common/types/types.js';
 
+import { UserValidationMessage } from './enums/enums.js';
 import {
     type UserAuthRequestDto,
     type UserAuthResponseDto,
     type UserGetAllResponseDto,
+    type UserUpdateProfileRequestDto,
 } from './types/types.js';
+import { type UserDetailsModel } from './user-details.model.js';
 
 class UserService implements Service {
     private userRepository: UserRepository;
@@ -48,6 +52,26 @@ class UserService implements Service {
         return user.toObject() as UserAuthResponseDto;
     }
 
+    public async updateUserProfile(
+        userId: number,
+        payload: UserUpdateProfileRequestDto,
+    ): Promise<UserAuthResponseDto | null> {
+        try {
+            const updatedUser = await this.userRepository.updateUserProfile(
+                userId,
+                payload as Partial<UserDetailsModel>,
+            );
+            if (!updatedUser) {
+                throw new HttpError({
+                    message: UserValidationMessage.USER_NOT_FOUND,
+                    status: HttpCode.NOT_FOUND,
+                });
+            }
+            return updatedUser.toObject() as UserAuthResponseDto;
+        } catch (error) {
+            throw new Error(`Error occured ${error}`);
+        }
+    }
     public async update(
         query: Record<string, unknown>,
         payload: Record<string, unknown>,

backend/src/bundles/users/users.ts

@@ -13,6 +13,7 @@ export { userController, userService };
 export {
     type UserAuthRequestDto,
     type UserAuthResponseDto,
+    type UserUpdateProfileRequestDto,
 } from './types/types.js';
 export { UserEntity } from './user.entity.js';
 export { UserModel } from './user.model.js';
@@ -21,4 +22,5 @@ export {
     passwordForgotValidationSchema,
     passwordResetValidationSchema,
     userAuthValidationSchema,
+    userUpdateProfileValidationSchema,
 } from './validation-schemas/validation-schemas.js';

backend/src/bundles/users/validation-schemas/validation-schemas.ts

@@ -2,4 +2,5 @@ export {
     passwordForgotValidationSchema,
     passwordResetValidationSchema,
     userAuthValidationSchema,
+    userUpdateProfileValidationSchema,
 } from 'shared';

backend/src/common/types/service.type.ts

@@ -7,7 +7,7 @@ type Service<T = unknown> = {
     update(
         query: Record<string, unknown>,
         payload: Record<string, unknown>,
-    ): Promise<T>;
+    ): Promise<T | null>;
     delete(payload: unknown): Promise<boolean>;
 };
 

backend/src/common/types/types.ts

@@ -14,6 +14,7 @@ export {
     type ServerCommonErrorResponse,
     type ServerErrorResponse,
     type ServerValidationErrorResponse,
+    type UserUpdateProfileRequestDto,
     type ValidationSchema,
     type ValueOf,
 } from 'shared';

frontend/src/bundles/auth/auth.ts

@@ -11,4 +11,7 @@ const authApi = new AuthApi({
 });
 
 export { authApi };
-export { type AuthResponseDto } from './types/types.js';
+export {
+    type AuthResponseDto,
+    type UserAuthResponseDto,
+} from './types/types.js';

frontend/src/bundles/auth/store/actions.ts

@@ -4,7 +4,10 @@ import {
     type AsyncThunkConfig,
     type UserAuthResponseDto,
 } from '~/bundles/common/types/types.js';
-import { type UserAuthRequestDto } from '~/bundles/users/users.js';
+import {
+    type UserAuthRequestDto,
+    type UserUpdateProfileRequestDto,
+} from '~/bundles/users/users.js';
 import { storage, StorageKey } from '~/framework/storage/storage.js';
 
 import { type AuthResponseDto } from '../auth.js';
@@ -46,4 +49,13 @@ const refreshUser = createAsyncThunk<
     return userApi.refreshUser();
 });
 
-export { refreshUser, signIn, signUp };
+const updateUser = createAsyncThunk<
+    UserAuthResponseDto,
+    UserUpdateProfileRequestDto,
+    AsyncThunkConfig
+>(`${sliceName}/update-user`, async (updateUserPayload, { extra }) => {
+    const { userApi } = extra;
+    return await userApi.updateUser(updateUserPayload);
+});
+
+export { refreshUser, signIn, signUp, updateUser };

frontend/src/bundles/auth/store/auth.ts

@@ -1,10 +1,11 @@
-import { refreshUser, signIn, signUp } from './actions.js';
+import { refreshUser, signIn, signUp, updateUser } from './actions.js';
 import { actions } from './slice.js';
 
 const allActions = {
     ...actions,
     signUp,
     signIn,
+    updateUser,
     refreshUser,
 };
 

frontend/src/bundles/auth/store/slice.ts

@@ -6,7 +6,7 @@ import {
     type ValueOf,
 } from '~/bundles/common/types/types.js';
 
-import { refreshUser, signIn, signUp } from './actions.js';
+import { refreshUser, signIn, signUp, updateUser } from './actions.js';
 
 type State = {
     dataStatus: ValueOf<typeof DataStatus>;
@@ -58,6 +58,16 @@ const { reducer, actions, name } = createSlice({
             state.dataStatus = DataStatus.REJECTED;
             state.isRefreshing = false;
         });
+        builder.addCase(updateUser.pending, (state) => {
+            state.dataStatus = DataStatus.PENDING;
+        });
+        builder.addCase(updateUser.fulfilled, (state, action) => {
+            state.dataStatus = DataStatus.FULFILLED;
+            state.user = action.payload;
+        });
+        builder.addCase(updateUser.rejected, (state) => {
+            state.dataStatus = DataStatus.REJECTED;
+        });
     },
 });
 

frontend/src/bundles/auth/types/types.ts

@@ -1 +1 @@
-export { type AuthResponseDto } from 'shared';
+export { type AuthResponseDto, type UserAuthResponseDto } from 'shared';

frontend/src/bundles/common/components/components.ts

@@ -1,5 +1,6 @@
 export { Avatar } from './avatar/avatar.js';
 export { Button, ButtonVariant } from './button/button.js';
+export { DatePicker } from './date-picker/date-picker.js';
 export { ForgotPasswordForm } from './forgot-password-form/forgot-password-form.js';
 export { Header } from './header/header.js';
 export { Icon } from './icon/icon.js';

frontend/src/bundles/common/components/date-picker/date-picker.tsx

@@ -33,7 +33,8 @@ const DatePicker = <T extends FieldValues>({
     const handleDaySelect = useCallback(
         (date: DateObjectProperties): false | undefined => {
             if ((date as DateObject).isValid) {
-                field.onChange((date as DateObject).format());
+                const formattedDate = (date as DateObject).format('DD/MM/YYYY');
+                field.onChange(formattedDate);
                 return;
             }
 
@@ -47,6 +48,7 @@ const DatePicker = <T extends FieldValues>({
                 containerClassName={'custom-date-picker'}
                 onChange={handleDaySelect}
                 offsetY={label ? -10 : -30}
+                format="DD/MM/YYYY"
                 render={
                     <Input
                         type="text"

frontend/src/bundles/common/components/input/input.tsx

@@ -14,6 +14,7 @@ import {
 } from '~/bundles/common/hooks/hooks.js';
 
 type Properties<T extends FieldValues> = {
+    className?: string;
     control: Control<T, null>;
     errors: FieldErrors<T>;
     label: string;
@@ -26,6 +27,7 @@ type Properties<T extends FieldValues> = {
 };
 
 const Input = <T extends FieldValues>({
+    className = '',
     control,
     errors,
     label,
@@ -52,7 +54,7 @@ const Input = <T extends FieldValues>({
     };
 
     return (
-        <label className="flex h-20 w-full flex-col text-sm">
+        <label className={`${className} flex h-20 flex-col text-sm text-white`}>
             <span className="mb-[0.5rem] font-medium">
                 {label} {required && <span className="text-lm-red">*</span>}
             </span>