feat: tempcommit
This commit is contained in:
parent
a308158ca7
commit
0c260820e2
2 changed files with 87 additions and 58 deletions
35
src/components/misc/profile-picture-upload.tsx
Normal file
35
src/components/misc/profile-picture-upload.tsx
Normal file
|
@ -0,0 +1,35 @@
|
|||
import Image from 'next/image';
|
||||
import { Avatar } from '../ui/avatar';
|
||||
import { useGetApiUserMe } from '@/generated/api/user/user';
|
||||
import { User } from 'lucide-react';
|
||||
|
||||
import { Input } from '../ui/input';
|
||||
|
||||
export default function ProfilePictureUpload() {
|
||||
const { data } = useGetApiUserMe();
|
||||
return (
|
||||
<>
|
||||
<div className='grid grid-cols-1 gap-1'>
|
||||
<span className='relative flex space-6'>
|
||||
<Input
|
||||
id='pic-upload'
|
||||
type='file'
|
||||
defaultValue={data?.data.user.image ?? undefined}
|
||||
/>
|
||||
<Avatar className='flex justify-center items-center ml-6 shadow-md border h-[36px] w-[36px]'>
|
||||
{data?.data.user.image ? (
|
||||
<Image
|
||||
src={data?.data.user.image}
|
||||
alt='Avatar'
|
||||
width='20'
|
||||
height='20'
|
||||
/>
|
||||
) : (
|
||||
<User />
|
||||
)}
|
||||
</Avatar>
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
|
@ -30,6 +30,7 @@ import { GroupWrapper } from '../wrappers/group-wrapper';
|
|||
import { Avatar } from '../ui/avatar';
|
||||
import Image from 'next/image';
|
||||
import { User } from 'lucide-react';
|
||||
import ProfilePictureUpload from './profile-picture-upload';
|
||||
|
||||
export default function SettingsPage() {
|
||||
const router = useRouter();
|
||||
|
@ -48,7 +49,8 @@ export default function SettingsPage() {
|
|||
<CardContent className='space-y-6 mt-2'>
|
||||
<GroupWrapper title='General Settings'>
|
||||
<div className='space-y-4'>
|
||||
<div className='flex items-center justify-evenly'>
|
||||
<GroupWrapper>
|
||||
<div className='flex items-center justify-evenly sm:flex-row flex-col gap-6'>
|
||||
<div>
|
||||
<LabeledInput
|
||||
label='First Name'
|
||||
|
@ -66,6 +68,7 @@ export default function SettingsPage() {
|
|||
></LabeledInput>
|
||||
</div>
|
||||
</div>
|
||||
</GroupWrapper>
|
||||
<div className='space-y-2'>
|
||||
<LabeledInput
|
||||
label='Display Name'
|
||||
|
@ -116,35 +119,23 @@ export default function SettingsPage() {
|
|||
</div>
|
||||
</div>
|
||||
</GroupWrapper>
|
||||
<div className='space-y-2 grid grid-cols-[1fr_auto] gap-4'>
|
||||
<LabeledInput
|
||||
label='Profile Picture'
|
||||
type='file'
|
||||
placeholder='Upload Profile Picture'
|
||||
defaultValue={data?.data.user.image ?? ''}
|
||||
></LabeledInput>
|
||||
<Avatar className='flex justify-center items-center'>
|
||||
{data?.data.user.image ? (
|
||||
<Image
|
||||
src={data?.data.user.image}
|
||||
alt='Avatar'
|
||||
width='20'
|
||||
height='20'
|
||||
/>
|
||||
) : (
|
||||
<User />
|
||||
)}
|
||||
</Avatar>
|
||||
<GroupWrapper title='Profile Picture'>
|
||||
<div className='space-y-2 grid grid-cols-[1fr_auto]'>
|
||||
<ProfilePictureUpload />
|
||||
</div>
|
||||
<div className='space-y-2'>
|
||||
<Label htmlFor='timezone'>Timezone</Label>
|
||||
<Input
|
||||
id='displayName'
|
||||
</GroupWrapper>
|
||||
<GroupWrapper title='Regional Settings'>
|
||||
<div className='space-y-2 grid sm:grid-cols-[1fr_auto] sm:flex-row gap-4'>
|
||||
<div className='grid gap-1'>
|
||||
<LabeledInput
|
||||
type='text'
|
||||
label='Timezone'
|
||||
placeholder='Europe/Berlin'
|
||||
defaultValue={data?.data.user.timezone}
|
||||
/>
|
||||
></LabeledInput>
|
||||
</div>
|
||||
<div className='space-y-2'>
|
||||
<div>
|
||||
<div className='grid gap-1'>
|
||||
<Label htmlFor='language'>Language</Label>
|
||||
<Select>
|
||||
<SelectTrigger id='language'>
|
||||
|
@ -156,7 +147,10 @@ export default function SettingsPage() {
|
|||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className='pt-4'>
|
||||
</div>
|
||||
</div>
|
||||
</GroupWrapper>
|
||||
<div className='flex items-center justify-evenly sm:flex-row flex-col gap-6'>
|
||||
<Button variant='secondary'>Delete Account</Button>
|
||||
<span className='text-sm text-muted-foreground pt-1'>
|
||||
Permanently delete your account and all associated data.
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue