99 lines
4.1 KiB
TypeScript
99 lines
4.1 KiB
TypeScript
'use client'
|
||
|
||
import { useState } from 'react';
|
||
import { message } from 'antd';
|
||
import { EditOutlined } from '@ant-design/icons';
|
||
import { i18nText } from '../../i18nKeys';
|
||
import { ExpertData } from '../../types/profile';
|
||
import { AUTH_TOKEN_KEY } from '../../constants/common';
|
||
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
||
import { getTags } from '../../actions/profile';
|
||
import { Loader } from '../view/Loader';
|
||
import { LinkButton } from '../view/LinkButton';
|
||
import { ExpertTags } from './content/ExpertTags';
|
||
import { ExpertSchedule } from './content/ExpertSchedule';
|
||
import { ExpertPayData } from './content/ExpertPayData';
|
||
import { ExpertEducation } from './content/ExpertEducation';
|
||
|
||
type ExpertProfileProps = {
|
||
locale: string;
|
||
data: ExpertData;
|
||
updateData: (data: ExpertData) => void;
|
||
};
|
||
|
||
export const ExpertProfile = ({ locale, data, updateData }: ExpertProfileProps) => {
|
||
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
||
const [loading, setLoading] = useState<(keyof ExpertData)[]>([]);
|
||
|
||
const updateExpert = (key: keyof ExpertData) => {
|
||
switch (key) {
|
||
case 'tags':
|
||
setLoading([key]);
|
||
getTags(locale, jwt)
|
||
.then((tags) => {
|
||
updateData({
|
||
...data,
|
||
tags
|
||
});
|
||
})
|
||
.catch(() => message.error('Не удалось обновить направления'))
|
||
.finally(() => setLoading([]));
|
||
break;
|
||
default:
|
||
break;
|
||
}
|
||
};
|
||
|
||
return (
|
||
<>
|
||
<ol className="breadcrumb">
|
||
<li className="breadcrumb-item active" aria-current="page">{i18nText('coaching', locale)}</li>
|
||
</ol>
|
||
<div className="coaching-info">
|
||
<div className="coaching-profile">
|
||
<div className="coaching-profile__portrait">
|
||
<img src="/images/person.png" className="" alt="" />
|
||
</div>
|
||
<div className="coaching-profile__inner">
|
||
<div className="coaching-profile__name">
|
||
David
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="coaching-section__wrap">
|
||
<div className="coaching-section">
|
||
<div className="coaching-section__title">
|
||
<h2 className="title-h2">{i18nText('aboutCoach', locale)}</h2>
|
||
<h2 className="title-h2">person1 + person4</h2>
|
||
<LinkButton
|
||
type="link"
|
||
icon={<EditOutlined />}
|
||
/>
|
||
</div>
|
||
<div className="card-profile__header__title">
|
||
{`12 ${i18nText('practiceHours', locale)}`}
|
||
</div>
|
||
<div className="card-profile__header__title ">
|
||
{`15 ${i18nText('supervisionCount', locale)}`}
|
||
</div>
|
||
<div className="base-text">
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
|
||
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<Loader isLoading={loading.includes('tags')}>
|
||
<ExpertTags
|
||
locale={locale}
|
||
data={data?.tags}
|
||
updateExpert={updateExpert}
|
||
/>
|
||
</Loader>
|
||
<ExpertSchedule locale={locale} data={data?.schedule} />
|
||
<ExpertEducation locale={locale} data={data?.education} />
|
||
<ExpertPayData locale={locale} data={data?.payData?.person6Data} />
|
||
</div>
|
||
</>
|
||
)
|
||
};
|