From 6a002592f012ec2ba2e2d03218536d7fcabf7772 Mon Sep 17 00:00:00 2001 From: Sam Date: Sun, 31 Oct 2021 09:27:12 +0100 Subject: [PATCH] Client - init users store --- fittrackee_client/src/store/constants.ts | 11 ++++ .../src/store/modules/root/index.ts | 2 + .../src/store/modules/users/actions.ts | 38 +++++++++++ .../src/store/modules/users/enums.ts | 15 +++++ .../src/store/modules/users/getters.ts | 17 +++++ .../src/store/modules/users/index.ts | 17 +++++ .../src/store/modules/users/mutations.ts | 27 ++++++++ .../src/store/modules/users/state.ts | 8 +++ .../src/store/modules/users/types.ts | 63 +++++++++++++++++++ fittrackee_client/src/store/types.ts | 3 + fittrackee_client/src/types/api.ts | 14 +++++ fittrackee_client/src/types/users.ts | 0 fittrackee_client/src/utils/index.ts | 2 + 13 files changed, 217 insertions(+) create mode 100644 fittrackee_client/src/store/modules/users/actions.ts create mode 100644 fittrackee_client/src/store/modules/users/enums.ts create mode 100644 fittrackee_client/src/store/modules/users/getters.ts create mode 100644 fittrackee_client/src/store/modules/users/index.ts create mode 100644 fittrackee_client/src/store/modules/users/mutations.ts create mode 100644 fittrackee_client/src/store/modules/users/state.ts create mode 100644 fittrackee_client/src/store/modules/users/types.ts create mode 100644 fittrackee_client/src/types/api.ts create mode 100644 fittrackee_client/src/types/users.ts diff --git a/fittrackee_client/src/store/constants.ts b/fittrackee_client/src/store/constants.ts index 3e1da6e4..586de458 100644 --- a/fittrackee_client/src/store/constants.ts +++ b/fittrackee_client/src/store/constants.ts @@ -18,6 +18,11 @@ import { UserGetters, UserMutations, } from '@/store/modules/user/enums' +import { + UsersActions, + UsersGetters, + UsersMutations, +} from '@/store/modules/users/enums' import { WorkoutsActions, WorkoutsGetters, @@ -48,6 +53,12 @@ export const USER_STORE = { MUTATIONS: UserMutations, } +export const USERS_STORE = { + ACTIONS: UsersActions, + GETTERS: UsersGetters, + MUTATIONS: UsersMutations, +} + export const WORKOUTS_STORE = { ACTIONS: WorkoutsActions, GETTERS: WorkoutsGetters, diff --git a/fittrackee_client/src/store/modules/root/index.ts b/fittrackee_client/src/store/modules/root/index.ts index cb93bab1..19233e1e 100644 --- a/fittrackee_client/src/store/modules/root/index.ts +++ b/fittrackee_client/src/store/modules/root/index.ts @@ -8,12 +8,14 @@ import { IRootState } from '@/store/modules/root/types' import sportsModule from '@/store/modules/sports' import statsModule from '@/store/modules/statistics' import userModule from '@/store/modules/user' +import usersModule from '@/store/modules/users' import workoutsModule from '@/store/modules/workouts' const modules: ModuleTree = { sportsModule, statsModule, userModule, + usersModule, workoutsModule, } diff --git a/fittrackee_client/src/store/modules/users/actions.ts b/fittrackee_client/src/store/modules/users/actions.ts new file mode 100644 index 00000000..b6410df2 --- /dev/null +++ b/fittrackee_client/src/store/modules/users/actions.ts @@ -0,0 +1,38 @@ +import { ActionContext, ActionTree } from 'vuex' + +import authApi from '@/api/authApi' +import { ROOT_STORE, USERS_STORE } from '@/store/constants' +import { IRootState } from '@/store/modules/root/types' +import { IUsersActions, IUsersState } from '@/store/modules/users/types' +import { IPaginationPayload } from '@/types/api' +import { handleError } from '@/utils' + +export const actions: ActionTree & IUsersActions = { + [USERS_STORE.ACTIONS.GET_USERS]( + context: ActionContext, + payload: IPaginationPayload + ): void { + context.commit(ROOT_STORE.MUTATIONS.EMPTY_ERROR_MESSAGES) + context.commit(USERS_STORE.MUTATIONS.UPDATE_USERS_LOADING, true) + authApi + .get('users', { params: payload }) + .then((res) => { + if (res.data.status === 'success') { + context.commit( + USERS_STORE.MUTATIONS.UPDATE_USERS, + res.data.data.users + ) + context.commit( + USERS_STORE.MUTATIONS.UPDATE_USERS_PAGINATION, + res.data.data.pagination + ) + } else { + handleError(context, null) + } + }) + .catch((error) => handleError(context, error)) + .finally(() => + context.commit(USERS_STORE.MUTATIONS.UPDATE_USERS_LOADING, false) + ) + }, +} diff --git a/fittrackee_client/src/store/modules/users/enums.ts b/fittrackee_client/src/store/modules/users/enums.ts new file mode 100644 index 00000000..51fe925d --- /dev/null +++ b/fittrackee_client/src/store/modules/users/enums.ts @@ -0,0 +1,15 @@ +export enum UsersActions { + GET_USERS = 'GET_USERS', +} + +export enum UsersGetters { + USERS = 'USERS', + USERS_LOADING = 'USERS_LOADING', + USERS_PAGINATION = 'USERS_PAGINATION', +} + +export enum UsersMutations { + UPDATE_USERS = 'UPDATE_USERS', + UPDATE_USERS_LOADING = 'UPDATE_USERS_LOADING', + UPDATE_USERS_PAGINATION = 'UPDATE_USERS_PAGINATION', +} diff --git a/fittrackee_client/src/store/modules/users/getters.ts b/fittrackee_client/src/store/modules/users/getters.ts new file mode 100644 index 00000000..1c5011fa --- /dev/null +++ b/fittrackee_client/src/store/modules/users/getters.ts @@ -0,0 +1,17 @@ +import { GetterTree } from 'vuex' + +import { USERS_STORE } from '@/store/constants' +import { IRootState } from '@/store/modules/root/types' +import { IUsersGetters, IUsersState } from '@/store/modules/users/types' + +export const getters: GetterTree & IUsersGetters = { + [USERS_STORE.GETTERS.USERS]: (state: IUsersState) => { + return state.users + }, + [USERS_STORE.GETTERS.USERS_LOADING]: (state: IUsersState) => { + return state.loading + }, + [USERS_STORE.GETTERS.USERS_PAGINATION]: (state: IUsersState) => { + return state.pagination + }, +} diff --git a/fittrackee_client/src/store/modules/users/index.ts b/fittrackee_client/src/store/modules/users/index.ts new file mode 100644 index 00000000..e7a8e61e --- /dev/null +++ b/fittrackee_client/src/store/modules/users/index.ts @@ -0,0 +1,17 @@ +import { Module } from 'vuex' + +import { IRootState } from '@/store/modules/root/types' +import { actions } from '@/store/modules/users/actions' +import { getters } from '@/store/modules/users/getters' +import { mutations } from '@/store/modules/users/mutations' +import { usersState } from '@/store/modules/users/state' +import { IUsersState } from '@/store/modules/users/types' + +const users: Module = { + state: usersState, + actions, + getters, + mutations, +} + +export default users diff --git a/fittrackee_client/src/store/modules/users/mutations.ts b/fittrackee_client/src/store/modules/users/mutations.ts new file mode 100644 index 00000000..790cac56 --- /dev/null +++ b/fittrackee_client/src/store/modules/users/mutations.ts @@ -0,0 +1,27 @@ +import { MutationTree } from 'vuex' + +import { USERS_STORE } from '@/store/constants' +import { IUsersState, TUsersMutations } from '@/store/modules/users/types' +import { IPagination } from '@/types/api' +import { IUserProfile } from '@/types/user' + +export const mutations: MutationTree & TUsersMutations = { + [USERS_STORE.MUTATIONS.UPDATE_USERS]( + state: IUsersState, + users: IUserProfile[] + ) { + state.users = users + }, + [USERS_STORE.MUTATIONS.UPDATE_USERS_LOADING]( + state: IUsersState, + loading: boolean + ) { + state.loading = loading + }, + [USERS_STORE.MUTATIONS.UPDATE_USERS_PAGINATION]( + state: IUsersState, + pagination: IPagination + ) { + state.pagination = pagination + }, +} diff --git a/fittrackee_client/src/store/modules/users/state.ts b/fittrackee_client/src/store/modules/users/state.ts new file mode 100644 index 00000000..d7287584 --- /dev/null +++ b/fittrackee_client/src/store/modules/users/state.ts @@ -0,0 +1,8 @@ +import { IUsersState } from '@/store/modules/users/types' +import { IPagination } from '@/types/api' + +export const usersState: IUsersState = { + users: [], + loading: false, + pagination: {}, +} diff --git a/fittrackee_client/src/store/modules/users/types.ts b/fittrackee_client/src/store/modules/users/types.ts new file mode 100644 index 00000000..3c8c366b --- /dev/null +++ b/fittrackee_client/src/store/modules/users/types.ts @@ -0,0 +1,63 @@ +import { + ActionContext, + CommitOptions, + DispatchOptions, + Store as VuexStore, +} from 'vuex' + +import { USERS_STORE } from '@/store/constants' +import { IRootState } from '@/store/modules/root/types' +import { IPagination, IPaginationPayload } from '@/types/api' +import { IUserProfile } from '@/types/user' + +export interface IUsersState { + users: IUserProfile[] + loading: boolean + pagination: IPagination +} + +export interface IUsersActions { + [USERS_STORE.ACTIONS.GET_USERS]( + context: ActionContext, + payload: IPaginationPayload + ): void +} + +export interface IUsersGetters { + [USERS_STORE.GETTERS.USERS](state: IUsersState): IUserProfile[] + [USERS_STORE.GETTERS.USERS_LOADING](state: IUsersState): boolean + [USERS_STORE.GETTERS.USERS_PAGINATION](state: IUsersState): IPagination +} + +export type TUsersMutations = { + [USERS_STORE.MUTATIONS.UPDATE_USERS](state: S, users: IUserProfile[]): void + [USERS_STORE.MUTATIONS.UPDATE_USERS_LOADING](state: S, loading: boolean): void + [USERS_STORE.MUTATIONS.UPDATE_USERS_PAGINATION]( + state: S, + pagination: IPagination + ): void +} + +export type TUsersStoreModule = Omit< + VuexStore, + 'commit' | 'getters' | 'dispatch' +> & { + dispatch( + key: K, + payload?: Parameters[1], + options?: DispatchOptions + ): ReturnType +} & { + getters: { + [K in keyof IUsersGetters]: ReturnType + } +} & { + commit< + K extends keyof TUsersMutations, + P extends Parameters[1] + >( + key: K, + payload?: P, + options?: CommitOptions + ): ReturnType +} diff --git a/fittrackee_client/src/store/types.ts b/fittrackee_client/src/store/types.ts index 263dd40c..dfcc68b6 100644 --- a/fittrackee_client/src/store/types.ts +++ b/fittrackee_client/src/store/types.ts @@ -2,6 +2,7 @@ import { TRootStoreModule } from '@/store/modules/root/types' import { TSportsStoreModule } from '@/store/modules/sports/types' import { TStatisticsStoreModule } from '@/store/modules/statistics/types' import { TUserStoreModule } from '@/store/modules/user/types' +import { TUsersStoreModule } from '@/store/modules/users/types' import { TWorkoutsStoreModule } from '@/store/modules/workouts/types' type StoreModules = { @@ -9,6 +10,7 @@ type StoreModules = { sportsModule: TSportsStoreModule statsModule: TStatisticsStoreModule userModule: TUserStoreModule + usersModule: TUsersStoreModule workoutsModule: TWorkoutsStoreModule } @@ -16,4 +18,5 @@ export type Store = TUserStoreModule> & TSportsStoreModule> & TStatisticsStoreModule> & TWorkoutsStoreModule> & + TUsersStoreModule> & TRootStoreModule> diff --git a/fittrackee_client/src/types/api.ts b/fittrackee_client/src/types/api.ts new file mode 100644 index 00000000..ff0fefe3 --- /dev/null +++ b/fittrackee_client/src/types/api.ts @@ -0,0 +1,14 @@ +export interface IPagination { + has_next: boolean + has_prev: boolean + page: number + pages: number + total: number +} + +export interface IPaginationPayload { + order: string + order_by: string + per_page: number + page: number +} diff --git a/fittrackee_client/src/types/users.ts b/fittrackee_client/src/types/users.ts new file mode 100644 index 00000000..e69de29b diff --git a/fittrackee_client/src/utils/index.ts b/fittrackee_client/src/utils/index.ts index e90b94fa..c8fb0c1d 100644 --- a/fittrackee_client/src/utils/index.ts +++ b/fittrackee_client/src/utils/index.ts @@ -6,6 +6,7 @@ import { IRootState } from '@/store/modules/root/types' import { ISportsState } from '@/store/modules/sports/types' import { IStatisticsState } from '@/store/modules/statistics/types' import { IUserState } from '@/store/modules/user/types' +import { IUsersState } from '@/store/modules/users/types' import { IWorkoutsState } from '@/store/modules/workouts/types' export const getApiUrl = (): string => { @@ -25,6 +26,7 @@ export const handleError = ( | ActionContext | ActionContext | ActionContext + | ActionContext | ActionContext, error: AxiosError | null, msg = 'UNKNOWN'