diff --git a/public/sounds/1.mp3 b/public/sounds/1.mp3 new file mode 100644 index 00000000..04a59c93 Binary files /dev/null and b/public/sounds/1.mp3 differ diff --git a/public/sounds/basement by monako Artlist.mp3 b/public/sounds/basement by monako Artlist.mp3 new file mode 100644 index 00000000..582737ff Binary files /dev/null and b/public/sounds/basement by monako Artlist.mp3 differ diff --git a/public/sounds/buss-it---instrumental-version by yarin-primak Artlist.mp3 b/public/sounds/buss-it---instrumental-version by yarin-primak Artlist.mp3 new file mode 100644 index 00000000..af34dc67 Binary files /dev/null and b/public/sounds/buss-it---instrumental-version by yarin-primak Artlist.mp3 differ diff --git a/public/sounds/cant-stop-me-now-instrumental-brightout-musicbed-licensed.mp3 b/public/sounds/cant-stop-me-now-instrumental-brightout-musicbed-licensed.mp3 new file mode 100644 index 00000000..b2e2193b Binary files /dev/null and b/public/sounds/cant-stop-me-now-instrumental-brightout-musicbed-licensed.mp3 differ diff --git a/public/sounds/follow-me-shyghy-musicbed-licensed.mp3 b/public/sounds/follow-me-shyghy-musicbed-licensed.mp3 new file mode 100644 index 00000000..30b9fbba Binary files /dev/null and b/public/sounds/follow-me-shyghy-musicbed-licensed.mp3 differ diff --git a/public/sounds/gravity by stanley-gurvich Artlist.mp3 b/public/sounds/gravity by stanley-gurvich Artlist.mp3 new file mode 100644 index 00000000..5fe457a9 Binary files /dev/null and b/public/sounds/gravity by stanley-gurvich Artlist.mp3 differ diff --git a/public/sounds/light-it-up-instrumental-bloom-the-bliss-musicbed-licensed.mp3 b/public/sounds/light-it-up-instrumental-bloom-the-bliss-musicbed-licensed.mp3 new file mode 100644 index 00000000..b25dbef6 Binary files /dev/null and b/public/sounds/light-it-up-instrumental-bloom-the-bliss-musicbed-licensed.mp3 differ diff --git a/public/sounds/living-future-memories-generdyn-musicbed-licensed.mp3 b/public/sounds/living-future-memories-generdyn-musicbed-licensed.mp3 new file mode 100644 index 00000000..d464529f Binary files /dev/null and b/public/sounds/living-future-memories-generdyn-musicbed-licensed.mp3 differ diff --git a/public/sounds/look-at-me-now-instrumental-paper-kings-musicbed-licensed.mp3 b/public/sounds/look-at-me-now-instrumental-paper-kings-musicbed-licensed.mp3 new file mode 100644 index 00000000..de57fbc2 Binary files /dev/null and b/public/sounds/look-at-me-now-instrumental-paper-kings-musicbed-licensed.mp3 differ diff --git a/public/sounds/unbroken-roary-musicbed-licensed.mp3 b/public/sounds/unbroken-roary-musicbed-licensed.mp3 new file mode 100644 index 00000000..de16b506 Binary files /dev/null and b/public/sounds/unbroken-roary-musicbed-licensed.mp3 differ diff --git a/src/components/AudioPlayer/index.tsx b/src/components/AudioPlayer/index.tsx index c9ce80ce..72741001 100644 --- a/src/components/AudioPlayer/index.tsx +++ b/src/components/AudioPlayer/index.tsx @@ -9,10 +9,10 @@ type AudioPropsType = { } export const AudioPlayer = ({ url }: AudioPropsType) => { - const { toggle } = useAudioPlayer(url) + const { playing, toggle } = useAudioPlayer(url) return ( - + ) diff --git a/src/components/AudioPlayer/styled.tsx b/src/components/AudioPlayer/styled.tsx index a317d5b2..cf4ca945 100644 --- a/src/components/AudioPlayer/styled.tsx +++ b/src/components/AudioPlayer/styled.tsx @@ -1,4 +1,6 @@ import styled from 'styled-components/macro' -export const ScAudioContainer = styled.div` +export const ScAudioContainer = styled.div<{ playing: boolean }>` + opacity: ${({ playing }) => (playing ? 1 : 0.5)}; + color: ${({ playing }) => (playing ? 'white' : '')}; ` diff --git a/src/features/AddCardForm/components/Form/hooks/index.tsx b/src/features/AddCardForm/components/Form/hooks/index.tsx index 6d3b6b7d..89a7780e 100644 --- a/src/features/AddCardForm/components/Form/hooks/index.tsx +++ b/src/features/AddCardForm/components/Form/hooks/index.tsx @@ -24,6 +24,7 @@ import { useObjectState } from 'hooks' import { useCardsStore } from 'features/CardsStore' import { useLexicsStore } from 'features/LexicsStore' +import { useBuyMatchPopupStore } from 'features/BuyMatchPopup/store' import { dataForPayHighlights } from 'pages/HighlightsPage/storeHighlightsAtoms' @@ -86,6 +87,7 @@ export const useFormSubmit = ({ onAddSuccess }: Props) => { const [errorMessage, setErrorMessage] = useState('') const [loader, setLoader] = useState(false) const [dataHighlights, setDataHighlights] = useRecoilState(dataForPayHighlights) + const { onConfirmationSuccess, onUnsuccessfulSubscription } = useBuyMatchPopupStore() const { countries, @@ -184,6 +186,7 @@ export const useFormSubmit = ({ onAddSuccess }: Props) => { cardId: defaultCard?.id, order: { ...dataHighlights?.data }, }) + .then(() => onConfirmationSuccess, onUnsuccessfulSubscription) .then(() => { setDataHighlights((prev) => ({ ...prev, @@ -227,13 +230,14 @@ export const useFormSubmit = ({ onAddSuccess }: Props) => { setLoader(true) onAddCard(token.id) .then(onAddSuccess) - .then(() => setInputStates(initialState)) + .then(() => defaultCard && isHighlightsPage && setInputStates(initialState)) .then(() => { - if (defaultCard) { + if (defaultCard && isHighlightsPage) { onePayment({ cardId: defaultCard.id, order: { ...dataHighlights?.data }, }) + // .then(notifySuccessfulSubscription) .then(() => { setDataHighlights((prev) => ({ ...prev, diff --git a/src/features/BuyMatchPopup/store/hooks/index.tsx b/src/features/BuyMatchPopup/store/hooks/index.tsx index 7200bc9d..a362c7cb 100644 --- a/src/features/BuyMatchPopup/store/hooks/index.tsx +++ b/src/features/BuyMatchPopup/store/hooks/index.tsx @@ -131,7 +131,7 @@ export const useBuyMatchPopup = () => { const onConfirmationSuccess = ({ id }: PaymentIntent) => { if (!selectedPackage) return - const item = selectedPackage.originalObject + const item = selectedPackage?.originalObject notifySuccessfulSubscription({ item, paymentIntentId: id }) .then(onSuccessfulSubscription, goToError) } @@ -189,10 +189,12 @@ export const useBuyMatchPopup = () => { match, matchSubscriptions, onBuyClick, + onConfirmationSuccess, onNext, onPackageSelect, onPeriodSelect, onSubscriptionSelect, + onUnsuccessfulSubscription, open: openPopup, postPaymentHandler, selectedPackage, diff --git a/src/features/Combobox/index.tsx b/src/features/Combobox/index.tsx index 679b0f27..3836aa75 100644 --- a/src/features/Combobox/index.tsx +++ b/src/features/Combobox/index.tsx @@ -121,7 +121,7 @@ export const Combobox = (props: Props) => { {option.name} {option?.src ? ( - + ) : ''} diff --git a/src/features/Combobox/styled.tsx b/src/features/Combobox/styled.tsx index 80056dc0..c05bd2b4 100644 --- a/src/features/Combobox/styled.tsx +++ b/src/features/Combobox/styled.tsx @@ -49,7 +49,7 @@ export const ListOption = styled.li.attrs(() => ({ color: #fff; } ` -export const WrapperIcon = styled.div` +export const WrapperIcon = styled.span` position: absolute; right: 22px; top: 50%; diff --git a/src/features/Common/Input/styled.tsx b/src/features/Common/Input/styled.tsx index 8af4268c..06385fd0 100644 --- a/src/features/Common/Input/styled.tsx +++ b/src/features/Common/Input/styled.tsx @@ -186,7 +186,7 @@ export const Error = styled(T9n)` : '' )} ` -export const LabelAfter = styled.p` +export const LabelAfter = styled.span` font-style: normal; font-weight: normal; white-space: nowrap; diff --git a/src/features/UserAccount/components/ChangeCardPopup/index.tsx b/src/features/UserAccount/components/ChangeCardPopup/index.tsx index 564ae87b..fd0c055f 100644 --- a/src/features/UserAccount/components/ChangeCardPopup/index.tsx +++ b/src/features/UserAccount/components/ChangeCardPopup/index.tsx @@ -8,6 +8,7 @@ import { Modal } from './styled' type Props = { btnName?: string, changeCardPopupOpen: boolean, + closeButton?: boolean, setChangeCardPopupOpen: (open: boolean) => void, title?: string, } @@ -15,6 +16,7 @@ type Props = { export const ChangeCardPopup = ({ btnName, changeCardPopupOpen, + closeButton, setChangeCardPopupOpen, title, }: Props) => { @@ -29,7 +31,7 @@ export const ChangeCardPopup = ({ setChangeCardPopupOpen(false)} - withCloseButton + withCloseButton={closeButton} > { const { playerHighlight } = useUserFavoritesStore() @@ -98,7 +174,7 @@ export const useHighlightsForm = () => { const [teams, setTeams] = useState>([]) const [playersData, setPlayersData] = useState>([]) const [players, setPlayers] = useState>([]) - const [formState, setFormState] = useState({} as FormType) + const [formState, setFormState] = useState(defaultValues) const [playerMatches, setPlayerMatches] = useRecoilState(playerMatchesState) const setDatahighlights = useSetRecoilState(dataForPayHighlights) @@ -193,13 +269,20 @@ export const useHighlightsForm = () => { useEffect(() => { getSportList() .then((res) => setSports( - res?.map((sport: SportType) => ({ - ...sport, - name: sport?.name_eng, - })), + res + ?.filter((sport: SportType) => sport.id === 3) + .map((sport: SportType) => ({ + ...sport, + name: sport?.name_eng, + })), )) }, []) + useEffect(() => { + onSportSelect(sports[0]) + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [sports]) + useEffect(() => { if (playerHighlight?.sportType && playerHighlight?.profile) { setFormState((state: any) => ({ @@ -215,7 +298,7 @@ export const useHighlightsForm = () => { }, [sports, playerHighlight, teams]) const fetchTeams = useMemo( - () => debounce(() => getSportTeams( + () => debounce(() => formState?.sport?.id && getSportTeams( formState?.sport?.id, -1, formState.teamValue, diff --git a/src/pages/HighlightsPage/components/FormHighlights/index.tsx b/src/pages/HighlightsPage/components/FormHighlights/index.tsx index 21b2cc60..fd6ec2b8 100644 --- a/src/pages/HighlightsPage/components/FormHighlights/index.tsx +++ b/src/pages/HighlightsPage/components/FormHighlights/index.tsx @@ -21,7 +21,7 @@ import { import { PriceInfoType, PriceInfo } from '../PriceInfo' -const labelWidth = 190 +const labelWidth = 100 const wrapperHeight = 50 export const FormHighlights = ({ price }: PriceInfoType) => { @@ -117,6 +117,7 @@ export const FormHighlights = ({ price }: PriceInfoType) => { /> { label={( - {date} + {format(new Date(date), 'd MMM yyyy H:mm')}   {team1.name_eng} - {team2.name_eng} @@ -67,7 +68,7 @@ export const MatchesHighlights = () => { )} /> ))) : (Array.from(Array(12)).map(() => ( - + diff --git a/src/pages/HighlightsPage/components/ThanksPopup/index.tsx b/src/pages/HighlightsPage/components/ThanksPopup/index.tsx index aebcffab..8f9bd4f4 100644 --- a/src/pages/HighlightsPage/components/ThanksPopup/index.tsx +++ b/src/pages/HighlightsPage/components/ThanksPopup/index.tsx @@ -33,7 +33,7 @@ export const ThanksPopup = () => { { setDataHighlights({ ...dataHighlights, isOpenThanksPopup: false }) - window.location.reload() + window.location.href = '/' }} > Ok diff --git a/src/pages/HighlightsPage/index.tsx b/src/pages/HighlightsPage/index.tsx index b6a72cd5..18f4ac3d 100644 --- a/src/pages/HighlightsPage/index.tsx +++ b/src/pages/HighlightsPage/index.tsx @@ -3,6 +3,8 @@ import { Link } from 'react-router-dom' import { isMobileDevice } from 'config/userAgent' import { PAGES } from 'config' +import { isBoolean } from 'lodash' + import { useRecoilValue, useRecoilState } from 'recoil' import { T9n } from 'features/T9n' @@ -40,7 +42,8 @@ const HighlightsPage = () => { || !data?.player_id || !data?.sport_id || !data?.matches.length - || !data?.stats + || !isBoolean(data?.stats) + || data?.matches.length > 10 const price = playerMatches?.filter( ({ isChecked }: MatchType) => isChecked, @@ -72,6 +75,7 @@ const HighlightsPage = () => { changeCardPopupOpen={isOpenPopupChangeCard} setChangeCardPopupOpen={setIsOpenPopupChangeCard} title='payment' + closeButton={false} /> diff --git a/src/requests/buySubscription/notifySuccessfulSubscription.tsx b/src/requests/buySubscription/notifySuccessfulSubscription.tsx index 0e3f782c..d9a97de2 100644 --- a/src/requests/buySubscription/notifySuccessfulSubscription.tsx +++ b/src/requests/buySubscription/notifySuccessfulSubscription.tsx @@ -4,7 +4,7 @@ import { callApi } from 'helpers' import type { SubscriptionResponse } from '../getSubscriptions' type Args = { - item: SubscriptionResponse, + item?: SubscriptionResponse, paymentIntentId: string, }