From cf74f94e8b6d64542115624ad2175fd3106057fd Mon Sep 17 00:00:00 2001 From: Dmitry Nechay Date: Thu, 31 Jul 2025 12:13:42 +0300 Subject: [PATCH 1/2] [HUMAN App] fix: remove unnecessary query invalidation (#3484) --- .../src/api/hooks/use-access-token-refresh.ts | 9 +---- .../signin/worker/use-sign-in-mutation.ts | 9 ++--- .../signup/operator/hooks/use-add-stake.ts | 9 ++--- .../operator/hooks/use-edit-existing-keys.ts | 14 ++------ .../worker/hooks/use-sign-up-mutation.ts | 9 ++--- .../hooks/resend-email-verification.ts | 9 +---- .../hooks/enable-hcaptcha-labeling.ts | 9 ++--- .../hooks/use-solve-hcaptcha-mutation.ts | 22 ++++--------- .../worker/hooks/use-register-address.ts | 33 +++++++------------ .../available-jobs/hooks/use-assign-job.ts | 14 ++------ .../worker/jobs/hooks/use-get-my-jobs-data.ts | 2 +- .../jobs/my-jobs/hooks/use-refresh-jobs.ts | 5 ++- .../jobs/my-jobs/hooks/use-resign-job.ts | 5 ++- ...e-exchange-oracle-registration-mutation.ts | 7 ++-- .../profile/hooks/use-start-idv-mutation.ts | 9 +---- .../reset-password/hooks/reset-password.ts | 9 ++--- .../send-reset-link/hooks/send-reset-link.ts | 9 ++--- 17 files changed, 46 insertions(+), 137 deletions(-) diff --git a/packages/apps/human-app/frontend/src/api/hooks/use-access-token-refresh.ts b/packages/apps/human-app/frontend/src/api/hooks/use-access-token-refresh.ts index 95a3f79409..43fc67d936 100644 --- a/packages/apps/human-app/frontend/src/api/hooks/use-access-token-refresh.ts +++ b/packages/apps/human-app/frontend/src/api/hooks/use-access-token-refresh.ts @@ -1,4 +1,4 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { useAuth } from '@/modules/auth/hooks/use-auth'; import { browserAuthProvider } from '@/shared/contexts/browser-auth-provider'; @@ -8,7 +8,6 @@ import { routerPaths } from '@/router/router-paths'; import { authService } from '../authorized-http-api-client'; export function useAccessTokenRefresh() { - const queryClient = useQueryClient(); const navigate = useNavigate(); const { signOut: web2SignOut, user: web2User } = useAuth(); @@ -41,12 +40,6 @@ export function useAccessTokenRefresh() { }); } }, - onSuccess: async () => { - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); - }, scope: { id: 'refresh-access-token', }, diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts b/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts index b2665890cd..80c11c8e6e 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts @@ -1,4 +1,4 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { routerPaths } from '@/router/router-paths'; import { env } from '@/shared/env'; @@ -13,18 +13,13 @@ function signInMutationFn(data: SignInDto) { } export function useSignInMutation() { - const queryClient = useQueryClient(); const navigate = useNavigate(); return useMutation({ mutationFn: signInMutationFn, - onSuccess: async () => { + onSuccess: () => { navigate(routerPaths.worker.profile); window.location.reload(); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-add-stake.ts b/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-add-stake.ts index f6ca7cd4fe..0b02feb23f 100644 --- a/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-add-stake.ts +++ b/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-add-stake.ts @@ -1,4 +1,4 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { ethers } from 'ethers'; import { stakingStake } from '@/modules/smart-contracts/Staking/staking-stake'; @@ -62,7 +62,6 @@ export function useAddStake() { } = useConnectedWallet(); const { data: HMTDecimals } = useHMTokenDecimals(); - const queryClient = useQueryClient(); const navigate = useNavigate(); return useMutation({ @@ -75,12 +74,8 @@ export function useAddStake() { chainId, decimals: HMTDecimals, }), - onSuccess: async () => { + onSuccess: () => { navigate(routerPaths.operator.addKeys); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, mutationKey: ['addStake', address], }); diff --git a/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-edit-existing-keys.ts b/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-edit-existing-keys.ts index 17c989fff0..14d3451405 100644 --- a/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-edit-existing-keys.ts +++ b/packages/apps/human-app/frontend/src/modules/signup/operator/hooks/use-edit-existing-keys.ts @@ -1,8 +1,4 @@ -import { - useMutation, - useMutationState, - useQueryClient, -} from '@tanstack/react-query'; +import { useMutation, useMutationState } from '@tanstack/react-query'; import last from 'lodash/last'; import { useNavigate } from 'react-router-dom'; import type { JsonRpcSigner } from 'ethers'; @@ -50,7 +46,7 @@ export function useEditExistingKeysMutation() { chainId, web3ProviderMutation: { data: web3Data }, } = useConnectedWallet(); - const queryClient = useQueryClient(); + const navigate = useNavigate(); return useMutation({ @@ -60,12 +56,8 @@ export function useEditExistingKeysMutation() { chainId, signer: web3Data?.signer, }), - onSuccess: async () => { + onSuccess: () => { navigate(routerPaths.operator.editExistingKeysSuccess); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, mutationKey: ['editKeys', address], }); diff --git a/packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-mutation.ts b/packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-mutation.ts index 62dc24cace..e4b28846d3 100644 --- a/packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-mutation.ts @@ -1,25 +1,20 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { routerPaths } from '@/router/router-paths'; import * as signupService from '@/modules/signup/services/signup.service'; import { type SignUpDto } from '../schema'; export function useSignUpMutation() { - const queryClient = useQueryClient(); const navigate = useNavigate(); return useMutation({ mutationFn: async (data: Omit) => { return signupService.workerSignUp(data); }, - onSuccess: async (_, { email }) => { + onSuccess: (_, { email }) => { navigate(routerPaths.worker.verifyEmail, { state: { routerState: { email } }, }); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/email-verification/hooks/resend-email-verification.ts b/packages/apps/human-app/frontend/src/modules/worker/email-verification/hooks/resend-email-verification.ts index 1ec3ef6476..f8edb42b0d 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/email-verification/hooks/resend-email-verification.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/email-verification/hooks/resend-email-verification.ts @@ -1,4 +1,4 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { t } from 'i18next'; import { useAuth } from '@/modules/auth/hooks/use-auth'; import { type ResendEmailVerificationDto } from '../schemas'; @@ -20,18 +20,11 @@ async function resendEmailVerificationMutationFn( const resendEmailVerificationKey = 'resendEmailVerification'; export function useResendEmailVerificationWorkerMutation() { - const queryClient = useQueryClient(); const { user } = useAuth(); return useMutation({ mutationFn: (dto: ResendEmailVerificationDto) => resendEmailVerificationMutationFn(dto, Boolean(user)), - onSuccess: async () => { - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); - }, mutationKey: [resendEmailVerificationKey], }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/enable-hcaptcha-labeling.ts b/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/enable-hcaptcha-labeling.ts index 7f0e3a5e62..fcc7c9ccdd 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/enable-hcaptcha-labeling.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/enable-hcaptcha-labeling.ts @@ -1,11 +1,10 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { routerPaths } from '@/router/router-paths'; import { useAccessTokenRefresh } from '@/api/hooks/use-access-token-refresh'; import * as hCaptchaLabelingService from '../services/hcaptcha-labeling.service'; export function useEnableHCaptchaLabelingMutation() { - const queryClient = useQueryClient(); const navigate = useNavigate(); const { refreshAccessTokenAsync } = useAccessTokenRefresh(); const mutation = useMutation({ @@ -16,12 +15,8 @@ export function useEnableHCaptchaLabelingMutation() { return result; }, - onSuccess: async () => { + onSuccess: () => { navigate(routerPaths.worker.HcaptchaLabeling); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, }); diff --git a/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/use-solve-hcaptcha-mutation.ts b/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/use-solve-hcaptcha-mutation.ts index 06c402810f..0ce6074a3d 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/use-solve-hcaptcha-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/hcaptcha-labeling/hooks/use-solve-hcaptcha-mutation.ts @@ -1,30 +1,20 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import type { ResponseError } from '@/shared/types/global.type'; import * as hCaptchaLabelingService from '../services/hcaptcha-labeling.service'; import { type VerifyHCaptchaLabelingBody } from '../types'; -export function useSolveHCaptchaMutation(callbacks?: { - onSuccess?: (() => void) | (() => Promise); - onError?: - | ((error: ResponseError) => void) - | ((error: ResponseError) => Promise); +export function useSolveHCaptchaMutation(callbacks: { + onSuccess: () => void | Promise; + onError: (error: ResponseError) => void | Promise; }) { - const queryClient = useQueryClient(); - return useMutation({ mutationFn: async (data: VerifyHCaptchaLabelingBody) => hCaptchaLabelingService.verifyHCaptchaLabeling(data), onSuccess: async () => { - if (callbacks?.onSuccess) { - await callbacks.onSuccess(); - } - await queryClient.invalidateQueries(); + await callbacks.onSuccess(); }, onError: async (error) => { - if (callbacks?.onError) { - await callbacks.onError(error); - } - await queryClient.invalidateQueries(); + await callbacks.onError(error); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts b/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts index 1ce85f9e5e..ac857ceead 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts @@ -1,4 +1,4 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { t } from 'i18next'; import { useAuthenticatedUser } from '@/modules/auth/hooks/use-authenticated-user'; import { useAccessTokenRefresh } from '@/api/hooks/use-access-token-refresh'; @@ -9,12 +9,11 @@ import { PrepareSignatureType } from '@/shared/services/signature.service'; import * as profileService from '../profile/services/profile.service'; interface RegisterAddressCallbacks { - onSuccess?: () => void | Promise; - onError?: (error: ResponseError) => void | Promise; + onSuccess: () => void | Promise; + onError: (error: ResponseError) => void | Promise; } -function useRegisterAddressMutation(callbacks?: RegisterAddressCallbacks) { - const queryClient = useQueryClient(); +function useRegisterAddressMutation(callbacks: RegisterAddressCallbacks) { const { user, updateUserData } = useAuthenticatedUser(); const { refreshAccessTokenAsync } = useAccessTokenRefresh(); const { address, chainId, signMessage } = useWalletConnect(); @@ -45,29 +44,19 @@ function useRegisterAddressMutation(callbacks?: RegisterAddressCallbacks) { }); }; - const onSuccess = async () => { - if (callbacks?.onSuccess) { - await callbacks.onSuccess(); - } - await queryClient.invalidateQueries(); - }; - - const onError = async (error: ResponseError) => { - if (callbacks?.onError) { - await callbacks.onError(error); - } - await queryClient.invalidateQueries(); - }; - return useMutation({ mutationFn, - onSuccess, - onError, + onSuccess: async () => { + await callbacks.onSuccess(); + }, + onError: async (error: ResponseError) => { + await callbacks.onError(error); + }, mutationKey: [user.wallet_address], }); } -export function useRegisterAddress(callbacks?: RegisterAddressCallbacks) { +export function useRegisterAddress(callbacks: RegisterAddressCallbacks) { const mutation = useRegisterAddressMutation(callbacks); return { diff --git a/packages/apps/human-app/frontend/src/modules/worker/jobs/available-jobs/hooks/use-assign-job.ts b/packages/apps/human-app/frontend/src/modules/worker/jobs/available-jobs/hooks/use-assign-job.ts index 68e11c9aae..0f31b2da5e 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/jobs/available-jobs/hooks/use-assign-job.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/jobs/available-jobs/hooks/use-assign-job.ts @@ -1,9 +1,5 @@ import { z } from 'zod'; -import { - type MutationKey, - useMutation, - useQueryClient, -} from '@tanstack/react-query'; +import { type MutationKey, useMutation } from '@tanstack/react-query'; import * as jobsService from '../../services/jobs.service'; import { type AssignJobBody } from '../../types'; @@ -16,16 +12,12 @@ export function useAssignJobMutation( }, mutationKey?: MutationKey ) { - const queryClient = useQueryClient(); - return useMutation({ mutationFn: async (data: AssignJobBody) => jobsService.assignJob(data), - onSuccess: async () => { - await queryClient.invalidateQueries(); + onSuccess: () => { callbacks?.onSuccess(); }, - onError: async (error) => { - await queryClient.invalidateQueries(); + onError: (error) => { callbacks?.onError(error); }, mutationKey, diff --git a/packages/apps/human-app/frontend/src/modules/worker/jobs/hooks/use-get-my-jobs-data.ts b/packages/apps/human-app/frontend/src/modules/worker/jobs/hooks/use-get-my-jobs-data.ts index b9bd203a3e..e6945bbbfa 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/jobs/hooks/use-get-my-jobs-data.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/jobs/hooks/use-get-my-jobs-data.ts @@ -21,7 +21,7 @@ export function useGetMyJobsData() { }; return useQuery({ - queryKey: ['myJobs', queryParams], + queryKey: ['fetchMyJobs', queryParams], queryFn: async ({ signal }) => jobsService.fetchMyJobs({ queryParams, signal }), }); diff --git a/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-refresh-jobs.ts b/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-refresh-jobs.ts index 812ebb03d3..c1d51ea138 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-refresh-jobs.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-refresh-jobs.ts @@ -17,13 +17,12 @@ export function useRefreshJobsMutation(callbacks?: { if (callbacks?.onSuccess) { void callbacks.onSuccess(); } - await queryClient.invalidateQueries(); + await queryClient.invalidateQueries({ queryKey: ['fetchMyJobs'] }); }, - onError: async (error) => { + onError: (error) => { if (callbacks?.onError) { void callbacks.onError(error); } - await queryClient.invalidateQueries(); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-resign-job.ts b/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-resign-job.ts index cc1daa15fd..0271b7c797 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-resign-job.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-resign-job.ts @@ -17,13 +17,12 @@ export function useResignJobMutation(callbacks?: { if (callbacks?.onSuccess) { void callbacks.onSuccess(); } - await queryClient.invalidateQueries(); + await queryClient.invalidateQueries({ queryKey: ['fetchMyJobs'] }); }, - onError: async (error) => { + onError: (error) => { if (callbacks?.onError) { void callbacks.onError(error); } - await queryClient.invalidateQueries(); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/hooks/use-exchange-oracle-registration-mutation.ts b/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/hooks/use-exchange-oracle-registration-mutation.ts index 400fd45f17..30e986a729 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/hooks/use-exchange-oracle-registration-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/hooks/use-exchange-oracle-registration-mutation.ts @@ -9,10 +9,9 @@ export function useExchangeOracleRegistrationMutation() { mutationFn: async (data: RegistrationInExchangeOracleDto) => oracleRegistrationService.registerInExchangeOracle(data), onSuccess: async () => { - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); + await queryClient.invalidateQueries({ + queryKey: ['getRegistrationDataInOracles'], + }); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts b/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts index bc97f2f093..55a9fed223 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts @@ -1,19 +1,12 @@ -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useAuthenticatedUser } from '@/modules/auth/hooks/use-authenticated-user'; import * as profileService from '../services/profile.service'; export function useIdvStartMutation() { - const queryClient = useQueryClient(); const { user } = useAuthenticatedUser(); return useMutation({ mutationFn: async () => profileService.startIdv(), - onError: () => { - void queryClient.invalidateQueries(); - }, - onSuccess: () => { - void queryClient.invalidateQueries(); - }, mutationKey: ['idvStart', user.email], }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/reset-password/hooks/reset-password.ts b/packages/apps/human-app/frontend/src/modules/worker/reset-password/hooks/reset-password.ts index 7da3044c1e..f8e09d9668 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/reset-password/hooks/reset-password.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/reset-password/hooks/reset-password.ts @@ -1,5 +1,5 @@ import { z } from 'zod'; -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { routerPaths } from '@/router/router-paths'; import * as passwordService from '../password.service'; @@ -8,19 +8,14 @@ import { type ResetPasswordDto } from '../types'; export const ResetPasswordSuccessResponseSchema = z.unknown(); export function useResetPasswordMutation() { - const queryClient = useQueryClient(); const navigate = useNavigate(); return useMutation({ mutationFn: async ( data: Omit & { token: string } ) => passwordService.resetPassword(data), - onSuccess: async () => { + onSuccess: () => { navigate(routerPaths.worker.resetPasswordSuccess); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/hooks/send-reset-link.ts b/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/hooks/send-reset-link.ts index e64a755532..e55ddb689f 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/hooks/send-reset-link.ts +++ b/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/hooks/send-reset-link.ts @@ -1,5 +1,5 @@ import { z } from 'zod'; -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { useMutation } from '@tanstack/react-query'; import { useNavigate } from 'react-router-dom'; import { routerPaths } from '@/router/router-paths'; import { type SendResetLinkDto } from '../schemas'; @@ -8,18 +8,13 @@ import * as passwordService from '../../reset-password/password.service'; export const SendResetLinkSuccessResponseSchema = z.unknown(); export function useSendResetLinkMutation() { - const queryClient = useQueryClient(); const navigate = useNavigate(); return useMutation({ mutationFn: async (data: SendResetLinkDto) => passwordService.sendResetLink(data), - onSuccess: async (_, { email }) => { + onSuccess: (_, { email }) => { navigate(routerPaths.worker.sendResetLinkSuccess, { state: { email } }); - await queryClient.invalidateQueries(); - }, - onError: async () => { - await queryClient.invalidateQueries(); }, }); } From 34767095193baa8d29c57e0c8e3df38023d2649d Mon Sep 17 00:00:00 2001 From: Dmitry Nechay Date: Thu, 31 Jul 2025 13:27:30 +0300 Subject: [PATCH 2/2] [HUMAN App] feat: browser caching and decoded auth (#3486) --- .../shared/contexts/browser-auth-provider.ts | 45 +++++++++++-------- .../modules/h-captcha/h-captcha.controller.ts | 12 ++--- .../oracle-discovery.controller.ts | 4 +- .../ui-configuration.controller.ts | 5 ++- 4 files changed, 39 insertions(+), 27 deletions(-) diff --git a/packages/apps/human-app/frontend/src/shared/contexts/browser-auth-provider.ts b/packages/apps/human-app/frontend/src/shared/contexts/browser-auth-provider.ts index 9a10b113f8..bf38004fb3 100644 --- a/packages/apps/human-app/frontend/src/shared/contexts/browser-auth-provider.ts +++ b/packages/apps/human-app/frontend/src/shared/contexts/browser-auth-provider.ts @@ -5,14 +5,16 @@ import type { } from '@/shared/types/browser-auth-provider'; import { type AuthTokensSuccessResponse } from '../schemas'; -const accessTokenKey = btoa('access_token'); -const refreshTokenKey = btoa('refresh_token'); -const authTypeKey = btoa('auth_type'); -const userDataKey = btoa('extendable_user_data'); +const accessTokenKey = 'ro_access_token'; +const refreshTokenKey = 'ro_refresh_token'; +const authTypeKey = 'ro_auth_type'; +const userDataKey = 'ro_extendable_user_data'; const browserAuthProvider: BrowserAuthProvider = { isAuthenticated: false, authType: 'web2', + signOutSubscription: undefined, + signIn( { access_token, refresh_token }: AuthTokensSuccessResponse, authType, @@ -20,14 +22,15 @@ const browserAuthProvider: BrowserAuthProvider = { ) { browserAuthProvider.isAuthenticated = true; browserAuthProvider.authType = authType; - localStorage.setItem(accessTokenKey, btoa(access_token)); - localStorage.setItem(refreshTokenKey, btoa(refresh_token)); - localStorage.setItem(authTypeKey, btoa(authType)); + localStorage.setItem(accessTokenKey, access_token); + localStorage.setItem(refreshTokenKey, refresh_token); + localStorage.setItem(authTypeKey, authType); if (signOutSubscription) { this.signOutSubscription = signOutSubscription; } }, + signOut(args) { browserAuthProvider.isAuthenticated = false; localStorage.removeItem(accessTokenKey); @@ -44,37 +47,41 @@ const browserAuthProvider: BrowserAuthProvider = { this.signOutSubscription = undefined; } }, - signOutSubscription: undefined, + getAccessToken() { - const result = localStorage.getItem(accessTokenKey); + const accessToken = localStorage.getItem(accessTokenKey); - if (!result) { + if (!accessToken) { return null; } - return atob(result); + return accessToken; }, + getRefreshToken() { - const result = localStorage.getItem(refreshTokenKey); + const refreshToken = localStorage.getItem(refreshTokenKey); - if (!result) { + if (!refreshToken) { return null; } - return atob(result); + return refreshToken; }, + getAuthType(): AuthType | null { - const result = localStorage.getItem(authTypeKey); + const authType = localStorage.getItem(authTypeKey); - if (!result) { + if (!authType) { return null; } - return atob(result) as AuthType; + return authType as AuthType; }, + setUserData(userData) { - localStorage.setItem(userDataKey, btoa(JSON.stringify(userData))); + localStorage.setItem(userDataKey, JSON.stringify(userData)); }, + getUserData() { const userData = localStorage.getItem(userDataKey); @@ -84,7 +91,7 @@ const browserAuthProvider: BrowserAuthProvider = { try { return { - data: JSON.parse(atob(userData)) as unknown, + data: JSON.parse(userData) as unknown, }; } catch (error) { return { data: {} as unknown }; diff --git a/packages/apps/human-app/server/src/modules/h-captcha/h-captcha.controller.ts b/packages/apps/human-app/server/src/modules/h-captcha/h-captcha.controller.ts index 74c41e8ca0..957c848700 100644 --- a/packages/apps/human-app/server/src/modules/h-captcha/h-captcha.controller.ts +++ b/packages/apps/human-app/server/src/modules/h-captcha/h-captcha.controller.ts @@ -1,6 +1,6 @@ import { Mapper } from '@automapper/core'; import { InjectMapper } from '@automapper/nestjs'; -import { Body, Controller, Get, Post, Request } from '@nestjs/common'; +import { Body, Controller, Get, Header, Post, Request } from '@nestjs/common'; import { ApiBearerAuth, ApiOperation, ApiTags } from '@nestjs/swagger'; import { RequestWithUser } from '../../common/interfaces/jwt'; import { JwtUserData } from '../../common/utils/jwt-token.model'; @@ -29,8 +29,8 @@ export class HCaptchaController { @InjectMapper() private readonly mapper: Mapper, ) {} - @Post('/enable') @ApiOperation({ summary: 'Enables h-captcha labeling' }) + @Post('/enable') public async enableLabeling( @Request() req: RequestWithUser, ): Promise { @@ -40,8 +40,8 @@ export class HCaptchaController { return this.service.enableLabeling(command); } - @Post('/verify') @ApiOperation({ summary: 'Sends solution for verification' }) + @Post('/verify') public async verifyToken( @Body() dto: VerifyTokenDto, @Request() req: RequestWithUser, @@ -55,8 +55,9 @@ export class HCaptchaController { return await this.service.verifyToken(command); } - @Get('/daily-hmt-spent') @ApiOperation({ summary: 'Gets global daily HMT spent' }) + @Header('Cache-Control', 'public, max-age=60') + @Get('/daily-hmt-spent') public async getDailyHmtSpent( @Request() req: RequestWithUser, ): Promise { @@ -71,8 +72,9 @@ export class HCaptchaController { return this.service.getDailyHmtSpent(command); } - @Get('/user-stats') @ApiOperation({ summary: 'Gets stats per user' }) + @Header('Cache-Control', 'public, max-age=60') + @Get('/user-stats') public async getUserStats( @Request() req: RequestWithUser, ): Promise { diff --git a/packages/apps/human-app/server/src/modules/oracle-discovery/oracle-discovery.controller.ts b/packages/apps/human-app/server/src/modules/oracle-discovery/oracle-discovery.controller.ts index 9043f216d1..321f0943f3 100644 --- a/packages/apps/human-app/server/src/modules/oracle-discovery/oracle-discovery.controller.ts +++ b/packages/apps/human-app/server/src/modules/oracle-discovery/oracle-discovery.controller.ts @@ -3,6 +3,7 @@ import { InjectMapper } from '@automapper/nestjs'; import { Controller, Get, + Header, HttpException, HttpStatus, Query, @@ -27,12 +28,13 @@ export class OracleDiscoveryController { @InjectMapper() private readonly mapper: Mapper, ) {} - @Get('/oracles') @ApiOperation({ summary: 'Oracles discovery' }) @ApiOkResponse({ type: Array, description: 'List of oracles', }) + @Header('Cache-Control', 'public, max-age=60') + @Get('/oracles') public async getOracles( @Request() req: RequestWithUser, @Query() query: GetOraclesQuery, diff --git a/packages/apps/human-app/server/src/modules/ui-configuration/ui-configuration.controller.ts b/packages/apps/human-app/server/src/modules/ui-configuration/ui-configuration.controller.ts index 291bb66b9e..0ed982fe27 100644 --- a/packages/apps/human-app/server/src/modules/ui-configuration/ui-configuration.controller.ts +++ b/packages/apps/human-app/server/src/modules/ui-configuration/ui-configuration.controller.ts @@ -1,4 +1,4 @@ -import { Controller, Get } from '@nestjs/common'; +import { Controller, Get, Header } from '@nestjs/common'; import { ApiOkResponse, ApiOperation, ApiTags } from '@nestjs/swagger'; import { EnvironmentConfigService } from '../../common/config/environment-config.service'; import { Public } from '../../common/decorators'; @@ -12,12 +12,13 @@ export class UiConfigurationController { private readonly environmentConfigService: EnvironmentConfigService, ) {} - @Get('/ui-config') @ApiOperation({ summary: 'Retrieve UI configuration' }) @ApiOkResponse({ type: UiConfigResponseDto, description: 'UI Configuration object', }) + @Header('Cache-Control', 'public, max-age=3600') + @Get('/ui-config') public async getConfig(): Promise { return { chainIdsEnabled: this.environmentConfigService.chainIdsEnabled,