diff --git a/src/components/BreathPage/index.tsx b/src/components/BreathPage/index.tsx index e88152e..fc1319f 100644 --- a/src/components/BreathPage/index.tsx +++ b/src/components/BreathPage/index.tsx @@ -13,11 +13,12 @@ import routes from "@/routes"; import parseAPNG from "apng-js"; import Player from "apng-js/types/library/player"; +let apngPlayer: Player | null = null; + function BreathPage(): JSX.Element { const { t } = useTranslation(); const [isOpenModal, setIsOpenModal] = useState(true); const [isShowPreview, setIsShowPreview] = useState(true); - const [apngPlayer, setApngPlayer] = useState(); const leoCanvasRef = useRef(null); const pageRef = useRef(null); const api = useApi(); @@ -37,7 +38,7 @@ function BreathPage(): JSX.Element { if (isOpenModal) return; const previewTimeOut = setTimeout(() => { setIsShowPreview(false); - apngPlayer?.play() + apngPlayer?.play(); }, 10_000); const navigateTimeOut = setTimeout(() => { @@ -51,7 +52,7 @@ function BreathPage(): JSX.Element { }, [navigate, isOpenModal]); useEffect(() => { - async function test() { + async function getApng() { if (!data) return; const response = await fetch( data.find((item) => item.key === "au.apng.leo")?.url || "" @@ -63,13 +64,13 @@ function BreathPage(): JSX.Element { context.canvas.height = apng.height; context.canvas.width = apng.width; const _apngPlayer = await apng.getPlayer(context); - setApngPlayer(_apngPlayer); + apngPlayer = _apngPlayer; if (apngPlayer) { apngPlayer.stop(); } } } - test(); + getApng(); }, [data]); const beginBreath = () => { @@ -115,16 +116,14 @@ function BreathPage(): JSX.Element { return ( <> -
+
- + > {!isOpenModal && isShowPreview && (
+ <Header showCross={true} clickCross={() => navigate(routes.client.home())} /> <UserHeader email={email} /> <section className='page'> { isLoading ? <Loader /> : ( diff --git a/src/components/PaymentTable/styles.css b/src/components/PaymentTable/styles.css index 4dfc6b4..0bfd7f6 100644 --- a/src/components/PaymentTable/styles.css +++ b/src/components/PaymentTable/styles.css @@ -56,4 +56,5 @@ .payment__information { font-size: 12px; line-height: 1.5; + text-align: center; } \ No newline at end of file diff --git a/src/components/PriceList/index.tsx b/src/components/PriceList/index.tsx index 372874f..c9ef19c 100644 --- a/src/components/PriceList/index.tsx +++ b/src/components/PriceList/index.tsx @@ -33,9 +33,9 @@ interface PriceListProps { click: () => void } -function PriceList({click, activeItem}: PriceListProps): JSX.Element { +function PriceList({click}: PriceListProps): JSX.Element { const dispatch = useDispatch(); - const [activePriceItem, setActivePriceItem] = useState<number | null>(activeItem) + const [activePriceItem, setActivePriceItem] = useState<number | null>(null) const priceItemClick = (id: number) => { console.log(id); diff --git a/src/components/PriceListPage/index.tsx b/src/components/PriceListPage/index.tsx index 544221b..554bc6d 100644 --- a/src/components/PriceListPage/index.tsx +++ b/src/components/PriceListPage/index.tsx @@ -31,7 +31,7 @@ function PriceListPage(): JSX.Element { <UserHeader email={email} /> <section className={`${styles.page} page`}> <Title className={styles.title} variant='h2'>{t('choose_your_own_fee')} -

{t('should_not_get', { strongText: {t('aura.web.price_selection')} })}

+

{t('aura.web.price_selection')}

diff --git a/src/routes.ts b/src/routes.ts index 9554be7..30e83d8 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -118,6 +118,7 @@ export const hasNoFooter = (path: string) => export const withoutHeaderRoutes = [ routes.client.compatibility(), routes.client.subscription(), + routes.client.paymentMethod(), ]; export const hasNoHeader = (path: string) => !withoutHeaderRoutes.includes(path);