diff --git a/apps/web/app/(auth)/browser/page.tsx b/apps/web/app/(auth)/browser/page.tsx
new file mode 100644
index 0000000..0599986
--- /dev/null
+++ b/apps/web/app/(auth)/browser/page.tsx
@@ -0,0 +1,42 @@
+/* eslint-disable promise/prefer-await-to-then */
+'use client';
+import { getTelegramUser } from '@/mocks/get-telegram-user';
+import { signIn, useSession } from 'next-auth/react';
+import { redirect } from 'next/navigation';
+import { useEffect } from 'react';
+
+export default function Auth() {
+ const { data: session, status } = useSession();
+
+ useEffect(() => {
+ if (status === 'authenticated') {
+ redirect('/profile');
+ }
+
+ if (status === 'unauthenticated' && process.env.NODE_ENV === 'development') {
+ getTelegramUser().then((user) => {
+ signIn('telegram', {
+ callbackUrl: '/profile',
+ redirect: false,
+ telegramId: String(user?.id),
+ });
+ });
+ }
+ }, [status]);
+
+ if (status === 'loading') {
+ return Loading Browser Auth...
;
+ }
+
+ return (
+
+ {session ? (
+
+ Browser Hello, {JSON.stringify(session)}
+
+ ) : (
+
Not authenticated
+ )}
+
Loading Auth...
;
- }
-
- return (
-
- {session ? (
-
- Hello, {JSON.stringify(session)}
- Dark: {JSON.stringify(isDark)}
-
- ) : (
-
Not authenticated
- )}
-
{isTG ? 'Telegram Mode' : 'Browser Mode'}
;
}
diff --git a/apps/web/app/(auth)/layout.tsx b/apps/web/app/(auth)/telegram/layout.tsx
similarity index 64%
rename from apps/web/app/(auth)/layout.tsx
rename to apps/web/app/(auth)/telegram/layout.tsx
index 6225cd2..eed2cc2 100644
--- a/apps/web/app/(auth)/layout.tsx
+++ b/apps/web/app/(auth)/telegram/layout.tsx
@@ -1,6 +1,6 @@
import { TelegramProvider } from '@/providers';
import { type PropsWithChildren } from 'react';
-export default async function RootLayout({ children }: Readonly) {
+export default async function Layout({ children }: Readonly) {
return {children};
}
diff --git a/apps/web/app/(auth)/telegram/page.tsx b/apps/web/app/(auth)/telegram/page.tsx
new file mode 100644
index 0000000..b57a263
--- /dev/null
+++ b/apps/web/app/(auth)/telegram/page.tsx
@@ -0,0 +1,42 @@
+'use client';
+import { initData, isMiniAppDark, useSignal } from '@telegram-apps/sdk-react';
+import { signIn, useSession } from 'next-auth/react';
+import { redirect } from 'next/navigation';
+import { useEffect } from 'react';
+
+export default function Auth() {
+ const initDataUser = useSignal(initData.user);
+ const isDark = isMiniAppDark();
+ const { data: session, status } = useSession();
+
+ useEffect(() => {
+ if (status === 'authenticated') {
+ redirect('/profile');
+ }
+
+ if (status === 'unauthenticated' && initDataUser?.id) {
+ signIn('telegram', {
+ callbackUrl: '/profile',
+ redirect: false,
+ telegramId: String(initDataUser.id),
+ });
+ }
+ }, [initDataUser, status]);
+
+ if (status === 'loading') {
+ return Loading Auth...
;
+ }
+
+ return (
+
+ {session ? (
+
+ Hello, {JSON.stringify(session)}
+ Dark: {JSON.stringify(isDark)}
+
+ ) : (
+
Not authenticated
+ )}
+