You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

95 lines
4.2 KiB

import { UserIcon, PencilIcon, KeyIcon, AlertTriangleIcon, MessageSquareIcon } from 'lucide-react'
import SubscriptionInfo from '../(components)/subscription-info'
import { Button } from '@/components/ui/button'
import Link from 'next/link'
export default function AccountPage() {
return (
<div className='flex-1 space-y-6 p-6 md:p-8'>
<div className='space-y-1'>
<div className='flex items-center space-x-2'>
<UserIcon className='h-6 w-6 text-primary' />
<h2 className='text-3xl font-bold tracking-tight'>Account</h2>
</div>
<p className='text-muted-foreground'>Manage your account settings and preferences</p>
</div>
<div className='grid grid-cols-1 lg:grid-cols-2 gap-6'>
{/* Left column - Subscription Information */}
<div className='space-y-4'>
<h3 className='text-lg font-semibold'>Subscription Information</h3>
<SubscriptionInfo />
</div>
{/* Right column - Account Management */}
<div className='space-y-6'>
<div className='space-y-4'>
<h3 className='text-lg font-semibold'>Account Management</h3>
<div className='grid gap-4'>
<Link href="/dashboard/account/edit-profile">
<Button variant="outline" className="w-full justify-start h-auto py-3">
<div className='flex items-center'>
<div className='bg-primary/10 p-2 rounded-full mr-3'>
<PencilIcon className='h-5 w-5 text-primary' />
</div>
<div className='text-left'>
<div className='font-medium'>Edit Profile</div>
<div className='text-sm text-muted-foreground'>Update your personal information</div>
</div>
</div>
</Button>
</Link>
<Link href="/dashboard/account/change-password">
<Button variant="outline" className="w-full justify-start h-auto py-3">
<div className='flex items-center'>
<div className='bg-primary/10 p-2 rounded-full mr-3'>
<KeyIcon className='h-5 w-5 text-primary' />
</div>
<div className='text-left'>
<div className='font-medium'>Change Password</div>
<div className='text-sm text-muted-foreground'>Update your account password</div>
</div>
</div>
</Button>
</Link>
<Link href="/dashboard/account/get-support">
<Button variant="outline" className="w-full justify-start h-auto py-3">
<div className='flex items-center'>
<div className='bg-primary/10 p-2 rounded-full mr-3'>
<MessageSquareIcon className='h-5 w-5 text-primary' />
</div>
<div className='text-left'>
<div className='font-medium'>Get Support</div>
<div className='text-sm text-muted-foreground'>Contact our support team for assistance</div>
</div>
</div>
</Button>
</Link>
</div>
</div>
<div className='space-y-4 pt-4 border-t'>
<h3 className='text-lg font-semibold text-destructive'>Danger Zone</h3>
<Link href="/dashboard/account/delete-account">
<Button variant="outline" className="w-full justify-start h-auto py-3 border-destructive/30">
<div className='flex items-center'>
<div className='bg-destructive/10 p-2 rounded-full mr-3'>
<AlertTriangleIcon className='h-5 w-5 text-destructive' />
</div>
<div className='text-left'>
<div className='font-medium text-destructive'>Delete Account</div>
<div className='text-sm text-muted-foreground'>Permanently delete your account</div>
</div>
</div>
</Button>
</Link>
</div>
</div>
</div>
</div>
)
}