diff options
Diffstat (limited to 'src/components/settings/ProfilePage.tsx')
| -rw-r--r-- | src/components/settings/ProfilePage.tsx | 19 |
1 files changed, 17 insertions, 2 deletions
diff --git a/src/components/settings/ProfilePage.tsx b/src/components/settings/ProfilePage.tsx index cac8e7e..75370d2 100644 --- a/src/components/settings/ProfilePage.tsx +++ b/src/components/settings/ProfilePage.tsx @@ -1,16 +1,31 @@ import { InputField } from '@/components/ui/inputfield'; import { Button } from '@/components/ui'; import { Separator } from '@/components/ui'; +import { changeUsername } from './changeusername'; import { useState } from 'react'; export default function ProfilePage() { const maxLength = 250; const [about, setAbout] = useState(''); + const [username, setUsername] = useState(''); + const [usernameLoading, setUsernameLoading] = useState(false); 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]"> <p className="font-medium gap-[10px] ml-[20px]">НИКНЕЙМ</p> - <InputField placeholder="Введите никнейм" /> - <Button className="w-[105px]">Сменить</Button> + + <InputField + placeholder="Введите никнейм" + value={username} + onChange={(e: any) => setUsername(e.target.value)} + /> + + <Button + className="w-[105px]" + onClick={() => changeUsername(username)} + disabled={usernameLoading} + > + {usernameLoading ? '...' : 'Сменить'} + </Button> </div> <Separator className="bg-violet/50 h-[1px]" /> <div className="flex flex-col flex-start gap-[10px] w-[600px] h-[284px]"> |