diff options
Diffstat (limited to 'src/components/settings/SecurityPage.tsx')
| -rw-r--r-- | src/components/settings/SecurityPage.tsx | 111 |
1 files changed, 59 insertions, 52 deletions
diff --git a/src/components/settings/SecurityPage.tsx b/src/components/settings/SecurityPage.tsx index 6d4ab75..2135696 100644 --- a/src/components/settings/SecurityPage.tsx +++ b/src/components/settings/SecurityPage.tsx @@ -1,37 +1,43 @@ import { InputField } from '@/components/ui/inputfield'; import { Button } from '@/components/ui'; import { Separator } from '@/components/ui'; +import { useAuthContext } from '@/lib/contexts/Auth.context'; + export default function SecurityPage() { + const { user } = useAuthContext(); + + if (!user) return; + + const hasGoogle = !!user.google_id; + const hasPassword = !!user.password; + return ( <> <div className="flex flex-col flex-start gap-[40px] w-[900px] h-[816px]"> <div className="flex flex-col gap-[20px] w-[900px] "> - <div className="flex flex-col flex-start gap-[20px] w-[310px] h-[241px]"> - <p className="text-light-violet font-medium"> - ЗАДАТЬ ПАРОЛЬ - </p> - <div className="flex flex-col flex-start gap-[10px] w-[310px] h-[137px]"> - <InputField - placeholder="Почта аккаунта" - type="password" - name="password" - /> - <InputField - isPassword - placeholder="Введите пароль" - type="password" - name="password" - /> - <InputField - isPassword - placeholder="Повторите пароль" - type="password" - name="password" - /> + {hasGoogle && ( + <div className="flex flex-col flex-start gap-[20px] w-[310px] h-[241px]"> + <p className="text-light-violet font-medium"> + ЗАДАТЬ ПАРОЛЬ + </p> + <div className="flex flex-col flex-start gap-[10px] w-[310px] h-[137px]"> + <InputField + placeholder="Введите пароль" + type="password" + name="password" + /> + <InputField + isPassword + placeholder="Повторите пароль" + type="password" + name="repeat_password" + /> + </div> + <Button>Сменить</Button> + <Separator className="bg-violet/30 h-[1px]" /> </div> - <Button>Сменить</Button> - </div> - <Separator className="bg-violet/30 h-[1px]" /> + )} + <div className="flex flex-col flex-start gap-[20px] w-[310px] h-[192px]"> <p className="text-light-violet font-medium"> СМЕНА ПОЧТЫ @@ -52,34 +58,35 @@ export default function SecurityPage() { <Button>Сменить</Button> </div> <Separator className="bg-violet/30 h-[1px]" /> - <div className="flex flex-col flex-start gap-[20px] w-[310px] "> - <p className="text-light-violet font-medium"> - СМЕНА ПАРОЛЯ - </p> - <div className="flex flex-col flex-start gap-[10px] w-[310px]"> - <InputField - placeholder="Текущий пароль" - isPassword - type="password" - name="password" - /> - <InputField - isPassword - placeholder="Введите пароль" - type="password" - name="password" - /> - <InputField - isPassword - placeholder="Повторите пароль" - type="password" - name="password" - /> + {hasPassword && ( + <div className="flex flex-col flex-start gap-[20px] w-[310px] "> + <p className="text-light-violet font-medium"> + СМЕНА ПАРОЛЯ + </p> + <div className="flex flex-col flex-start gap-[10px] w-[310px]"> + <InputField + placeholder="Текущий пароль" + isPassword + type="password" + name="password" + /> + <InputField + isPassword + placeholder="Введите пароль" + type="password" + name="password" + /> + <InputField + isPassword + placeholder="Повторите пароль" + type="password" + name="password" + /> + </div> + <Button>Сменить</Button> + <Separator className="bg-violet/30 h-[1px]" /> </div> - <Button>Сменить</Button> - </div> - <Separator className="bg-violet/30 h-[1px]" /> - + )} <Button className="w-[310px]">Выйти из аккаунта</Button> </div> </div> |