diff --git a/src/config/lexics/payment.tsx b/src/config/lexics/payment.tsx
index 40921115..a2eb9559 100644
--- a/src/config/lexics/payment.tsx
+++ b/src/config/lexics/payment.tsx
@@ -23,12 +23,14 @@ export const paymentLexics = {
order_received: 18365,
payment_date: 15603,
payment_method: 2010,
+ pb_instat: 18274,
save_sub: 18190,
still_cancel: 2646,
sub_not_renewed: 15060,
subscription_plan: 18182,
sum: 838,
thank_you: 6579,
+ thanks_for_sub: 18273,
unsubscribe: 18188,
using_payment: 18187,
watch_match: 18199,
diff --git a/src/config/pages.tsx b/src/config/pages.tsx
index 59536bb7..6234aa9b 100644
--- a/src/config/pages.tsx
+++ b/src/config/pages.tsx
@@ -6,6 +6,7 @@ export const PAGES = {
matomoInstatBaseUrl: 'https://matomo.instat.tv/',
player: '/players',
team: '/teams',
+ thanksForSubscribe: '/thanks-for-subscription',
tournament: '/tournaments',
useraccount: '/useraccount',
}
diff --git a/src/features/App/AuthenticatedApp.tsx b/src/features/App/AuthenticatedApp.tsx
index 406fe056..26ba2ccb 100644
--- a/src/features/App/AuthenticatedApp.tsx
+++ b/src/features/App/AuthenticatedApp.tsx
@@ -37,6 +37,8 @@ const TournamentPage = lazy(() => import('features/TournamentPage'))
const SystemSettings = lazy(() => import('features/SystemSettings'))
const HighlightsPage = lazy(() => import('pages/HighlightsPage'))
+const ThanksPage = lazy(() => import('pages/ThanksPage'))
+
export const AuthenticatedApp = () => {
useLexicsConfig(indexLexics)
return (
@@ -55,7 +57,6 @@ export const AuthenticatedApp = () => {
{ client.name === 'facr' ? : }
-
{/* в Switch как прямой children
можно рендерить только Route или Redirect */}
@@ -77,6 +78,9 @@ export const AuthenticatedApp = () => {
+
+
+
diff --git a/src/features/AuthStore/helpers.tsx b/src/features/AuthStore/helpers.tsx
index 95c01ecf..6b0e3575 100644
--- a/src/features/AuthStore/helpers.tsx
+++ b/src/features/AuthStore/helpers.tsx
@@ -17,7 +17,7 @@ interface Settings extends UserManagerSettings {
state?: string,
}
-const getClientNameByRedirectUri = () => {
+export const getClientNameByRedirectUri = () => {
switch (client.name) {
case ClientNames.Lff:
return 'lff.instat'
diff --git a/src/features/BuyMatchPopup/index.tsx b/src/features/BuyMatchPopup/index.tsx
index b0d339d7..b8efaa2d 100644
--- a/src/features/BuyMatchPopup/index.tsx
+++ b/src/features/BuyMatchPopup/index.tsx
@@ -30,6 +30,13 @@ export const BuyMatchPopup = () => {
const Step = components[currentStep]
+ // eslint-disable-next-line
+ window.onmessage = function (event) {
+ if (event.data === 'close') {
+ close()
+ }
+ }
+
return (
(
+
+)
diff --git a/src/pages/ThanksPage/index.tsx b/src/pages/ThanksPage/index.tsx
new file mode 100644
index 00000000..95181ba3
--- /dev/null
+++ b/src/pages/ThanksPage/index.tsx
@@ -0,0 +1,37 @@
+import { Icon } from 'features/Icon'
+import { T9n } from 'features/T9n'
+
+import {
+ ScWrapper,
+ ScLogo,
+ ScTitle,
+ ScText,
+ ScButton,
+ ScBody,
+} from './styled'
+
+const ThanksPage = () => {
+ const onClose = () => {
+ window.parent.postMessage('close')
+ }
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
+
+export default ThanksPage
diff --git a/src/pages/ThanksPage/styled.tsx b/src/pages/ThanksPage/styled.tsx
new file mode 100644
index 00000000..3fb31c4f
--- /dev/null
+++ b/src/pages/ThanksPage/styled.tsx
@@ -0,0 +1,108 @@
+import styled, { css } from 'styled-components/macro'
+
+import { isMobileDevice } from 'config/userAgent'
+
+import { Logo } from 'features/Logo'
+import { ButtonSolid } from 'features/Common'
+
+export const ScWrapper = styled.div`
+ background: #333333;
+ min-width: 100%;
+ min-height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+`
+
+export const ScBody = styled.div`
+ background: #333333;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ padding: 90px 178px 140px;
+
+ ${isMobileDevice
+ ? css`
+ padding: 20px;
+ `
+ : ''};
+
+ > * {
+ margin: 30px 0;
+
+ ${isMobileDevice
+ ? css`
+ margin: 20px 0;
+ `
+ : ''};
+ }
+`
+
+export const ScLogo = styled(Logo)`
+ height: 43px;
+ width: 184px;
+ filter: brightness(0.5);
+
+ ${isMobileDevice
+ ? css`
+ height: 30px;
+ width: 130px;
+ `
+ : ''};
+`
+
+export const ScTitle = styled.span`
+ font-weight: 700;
+ font-size: 34px;
+ line-height: 39px;
+ color: #ffffff;
+ text-align: center;
+
+ ${isMobileDevice
+ ? css`
+ font-weight: 700;
+ font-size: 18px;
+ line-height: 25px;
+ `
+ : ''};
+`
+
+export const ScText = styled.span`
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 28px;
+ color: #ffffff;
+ text-align: center;
+
+ ${isMobileDevice
+ ? css`
+ font-weight: 500;
+ font-size: 16px;
+ line-height: 10px;
+ `
+ : ''};
+`
+
+export const ScButton = styled(ButtonSolid)`
+ min-width: 236px;
+ width: auto;
+ height: 50px;
+ background-color: ${({ theme: { colors } }) => colors.button};
+ color: ${({ theme: { colors } }) => colors.white};
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
+ border-radius: 5px;
+ font-weight: 600;
+ font-size: 20px;
+ ${isMobileDevice
+ ? css`
+ height: 50px;
+ min-width: 300px;
+ font-size: 16px;
+ `
+ : ''};
+
+ :disabled {
+ opacity: 0.5;
+ }
+`
diff --git a/src/requests/getBrazilPaymentUrl.tsx b/src/requests/getBrazilPaymentUrl.tsx
index 7cb4a077..50fb15ab 100644
--- a/src/requests/getBrazilPaymentUrl.tsx
+++ b/src/requests/getBrazilPaymentUrl.tsx
@@ -1,5 +1,8 @@
-import { API_ROOT } from 'config'
+import { API_ROOT, PAGES } from 'config'
+import { getClientNameByRedirectUri } from 'features/AuthStore/helpers'
+
import { callApi } from 'helpers'
+
import type { SubscriptionResponse } from 'requests/getSubscriptions'
type Props = {
@@ -13,6 +16,7 @@ export const getBrazilPaymentUrl = async ({ item, product_name }: Props) => {
action: 'create_subscription',
data: {
item: { ...item, product_name },
+ url_return: `https://${getClientNameByRedirectUri()}.tv${PAGES.thanksForSubscribe}}`,
},
service: 'pag_brasil',
},