From 62281019f15290902d6d0db48c45feefdf140c0b Mon Sep 17 00:00:00 2001 From: Andrei Dekterev Date: Thu, 26 Jan 2023 23:06:32 +0700 Subject: [PATCH] fix(#242): add return to start page with buypoup --- src/features/AuthStore/hooks/useAuth.tsx | 6 +- .../components/PackageSelectionStep/index.tsx | 65 +++++++++++-------- .../components/SelectSubscription/index.tsx | 2 +- src/features/BuyMatchPopup/store/helpers.tsx | 4 +- .../BuyMatchPopup/store/hooks/index.tsx | 6 +- src/features/BuyMatchPopup/styled.tsx | 2 +- .../components/SubscriptionGuard/index.tsx | 6 +- .../getMatchClickAction/__tests__/index.tsx | 14 ++-- .../helpers/getMatchClickAction/index.tsx | 3 +- src/helpers/openSubscribePopup/index.tsx | 4 +- 10 files changed, 66 insertions(+), 46 deletions(-) diff --git a/src/features/AuthStore/hooks/useAuth.tsx b/src/features/AuthStore/hooks/useAuth.tsx index d9b10b6f..4d0a4542 100644 --- a/src/features/AuthStore/hooks/useAuth.tsx +++ b/src/features/AuthStore/hooks/useAuth.tsx @@ -141,7 +141,7 @@ export const useAuth = () => { if (page.includes(PAGES.useraccount)) { history.push(PAGES.home) } else { - const route = `${page}${page === '/' ? search : ''}` + const route = `${page}${search}` history.push(route) } markUserLoaded() @@ -204,11 +204,11 @@ export const useAuth = () => { // ]) useEffect(() => { + // попытаемся обновить токен используя refresh_token const tryRenewToken = () => { userManager.signinSilent() .catch(() => user && logout()) } - // попытаемся обновить токен используя refresh_token // если запросы вернули 401 | 403 window.addEventListener('FORBIDDEN_REQUEST', tryRenewToken) @@ -250,6 +250,7 @@ export const useAuth = () => { loadingUser, login, logout, + setSearch, setUserInfo, user, userInfo, @@ -261,6 +262,7 @@ export const useAuth = () => { userInfo, login, loadingUser, + setSearch, setUserInfo, ]) diff --git a/src/features/BuyMatchPopup/components/PackageSelectionStep/index.tsx b/src/features/BuyMatchPopup/components/PackageSelectionStep/index.tsx index b7e23456..07149645 100644 --- a/src/features/BuyMatchPopup/components/PackageSelectionStep/index.tsx +++ b/src/features/BuyMatchPopup/components/PackageSelectionStep/index.tsx @@ -12,8 +12,6 @@ import { MDASH } from 'config' import { payments } from 'config/payments' import { client } from 'config/clients' -import { isSubscribePopup } from 'helpers' - import { CountryCodeType, getCountryCode } from 'requests/getCountryCode' import { CloseButton, HeaderActions } from 'features/PopupComponents' @@ -22,6 +20,7 @@ import { Name } from 'features/Name' import { useCardsStore } from 'features/CardsStore' import { ArrowLoader } from 'features/ArrowLoader' import { Arrow } from 'features/HeaderFilters/components/DateFilter/styled' +import { useAuthStore } from 'features/AuthStore' import { IframePayment } from '../IframePayment' @@ -45,6 +44,11 @@ export const PackageSelectionStep = () => { } = useCardsStore() const [isOpenIframe, setIsOpenIframe] = useState(false) const [countryCode, setCountryCode] = useState(null) + const { + logout, + setSearch, + user, + } = useAuthStore() const { close, @@ -109,32 +113,30 @@ export const PackageSelectionStep = () => { return ( - {!isSubscribePopup - && ( -
- {hasPreviousStep && ( - - - - - - )} - - {hasPreviousStep && selectedSubscription ? ( - - ) : ( - - - {` ${MDASH} `} - - - )} - - - - -
+ +
+ {hasPreviousStep && ( + + + + + + )} + + {hasPreviousStep && selectedSubscription ? ( + + ) : ( + + + {` ${MDASH} `} + + )} + + + + +
{!isIframePayment && } @@ -145,7 +147,14 @@ export const PackageSelectionStep = () => { ) : ( diff --git a/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx b/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx index 66c542db..0457c888 100644 --- a/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx +++ b/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx @@ -57,7 +57,7 @@ export const SelectSubscriptionStep = () => { return (
- {!isSubscribePopup + {!isSubscribePopup() && ( diff --git a/src/features/BuyMatchPopup/store/helpers.tsx b/src/features/BuyMatchPopup/store/helpers.tsx index cf89faef..33480d7d 100644 --- a/src/features/BuyMatchPopup/store/helpers.tsx +++ b/src/features/BuyMatchPopup/store/helpers.tsx @@ -9,6 +9,8 @@ import type { Season, } from 'requests/getSubscriptions' +import { isSubscribePopup } from 'helpers' + import { getName } from 'features/Name' import type { @@ -101,7 +103,7 @@ const transformPackages = ({ [SubscriptionType.Month]: transformByType(SubscriptionType.Month), [SubscriptionType.Year]: transformByType(SubscriptionType.Year), [SubscriptionType.PayPerView]: - payPerView + payPerView && !isSubscribePopup() ? [{ currency: currencySymbols[payPerView.currency_iso], description: { diff --git a/src/features/BuyMatchPopup/store/hooks/index.tsx b/src/features/BuyMatchPopup/store/hooks/index.tsx index 7a30864c..4de6393c 100644 --- a/src/features/BuyMatchPopup/store/hooks/index.tsx +++ b/src/features/BuyMatchPopup/store/hooks/index.tsx @@ -113,6 +113,10 @@ export const useBuyMatchPopup = () => { setError('') resetSubscriptions() setSelectedPackage(null) + + if (isSubscribePopup()) { + history.replace({ search: '' }) + } } const redirectToMatchProfile = ({ id, sportType }: Match) => { @@ -127,7 +131,7 @@ export const useBuyMatchPopup = () => { const onSuccessfulSubscription = () => goTo(Steps.Success) const postPaymentHandler = () => { if (!match) return - if (!isSubscribePopup) { + if (!isSubscribePopup()) { redirectToMatchProfile(match) } closePopup() diff --git a/src/features/BuyMatchPopup/styled.tsx b/src/features/BuyMatchPopup/styled.tsx index 48c6e6c5..3151c037 100644 --- a/src/features/BuyMatchPopup/styled.tsx +++ b/src/features/BuyMatchPopup/styled.tsx @@ -8,7 +8,7 @@ import { Modal as BaseModal } from 'features/Modal' export const Modal = styled(BaseModal)` background-color: rgba(0, 0, 0, 0.7); - + z-index: 52; ${ModalWindow} { padding: 0; background-color: #333333; diff --git a/src/features/MatchPage/components/SubscriptionGuard/index.tsx b/src/features/MatchPage/components/SubscriptionGuard/index.tsx index 9c502d0a..68e8494d 100644 --- a/src/features/MatchPage/components/SubscriptionGuard/index.tsx +++ b/src/features/MatchPage/components/SubscriptionGuard/index.tsx @@ -22,9 +22,9 @@ export const SubscriptionGuard = ({ children }: Props) => { const { user } = useAuthStore() useEffect(() => { - if (user && matchProfile && ( - !matchProfile.sub - || isSubscribePopup)) { + if ((user && matchProfile + && !matchProfile.sub) + || (matchProfile && isSubscribePopup())) { const profile = prepareMatchProfile({ matchId, profile: matchProfile, diff --git a/src/features/Matches/helpers/getMatchClickAction/__tests__/index.tsx b/src/features/Matches/helpers/getMatchClickAction/__tests__/index.tsx index 176f9500..eff2f50c 100644 --- a/src/features/Matches/helpers/getMatchClickAction/__tests__/index.tsx +++ b/src/features/Matches/helpers/getMatchClickAction/__tests__/index.tsx @@ -16,13 +16,15 @@ const createMatch = (args: Args) => ({ ...args, } as Match) +const user = undefined + it('equals to no country access type', () => { const match = createMatch({ access: false, sub: false, }) - expect(getMatchAccess(match)).toBe(MatchAccess.CanBuyMatch) + expect(getMatchAccess(match, user)).toBe(MatchAccess.ViewMatchPopupWithoutUser) }) it('equals to redirect type', () => { @@ -34,7 +36,7 @@ it('equals to redirect type', () => { sub: true, }) - expect(getMatchAccess(match)).toBe(MatchAccess.RedirectToProfile) + expect(getMatchAccess(match, user)).toBe(MatchAccess.ViewMatchPopupWithoutUser) }) it('equals to can buy type', () => { @@ -43,7 +45,7 @@ it('equals to can buy type', () => { sub: false, }) - expect(getMatchAccess(match)).toBe(MatchAccess.CanBuyMatch) + expect(getMatchAccess(match, user)).toBe(MatchAccess.ViewMatchPopupWithoutUser) }) it('equals to view match popup type', () => { @@ -54,7 +56,7 @@ it('equals to view match popup type', () => { sub: true, }) - expect(getMatchAccess(match)).toBe(MatchAccess.ViewMatchPopup) + expect(getMatchAccess(match, user)).toBe(MatchAccess.ViewMatchPopupWithoutUser) match = createMatch({ access: true, @@ -65,7 +67,7 @@ it('equals to view match popup type', () => { sub: true, }) - expect(getMatchAccess(match)).toBe(MatchAccess.RedirectToProfile) + expect(getMatchAccess(match, user)).toBe(MatchAccess.ViewMatchPopupWithoutUser) match = createMatch({ access: true, @@ -77,5 +79,5 @@ it('equals to view match popup type', () => { sub: true, }) - expect(getMatchAccess(match)).toBe(MatchAccess.ViewMatchPopup) + expect(getMatchAccess(match, user)).toBe(MatchAccess.NoAccess) }) diff --git a/src/features/Matches/helpers/getMatchClickAction/index.tsx b/src/features/Matches/helpers/getMatchClickAction/index.tsx index 6f038e27..9a799281 100644 --- a/src/features/Matches/helpers/getMatchClickAction/index.tsx +++ b/src/features/Matches/helpers/getMatchClickAction/index.tsx @@ -2,6 +2,7 @@ import type { Match } from 'requests' import type { User } from 'oidc-client' import { isFuture } from 'date-fns' +import { isSubscribePopup } from '../../../../helpers' export enum MatchAccess { CanBuyMatch = 'CanBuyMatch', @@ -28,7 +29,7 @@ export const getMatchAccess = (match: Match, user: User | undefined) => { switch (true) { case !user && isFutureDate: return MatchAccess.NoAccess - case !user: + case !user && !isSubscribePopup(): return MatchAccess.ViewMatchPopupWithoutUser case !sub: return MatchAccess.CanBuyMatch diff --git a/src/helpers/openSubscribePopup/index.tsx b/src/helpers/openSubscribePopup/index.tsx index 838f8a8d..b00bdda6 100644 --- a/src/helpers/openSubscribePopup/index.tsx +++ b/src/helpers/openSubscribePopup/index.tsx @@ -17,7 +17,7 @@ export const openSubscribePopup = ({ matchConfig, openBuyMatchPopup, }: openSubscribePopupType) => { - if (isSubscribePopup) { + if (isSubscribePopup()) { getMatchInfo(matchConfig.sportId, matchConfig.matchId) .then((match: MatchInfo) => { const matchProfile = match && prepareMatchProfile({ @@ -30,4 +30,4 @@ export const openSubscribePopup = ({ } } -export const isSubscribePopup = checkUrlParams('subscribe') && getAllUrlParams('id').length +export const isSubscribePopup = () => checkUrlParams('subscribe') && getAllUrlParams('id').length