diff --git a/src/components/Root/Root.tsx b/src/components/Root/Root.tsx index dd6846e97..5e9e460fd 100644 --- a/src/components/Root/Root.tsx +++ b/src/components/Root/Root.tsx @@ -1,7 +1,7 @@ import React, { FC, useEffect, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { useQuery } from 'react-query'; -import { Navigate, useLocation, useSearchParams } from 'react-router-dom'; +import { Navigate, useSearchParams } from 'react-router-dom'; import ErrorPage from '#components/ErrorPage/ErrorPage'; import AccountModal from '#src/containers/AccountModal/AccountModal'; @@ -27,7 +27,6 @@ const Root: FC = () => { }); const [searchParams, setSearchParams] = useSearchParams(); - const location = useLocation(); const configSource = useMemo(() => getConfigSource(searchParams, settingsQuery.data), [searchParams, settingsQuery.data]); @@ -69,10 +68,6 @@ const Root: FC = () => { return ; } - if (profilesEnabled && userData.user && !profile && !location.pathname.includes('/u/profiles')) { - return ; - } - if (settingsQuery.isError) { return ( { if (profilesEnabled && !profiles?.length) { unpersistProfile(); - navigate('/u/profiles'); } const selectProfile = useSelectProfile(); @@ -83,7 +82,7 @@ const UserMenu = ({ showPaymentsItem, small = false, onClick }: Props) => { )}
{t('nav.settings')}
- {profilesEnabled && ( + {profilesEnabled && currentProfile && (
  • { }); }; -export const useCreateProfile = () => { +export const useCreateProfile = (options?: UseMutationOptions | undefined, unknown, ProfilePayload, unknown>) => { const listProfiles = useListProfiles(); const navigate = useNavigate(); - return useMutation(createProfile, { + return useMutation | undefined, unknown, ProfilePayload, unknown>(createProfile, { onSuccess: (res) => { const profile = res?.responseData; if (profile?.id) { @@ -69,6 +69,7 @@ export const useCreateProfile = () => { navigate('/u/profiles'); } }, + ...options, }); }; @@ -103,7 +104,9 @@ export const useDeleteProfile = (options?: UseMutationOptions useQuery(['listProfiles'], listProfiles); +export const useListProfiles = ( + options?: UseQueryOptions | undefined, unknown, ServiceResponse | undefined, string[]>, +) => useQuery(['listProfiles'], listProfiles, { ...options }); export const useProfilesFeatureEnabled = (): boolean => { const canManageProfiles = useAccountStore((s) => s.canManageProfiles); diff --git a/src/pages/User/User.tsx b/src/pages/User/User.tsx index 42cf80230..03ca2c6a9 100644 --- a/src/pages/User/User.tsx +++ b/src/pages/User/User.tsx @@ -1,6 +1,6 @@ import { useCallback, useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { Navigate, Route, Routes, useNavigate } from 'react-router-dom'; +import { Navigate, Route, Routes, useLocation, useNavigate } from 'react-router-dom'; import shallow from 'zustand/shallow'; import styles from './User.module.scss'; @@ -40,6 +40,7 @@ const User = (): JSX.Element => { const { t } = useTranslation('user'); const breakpoint = useBreakpoint(); const [clearFavoritesOpen, setClearFavoritesOpen] = useState(false); + const location = useLocation(); const isLargeScreen = breakpoint > Breakpoint.md; const { user: customer, subscription, loading, canUpdateEmail } = useAccountStore(); @@ -47,6 +48,8 @@ const User = (): JSX.Element => { const profilesEnabled = useProfilesFeatureEnabled(); + const profileAndFavoritesPage = location.pathname?.includes('my-profile') || location.pathname.includes('favorites'); + const onCardClick = (playlistItem: PlaylistItem) => navigate(mediaURL({ media: playlistItem })); const onLogout = useCallback(async () => { // Empty customer on a user page leads to navigate (code bellow), so we don't repeat it here @@ -79,7 +82,7 @@ const User = (): JSX.Element => {
      - {accessModel === 'SVOD' && profilesEnabled && ( + {accessModel === 'SVOD' && profilesEnabled && profileAndFavoritesPage && (
    • )} -
    • -
    • - {favoritesList && ( + {(!profilesEnabled || !profileAndFavoritesPage) && ( +
    • +
    • + )} + {favoritesList && (!profilesEnabled || profileAndFavoritesPage) && (
    • )} - {accessModel !== 'AVOD' && ( + {accessModel !== 'AVOD' && (!profilesEnabled || !profileAndFavoritesPage) && (