add settings auth redirect

4 files changed, 40 insertions, 13 deletions

diff --git a/src/app/settings/page.tsx b/src/app/settings/page.tsx
index 45caa18..c44b787 100644
--- a/src/app/settings/page.tsx
+++ b/src/app/settings/page.tsx
@@ -1,17 +1,40 @@
 'use client';
 
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
+import { useUser } from '@/lib/contexts/Auth.context';
 import SettingsMenu from '@/components/settings/SettingsMenu';
 import SecurityPage from '@/components/settings/SecurityPage';
 import ProfilePage from '@/components/settings/ProfilePage';
+import { Dialog, DialogTrigger, DialogContent } from '@/components/ui/dialog';
+import { AuthDialog } from '@/components/header/AuthDialog';
 
 export default function Settings() {
+    const user = useUser();
     const [tab, setTab] = useState('profile');
+    const [showAuth, setShowAuth] = useState(false);
+
+    useEffect(() => {
+        if (user === null) {
+            setShowAuth(true);
+        }
+    }, [user]);
+
+    if (!user) {
+        return (
+            <Dialog open={showAuth} onOpenChange={setShowAuth}>
+                <DialogTrigger asChild>
+                    <div />
+                </DialogTrigger>
+                <DialogContent className="p-0 bg-transparent border-none">
+                    <AuthDialog redirectTo="/settings" />
+                </DialogContent>
+            </Dialog>
+        );
+    }
 
     return (
-        <div className="flex flex-row gap-[250px] w-full max-w-[1500px] ">
+        <div className="flex flex-row gap-[250px] w-full max-w-[1500px]">
             <SettingsMenu tab={tab} setTab={setTab} />
-
             <div className="flex-1">
                 {tab === 'profile' && <ProfilePage />}
                 {tab === 'security' && <SecurityPage />}
diff --git a/src/components/header/AuthDialog.tsx b/src/components/header/AuthDialog.tsx
index 8c00b81..27f5e97 100644
--- a/src/components/header/AuthDialog.tsx
+++ b/src/components/header/AuthDialog.tsx
@@ -1,14 +1,15 @@
-import { Button } from '@/components/ui/button';
 import { DialogContent, DialogTitle } from '@/components/ui/dialog';
-import { Input } from '@/components/ui/input';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
-import GoogleIcon from '../../../public/icons/google.svg';
-import { InputField } from '../ui/inputfield';
 import LoginForm from './authdialog/LoginForm';
 import RegisterForm from './authdialog/RegisterForm';
 import ResetForm from './authdialog/ResetForm';
 import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
-export function AuthDialog() {
+
+type AuthDialogProps = {
+    redirectTo?: string | null;
+};
+
+export function AuthDialog({ redirectTo }: AuthDialogProps) {
     return (
         <div className="absolute">
             <DialogContent className="w-[350px] p-0 bg-transparent border-transparent">
diff --git a/src/components/header/authdialog/LoginForm.tsx b/src/components/header/authdialog/LoginForm.tsx
index c6cdbcd..913ca66 100644
--- a/src/components/header/authdialog/LoginForm.tsx
+++ b/src/components/header/authdialog/LoginForm.tsx
@@ -4,13 +4,13 @@ import { Button } from '@/components/ui/button';
 import GoogleIcon from '../../../../public/icons/google.svg';
 import { InputField } from '@/components/ui/inputfield';
 import { useAuthContext } from '@/lib/contexts/Auth.context';
-
-export default function LoginForm() {
+import { useRouter } from 'next/navigation';
+export default function LoginForm({ redirectTo }: { redirectTo?: string }) {
     const API_URL = process.env.NEXT_PUBLIC_API_URL;
     const [errors, setErrors] = useState<any>({});
     const [loading, setLoading] = useState(false);
     const { setUser } = useAuthContext();
-
+    const router = useRouter();
     const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
         e.preventDefault();
         setLoading(true);
@@ -55,6 +55,7 @@ export default function LoginForm() {
                 if (!meRes.ok) throw new Error('Failed to fetch user');
                 const meData = await meRes.json();
                 setUser(meData);
+                if (redirectTo) router.push(redirectTo);
             }
         } catch (err) {
             setErrors({ general: 'Ошибка при авторизации' });
diff --git a/src/components/header/authdialog/RegisterForm.tsx b/src/components/header/authdialog/RegisterForm.tsx
index 0370671..ef22433 100644
--- a/src/components/header/authdialog/RegisterForm.tsx
+++ b/src/components/header/authdialog/RegisterForm.tsx
@@ -6,10 +6,11 @@ import { InputField } from '@/components/ui/inputfield';
 import { validate, registerUser } from './register';
 import { useAuthContext } from '@/lib/contexts/Auth.context';
 import Image from 'next/image';
-
-export default function RegisterForm() {
+import { useRouter } from 'next/navigation';
+export default function RegisterForm({ redirectTo }: { redirectTo?: string }) {
     const [errors, setErrors] = useState<any>({});
     const [loading, setLoading] = useState(false);
+    const router = useRouter();
     const { setUser } = useAuthContext();
     const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
         e.preventDefault();
@@ -42,6 +43,7 @@ export default function RegisterForm() {
             setErrors(error);
         } else if (data) {
             setUser(data);
+            if (redirectTo) router.push(redirectTo);
         }
         setLoading(false);
     };