From d403252072646d9aac25ce264459bc583397f213 Mon Sep 17 00:00:00 2001 From: Alexandre Anicio Date: Tue, 10 Dec 2024 15:02:36 -0300 Subject: [PATCH] BA-hotfix: current profile fixes --- packages/authentication/CHANGELOG.md | 9 ++++++ .../modules/access/useLogin/index.ts | 2 +- .../authentication/modules/profile/index.ts | 5 ++- .../index.tsx | 32 +++++++++++++++++++ .../InitialProfileProviderForTesting/types.ts | 7 ++++ .../InitialProfileProvider/index.tsx | 25 --------------- .../profile/useCurrentProfile/index.ts | 11 +++++++ packages/authentication/package.json | 2 +- packages/components/CHANGELOG.md | 8 +++++ .../AccountPopover/CurrentUser/index.tsx | 6 ++-- .../__utils__/withProviders/index.tsx | 12 +++---- .../__utils__/withProviders/types.ts | 3 ++ packages/components/package.json | 2 +- 13 files changed, 82 insertions(+), 42 deletions(-) create mode 100644 packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/index.tsx create mode 100644 packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/types.ts delete mode 100644 packages/authentication/modules/profile/useCurrentProfile/__tests__/__utils__/InitialProfileProvider/index.tsx diff --git a/packages/authentication/CHANGELOG.md b/packages/authentication/CHANGELOG.md index 85624015..5863ef9b 100644 --- a/packages/authentication/CHANGELOG.md +++ b/packages/authentication/CHANGELOG.md @@ -1,5 +1,14 @@ # @baseapp-frontend/authentication +## 4.0.4 + +### Patch Changes + +- Make sure the log out listener is loaded only once on `useCurrentProfile`. +- Fix `useLogin` adding optional chaining to a problematic expression. +- Move `InitialProfileProviderForTesting` around. + + ## 4.0.3 ### Patch Changes diff --git a/packages/authentication/modules/access/useLogin/index.ts b/packages/authentication/modules/access/useLogin/index.ts index 8b796f58..49106635 100644 --- a/packages/authentication/modules/access/useLogin/index.ts +++ b/packages/authentication/modules/access/useLogin/index.ts @@ -57,7 +57,7 @@ const useLogin = ({ if (user) { // TODO: handle the absolute image path on the backend const baseUrl = process.env.NEXT_PUBLIC_API_BASE_URL?.replace('/v1', '') - const absoluteImagePath = user.profile.image ? `${baseUrl}${user.profile.image}` : null + const absoluteImagePath = user?.profile?.image ? `${baseUrl}${user.profile.image}` : null setCurrentProfile({ ...user.profile, image: absoluteImagePath, diff --git a/packages/authentication/modules/profile/index.ts b/packages/authentication/modules/profile/index.ts index 61539227..ada512ba 100644 --- a/packages/authentication/modules/profile/index.ts +++ b/packages/authentication/modules/profile/index.ts @@ -1,5 +1,4 @@ export { default as useCurrentProfile } from './useCurrentProfile' +export { default as InitialProfileProviderForTesting } from './useCurrentProfile/InitialProfileProviderForTesting' +export * from './useCurrentProfile/constants' export type { MinimalProfile } from '../../types/profile' - -export { InitialProfileProvider } from './useCurrentProfile/__tests__/__utils__/InitialProfileProvider' -export type { InitialProfileProp } from './useCurrentProfile/__tests__/__utils__/InitialProfileProvider' diff --git a/packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/index.tsx b/packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/index.tsx new file mode 100644 index 00000000..707d2763 --- /dev/null +++ b/packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/index.tsx @@ -0,0 +1,32 @@ +import { FC } from 'react' + +import { useHydrateAtoms } from 'jotai/utils' + +import { profileAtom } from '..' +import { InitialProfileProviderForTestingProps } from './types' + +/** + * InitialProfileProviderForTesting component. + * + * This component is used to provide an initial profile state for testing purposes. + * It uses the `useHydrateAtoms` hook from `jotai/utils` to set the initial state of the `profileAtom`. + * + * @component + * @example + * ```tsx + * + * + * // Your component goes here, it is passed the initialProfile + * + * + * ``` + */ +const InitialProfileProviderForTesting: FC = ({ + initialProfile, + children, +}) => { + useHydrateAtoms([[profileAtom, initialProfile]]) + return children +} + +export default InitialProfileProviderForTesting diff --git a/packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/types.ts b/packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/types.ts new file mode 100644 index 00000000..d65246b9 --- /dev/null +++ b/packages/authentication/modules/profile/useCurrentProfile/InitialProfileProviderForTesting/types.ts @@ -0,0 +1,7 @@ +import { type PropsWithChildren } from 'react' + +import { type MinimalProfile } from '../../../../types/profile' + +export interface InitialProfileProviderForTestingProps extends PropsWithChildren { + initialProfile: MinimalProfile | null +} diff --git a/packages/authentication/modules/profile/useCurrentProfile/__tests__/__utils__/InitialProfileProvider/index.tsx b/packages/authentication/modules/profile/useCurrentProfile/__tests__/__utils__/InitialProfileProvider/index.tsx deleted file mode 100644 index 559c553c..00000000 --- a/packages/authentication/modules/profile/useCurrentProfile/__tests__/__utils__/InitialProfileProvider/index.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { FC, PropsWithChildren } from 'react' - -import { useHydrateAtoms } from 'jotai/utils' - -import { MinimalProfile } from '../../../../../../types/profile' -import { profileAtom } from '../../../index' - -export type InitialProfileProp = { - initialProfile: MinimalProfile | null -} - -// Use as: -// -// -// // You're component goes here, it is passed the initialProfile -// -// - -export const InitialProfileProvider: FC = ({ - initialProfile, - children, -}) => { - useHydrateAtoms([[profileAtom, initialProfile]]) - return children -} diff --git a/packages/authentication/modules/profile/useCurrentProfile/index.ts b/packages/authentication/modules/profile/useCurrentProfile/index.ts index 7abf4f64..7cda9312 100644 --- a/packages/authentication/modules/profile/useCurrentProfile/index.ts +++ b/packages/authentication/modules/profile/useCurrentProfile/index.ts @@ -27,6 +27,17 @@ const initialProfile = getProfileFromCookie() export const profileAtom = atom(initialProfile) +profileAtom.onMount = (setAtom) => { + const removeCurrentProfile = () => { + setAtom(null) + removeCookie(CURRENT_PROFILE_KEY) + } + eventEmitter.on(LOGOUT_EVENT, removeCurrentProfile) + return () => { + eventEmitter.off(LOGOUT_EVENT, removeCurrentProfile) + } +} + /** * By using `useCurrentProfile` with the `noSSR` option set to `false`, causes Next.js to dynamically render the affected pages, instead of statically rendering them. */ diff --git a/packages/authentication/package.json b/packages/authentication/package.json index 24fca136..20c41109 100644 --- a/packages/authentication/package.json +++ b/packages/authentication/package.json @@ -1,7 +1,7 @@ { "name": "@baseapp-frontend/authentication", "description": "Authentication modules.", - "version": "4.0.3", + "version": "4.0.4", "main": "./index.ts", "types": "dist/index.d.ts", "sideEffects": false, diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 9c4bed2c..859d9ce6 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -1,5 +1,13 @@ # @baseapp-frontend/components +## 0.0.25 + +### Patch Changes + +- Use `InitialProfileProviderForTesting`. +- Updated dependencies + - @baseapp-frontend/authentication@4.0.4 + ## 0.0.24 ### Patch Changes diff --git a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/CurrentUser/index.tsx b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/CurrentUser/index.tsx index d17d5da7..48210d5c 100644 --- a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/CurrentUser/index.tsx +++ b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/CurrentUser/index.tsx @@ -1,12 +1,12 @@ import { FC } from 'react' -import { User, useJWTUser } from '@baseapp-frontend/authentication' -import { JWTContent, joinWithSeparator } from '@baseapp-frontend/utils' +import { useJWTUser } from '@baseapp-frontend/authentication' +import { joinWithSeparator } from '@baseapp-frontend/utils' import { Box, Typography } from '@mui/material' const CurrentUser: FC = () => { - const { user } = useJWTUser() + const { user } = useJWTUser() if (!user) { return null diff --git a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/index.tsx b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/index.tsx index 9f54ab9e..84a55e41 100644 --- a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/index.tsx +++ b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/index.tsx @@ -1,6 +1,6 @@ import { FC } from 'react' -import { InitialProfileProp, InitialProfileProvider } from '@baseapp-frontend/authentication' +import { InitialProfileProviderForTesting } from '@baseapp-frontend/authentication' import { ThemeProvider } from '@baseapp-frontend/design-system' import { RelayTestProvider } from '@baseapp-frontend/graphql' import { NotificationProvider } from '@baseapp-frontend/utils' @@ -16,13 +16,9 @@ const queryClient = new QueryClient() const withProviders = (Component: FC) => - ({ - environment, - initialProfile, - ...props - }: WithProvidersOptions & AccountPopoverProps & InitialProfileProp) => ( + ({ environment, initialProfile, ...props }: WithProvidersOptions & AccountPopoverProps) => ( - + @@ -32,7 +28,7 @@ const withProviders = - + ) diff --git a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/types.ts b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/types.ts index aef60bb7..7af13035 100644 --- a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/types.ts +++ b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__tests__/__utils__/withProviders/types.ts @@ -1,5 +1,8 @@ +import type { MinimalProfile } from '@baseapp-frontend/authentication' + import type { RelayMockEnvironment } from 'relay-test-utils/lib/RelayModernMockEnvironment' export type WithProvidersOptions = { environment: RelayMockEnvironment + initialProfile: MinimalProfile | null } diff --git a/packages/components/package.json b/packages/components/package.json index d2048a03..ef1670b0 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,7 +1,7 @@ { "name": "@baseapp-frontend/components", "description": "BaseApp components modules such as comments, notifications, messages, and more.", - "version": "0.0.24", + "version": "0.0.25", "main": "./index.ts", "types": "dist/index.d.ts", "sideEffects": false,