import ProfileForm from '@/components/form/profile-form'
import i18n from '@/lib/i18n'
import { createFileRoute } from '@tanstack/react-router'

export const Route = createFileRoute('/(app)/(auth)/profile')({
  component: RouteComponent,
  staticData: { breadcrumb: i18n.t('nav.profile') },
})

function RouteComponent() {
  return (
    <div className="@container/main flex flex-1 flex-col gap-2 p-4">
      <div className="*:data-[slot=card]:from-primary/5 *:data-[slot=card]:to-card dark:*:data-[slot=card]:bg-card *:data-[slot=card]:bg-gradient-to-br *:data-[slot=card]:shadow-xs grid grid-cols-1 @xl/main:grid-cols-2 @5xl/main:grid-cols-3 gap-4">
        <ProfileForm />
      </div>
    </div>
  )
}