diff options
| -rw-r--r-- | src/app/settings/page.tsx | 2 | ||||
| -rw-r--r-- | src/components/header/authdialog/LoginForm.tsx | 2 | ||||
| -rw-r--r-- | src/components/header/authdialog/register.ts | 32 | ||||
| -rw-r--r-- | src/components/settings/AboutMe.tsx | 36 | ||||
| -rw-r--r-- | src/components/settings/ProfilePage.tsx | 30 |
5 files changed, 77 insertions, 25 deletions
diff --git a/src/app/settings/page.tsx b/src/app/settings/page.tsx index c44b787..5f630d1 100644 --- a/src/app/settings/page.tsx +++ b/src/app/settings/page.tsx @@ -7,7 +7,7 @@ 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'; - +//import ProfileDescription from '@/components/settings/ProfileDescription'; export default function Settings() { const user = useUser(); const [tab, setTab] = useState('profile'); diff --git a/src/components/header/authdialog/LoginForm.tsx b/src/components/header/authdialog/LoginForm.tsx index 913ca66..1dc2df4 100644 --- a/src/components/header/authdialog/LoginForm.tsx +++ b/src/components/header/authdialog/LoginForm.tsx @@ -54,7 +54,7 @@ export default function LoginForm({ redirectTo }: { redirectTo?: string }) { }); if (!meRes.ok) throw new Error('Failed to fetch user'); const meData = await meRes.json(); - setUser(meData); + setUser(meData.authenticated ? meData.user : null); if (redirectTo) router.push(redirectTo); } } catch (err) { diff --git a/src/components/header/authdialog/register.ts b/src/components/header/authdialog/register.ts index 46a59f2..3098df7 100644 --- a/src/components/header/authdialog/register.ts +++ b/src/components/header/authdialog/register.ts @@ -45,14 +45,18 @@ export const registerUser = async ( try { const res = await fetch(`${API_URL}/api/auth/register`, { method: 'POST', - headers: { 'Content-Type': 'application/json' }, + headers: { + 'Content-Type': 'application/json', + }, body: JSON.stringify({ username, email, password }), credentials: 'include', }); if (!res.ok) { - const data = await res.json(); - const { field, message } = data.detail || {}; + const errorData = await res.json(); + + const { field, message } = errorData.detail || {}; + return { data: null, error: field @@ -61,20 +65,16 @@ export const registerUser = async ( }; } - const meRes = await fetch(`${API_URL}/api/me`, { - credentials: 'include', - }); - - if (!meRes.ok) { - throw new Error( - 'Не удалось получить данные пользователя после регистрации', - ); - } - - const meData = await meRes.json(); + const user = await res.json(); - return { data: meData, error: null }; + return { + data: user, + error: null, + }; } catch (err: any) { - return { data: null, error: { general: err.message } }; + return { + data: null, + error: { general: err.message }, + }; } }; diff --git a/src/components/settings/AboutMe.tsx b/src/components/settings/AboutMe.tsx new file mode 100644 index 0000000..b065a26 --- /dev/null +++ b/src/components/settings/AboutMe.tsx @@ -0,0 +1,36 @@ +import { useState } from 'react'; + +export default function AboutMe() { + const maxLength = 250; + const [text, setText] = useState(''); + + const handleChange = (e) => { + const value = e.target.value; + + if (value.length <= maxLength) { + setText(value); + } + }; + + return ( + <div className="flex flex-col flex-start gap-[10px] w-[600px] h-[284px]"> + <p className="font-medium text-light-violet gap-[10px] ml-[20px]"> + ОБО МНЕ + </p> + + <div className="flex flex-row flex-end p-[20px] w-[600px] h-[120px] border-solid border-[1px] rounded-[20px]"> + <Input + value={text} + onChange={handleChange} + placeholder="Введите описание о себе" + /> + + <p className="font-regular flex flex-row justify-center items-end ml-[10px] text-light-violet"> + {maxLength - text.length} + </p> + </div> + + <Button className="w-[105px]">Сменить</Button> + </div> + ); +} diff --git a/src/components/settings/ProfilePage.tsx b/src/components/settings/ProfilePage.tsx index 9d5b81b..cac8e7e 100644 --- a/src/components/settings/ProfilePage.tsx +++ b/src/components/settings/ProfilePage.tsx @@ -1,9 +1,10 @@ import { InputField } from '@/components/ui/inputfield'; -import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui'; import { Separator } from '@/components/ui'; - +import { useState } from 'react'; export default function ProfilePage() { + const maxLength = 250; + const [about, setAbout] = useState(''); return ( <div className="flex flex-col flex-start gap-[20px] w-[900px] h-[804px]"> <div className="flex flex-col flex-start gap-[10px] w-[310px] h-[123px]"> @@ -16,14 +17,29 @@ export default function ProfilePage() { <p className="font-medium text-light-violet gap-[10px] ml-[20px]"> ОБО МНЕ </p> - <div className="flex flex-row flex-end p-[20px] w-[600px] h-[120px] border-solid border-[1px] rounded-[20px]"> - <Input placeholder="Введите описание о себе" /> - <p className="font-regular flex flex-row justify-center items-end ml-[10px] text-light-violet"> - 250 + + <div className="flex flex-row p-[20px] w-[600px] h-[120px] border-solid border-[1px] rounded-[20px]"> + <textarea + value={about} + onChange={(e) => setAbout(e.target.value)} + maxLength={maxLength} + placeholder="Введите описание о себе" + className="w-full h-full resize-none outline-none bg-transparent" + /> + + <p + className={`ml-[10px] flex items-end ${ + maxLength - about.length <= 10 + ? 'text-red' + : 'text-light-violet' + }`} + > + {maxLength - about.length} </p> </div> + <Button className="w-[105px]">Сменить</Button> - </div> + </div>{' '} <Separator className="bg-violet/50 h-[1px]" /> <div className="flex flex-col flex-start gap-[10px] w-[219px] h-[74px]"> <p className="font-medium text-light-violet ml-[20px]"> |