97 lines
2.7 KiB
TypeScript
97 lines
2.7 KiB
TypeScript
import AdaptableCard from '@/components/shared/AdaptableCard'
|
|
import Container from '@/components/shared/Container'
|
|
import Tabs from '@/components/ui/Tabs'
|
|
import { useLocalization } from '@/utils/hooks/useLocalization'
|
|
import { Suspense, lazy, useState } from 'react'
|
|
import { Helmet } from 'react-helmet'
|
|
import { useLocation, useNavigate } from 'react-router-dom'
|
|
|
|
type AccountSetting = {
|
|
profile: {
|
|
firstName?: string
|
|
lastName?: string
|
|
avatar?: string
|
|
lang?: string
|
|
}
|
|
loginHistory: {
|
|
type: string
|
|
deviceName: string
|
|
time: number
|
|
location: string
|
|
}[]
|
|
}
|
|
|
|
const General = lazy(() => import('./components/General'))
|
|
const Password = lazy(() => import('./components/Password'))
|
|
const NotificationSettings = lazy(() => import('./components/NotificationSettings'))
|
|
|
|
const { TabNav, TabList } = Tabs
|
|
|
|
const Profile = () => {
|
|
const { translate } = useLocalization()
|
|
const settingsMenu: Record<
|
|
string,
|
|
{
|
|
label: string
|
|
path: string
|
|
}
|
|
> = {
|
|
general: {
|
|
label: translate('::Abp.Identity.Profile.General'),
|
|
path: 'general',
|
|
},
|
|
password: {
|
|
label: translate('::Abp.Identity.Password'),
|
|
path: 'password',
|
|
},
|
|
notificationSettings: {
|
|
label: translate('::Abp.Identity.NotificationSettings'),
|
|
path: 'notification-settings',
|
|
},
|
|
}
|
|
|
|
const location = useLocation()
|
|
const path = location.pathname.substring(location.pathname.lastIndexOf('/') + 1)
|
|
const [currentTab, setCurrentTab] = useState(path)
|
|
const [data, setData] = useState<Partial<AccountSetting>>({})
|
|
const navigate = useNavigate()
|
|
|
|
const PROFILE_BASE_PATH = '/admin/profile'
|
|
|
|
const onTabChange = (val: string) => {
|
|
if (settingsMenu[val]) {
|
|
setCurrentTab(settingsMenu[val].path)
|
|
navigate(`${PROFILE_BASE_PATH}/${settingsMenu[val].path}`)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Container>
|
|
<Helmet
|
|
titleTemplate="%s | Sözsoft Kurs Platform"
|
|
title={translate('::' + 'Abp.Identity.Profile')}
|
|
defaultTitle="Sözsoft Kurs Platform"
|
|
></Helmet>
|
|
<AdaptableCard>
|
|
<Tabs value={currentTab} onChange={(val) => onTabChange(val)}>
|
|
<TabList>
|
|
{Object.keys(settingsMenu).map((key) => (
|
|
<TabNav key={key} value={key}>
|
|
{settingsMenu[key].label}
|
|
</TabNav>
|
|
))}
|
|
</TabList>
|
|
</Tabs>
|
|
<div className="px-4 py-6">
|
|
<Suspense fallback={<></>}>
|
|
{currentTab === 'general' && <General />}
|
|
{currentTab === 'password' && <Password data={data.loginHistory} />}
|
|
{currentTab === 'notification-settings' && <NotificationSettings />}
|
|
</Suspense>
|
|
</div>
|
|
</AdaptableCard>
|
|
</Container>
|
|
)
|
|
}
|
|
|
|
export default Profile
|