diff --git a/apps/web/app/(main)/layout.tsx b/apps/web/app/(main)/layout.tsx index 942e3e4..700358a 100644 --- a/apps/web/app/(main)/layout.tsx +++ b/apps/web/app/(main)/layout.tsx @@ -1,14 +1,22 @@ +'use client'; + import { UpdateProfile } from '@/components/auth'; import { BottomNav } from '@/components/navigation'; +import { EmptyProvider } from '@/providers/empty'; import { TelegramProvider } from '@/providers/telegram'; +import { isTMA } from '@telegram-apps/sdk-react'; import { type PropsWithChildren } from 'react'; -export default async function Layout({ children }: Readonly) { +export default function Layout({ children }: Readonly) { + const isTG = isTMA('simple'); + + const Provider = isTG ? TelegramProvider : EmptyProvider; + return ( - +
{children}
-
+ ); } diff --git a/apps/web/components/navigation/header/index.tsx b/apps/web/components/navigation/header/index.tsx index 5a4c1c3..d7b6731 100644 --- a/apps/web/components/navigation/header/index.tsx +++ b/apps/web/components/navigation/header/index.tsx @@ -1,11 +1,21 @@ 'use client'; +import { BackButton } from './back-button'; +import { cn } from '@repo/ui/lib/utils'; +import { isTMA } from '@telegram-apps/sdk-react'; type Props = { title: string | undefined }; export function PageHeader(props: Readonly) { + const isTG = isTMA('simple'); + return ( -
- {/* */} +
+ {!isTG && } {props.title}
); diff --git a/apps/web/hooks/telegram/use-back-button.ts b/apps/web/hooks/telegram/use-back-button.ts index 403bba5..58238db 100644 --- a/apps/web/hooks/telegram/use-back-button.ts +++ b/apps/web/hooks/telegram/use-back-button.ts @@ -21,10 +21,12 @@ export function useBackButton() { }, [onBackClick]); useEffect(() => { - if (isRootLevelPage(pathname)) { - backButton.hide(); - } else { - backButton.show(); + if (backButton.isMounted()) { + if (isRootLevelPage(pathname)) { + backButton.hide(); + } else { + backButton.show(); + } } }, [pathname]); } diff --git a/apps/web/providers/empty.tsx b/apps/web/providers/empty.tsx new file mode 100644 index 0000000..077528c --- /dev/null +++ b/apps/web/providers/empty.tsx @@ -0,0 +1,5 @@ +import { type PropsWithChildren } from 'react'; + +export function EmptyProvider({ children }: Readonly) { + return <>{children}; +}