UNPKG

@hhgtech/hhg-components

Version:
197 lines (189 loc) • 9.99 kB
import { _ as __rest, a as __awaiter } from './tslib.es6-ea4dfe68.js'; import React__default, { createContext, useState, useContext, useEffect } from 'react'; import { T as Tabs } from './index-c2190f6e.js'; import { L as Loading } from './index-bcd83176.js'; import './index-90813715.js'; import { g as formatArticle } from './dataTransform-8b19f5d4.js'; import { PATHS } from './togetherApiPaths.js'; import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath } from './utils-40e61585.js'; import { Minus, Plus } from '@hhgtech/icons/core'; import { Collapse } from '@mantine/core'; import { C as CardAuthor } from './index-7dcfaf94.js'; import { L as LOCALE } from './Locale-f270bd9d.js'; import '@hhgtech/icons/other'; import './index-c68a0fa7.js'; import './index-9f5659e8.js'; import './other-4ccb5568.js'; import './index-9d21b711.js'; import './translationsContext-3a9e3453.js'; import './index-6351bdee.js'; import './index-963a1701.js'; import './miscCookieHelper.js'; import 'slugify'; import './constantsIsProduction.js'; import 'string-format'; import './constants-f4091ce6.js'; import 'dayjs'; import 'dayjs/plugin/relativeTime'; import './utils-cb7242c7.js'; import './index-2ad9b019.js'; import './paths-a9bf91dc.js'; import './constants-beb49269.js'; import './index-5e947517.js'; import 'date-fns/locale'; import './constantsSite.js'; import './constantsDomainLocales.js'; import './constantsRiskScreener.js'; import './index-5d841202.js'; import './miscTheme.js'; import './WhatsApp-f7a93c46.js'; import './Spinner-2d43eb3a.js'; import './index-e9423cb7.js'; import '@emotion/styled'; import './useScreenSize-981e5b51.js'; import './index-ebe66e27.js'; import './index-b94d1262.js'; import '@emotion/react'; import './index-dcc517ff.js'; import './index-5d32e000.js'; import './index.styles-770020ac.js'; const ProfileDetailContext = createContext({}); var styles$1 = {"container":"_0NhMo6T","faq":"nrZtZ-u"}; const Faqs = ({ faqs }) => { const [collapseSelected, setCollapseSelected] = useState([]); const handleClick = (index) => { if (collapseSelected.includes(index)) { const newCollapseSelected = collapseSelected.filter((item) => item !== index); setCollapseSelected(newCollapseSelected); } else { setCollapseSelected((pre) => { return [...pre, index]; }); } }; return (React__default.createElement("div", { className: styles$1.container }, faqs.map((faq, index) => { const collapsed = collapseSelected.includes(index); return (React__default.createElement("div", { className: styles$1.faq, key: index }, React__default.createElement("div", { className: "faq-item", onClick: () => handleClick(index) }, React__default.createElement("div", { className: "faq-question", dangerouslySetInnerHTML: { __html: faq.question || '' } }), collapsed ? React__default.createElement(Minus, null) : React__default.createElement(Plus, null)), React__default.createElement(Collapse, { in: collapsed, className: "faq-answer" }, React__default.createElement("div", { dangerouslySetInnerHTML: { __html: faq.answer || '' } })))); }))); }; var styles = {"container":"_2ugC2Ll","info":"_8IDDHjn","body":"CCwRHCd","description":"RF63WXG","cardAuthorWrapper":"PIaeC0v"}; const formatExperience = (data) => { if (!data) return {}; return { title: data === null || data === void 0 ? void 0 : data.title, organization: data === null || data === void 0 ? void 0 : data.organization, duration: data.duration, }; }; const formatEducation = (data) => { if (!data) return {}; return { completedYear: data === null || data === void 0 ? void 0 : data.completed_year, schoolName: data.school_name, study: data.study, }; }; var TabName; (function (TabName) { TabName[TabName["About"] = 0] = "About"; TabName[TabName["Care"] = 1] = "Care"; TabName[TabName["Answer"] = 2] = "Answer"; TabName[TabName["Posts"] = 3] = "Posts"; })(TabName || (TabName = {})); var UserType; (function (UserType) { UserType[UserType["Expert"] = 0] = "Expert"; UserType[UserType["User"] = 1] = "User"; })(UserType || (UserType = {})); const TabDataInit = { experiences: [], relatedPosts: [], educations: [], awards: [], contact: {}, data: {}, }; const ProfileChatbot = (_a) => { var { authorProps, authActionWrapper, onSkipQuestion, onCloseFromPost, onChatWithBot, showSkipQuestionTag, currentPageUrl } = _a, rest = __rest(_a, ["authorProps", "authActionWrapper", "onSkipQuestion", "onCloseFromPost", "onChatWithBot", "showSkipQuestionTag", "currentPageUrl"]); const { data: { locale, userInfo, env: { isMarryBaby }, }, } = useContext(TogetherComponentGlobalContext); const id = String(authorProps === null || authorProps === void 0 ? void 0 : authorProps.userId); const [countValues, setCountValues] = useState(); const [loading, setLoading] = useState(false); const [info, setInfo] = useState(); const [faqs, setFaqs] = useState([]); const [description, setDescription] = useState(''); const isAuthorLogin = (userInfo === null || userInfo === void 0 ? void 0 : userInfo._togetherUserId) === (authorProps === null || authorProps === void 0 ? void 0 : authorProps.userId); const [activeTab, setActiveTab] = useState(1); const tabsProps = { value: String(activeTab), dataList: [ { value: '1', text: 'FAQs', content: React__default.createElement(Faqs, { faqs: faqs }), }, ], onTabChange: (n) => setActiveTab(Number(n)), }; useEffect(() => { (() => __awaiter(void 0, void 0, void 0, function* () { var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l; setLoading(true); const res = yield Promise.all([ callApi(getApiPath(PATHS.USER.DETAIL, { _locale: locale, id, }), 'GET'), callApi(getApiPath(PATHS.CHATBOT.PROFILE, { _locale: locale, }), 'GET'), callApi(getApiPath(PATHS.CHATBOT.FAQS_LIST, { _locale: locale, }), 'GET'), ]); const [restDetail, profileRes, faqsRes] = res; const resInfo = { data: restDetail === null || restDetail === void 0 ? void 0 : restDetail.data, experiences: (((_b = (_a = restDetail === null || restDetail === void 0 ? void 0 : restDetail.data) === null || _a === void 0 ? void 0 : _a.fields) === null || _b === void 0 ? void 0 : _b.experiences) || []).map(formatExperience), relatedPosts: (((_c = restDetail === null || restDetail === void 0 ? void 0 : restDetail.data) === null || _c === void 0 ? void 0 : _c.related_post) || []).map((i) => formatArticle(i.post)), educations: (((_e = (_d = restDetail === null || restDetail === void 0 ? void 0 : restDetail.data) === null || _d === void 0 ? void 0 : _d.fields) === null || _e === void 0 ? void 0 : _e.educations) || []).map(formatEducation), awards: ((_g = (_f = restDetail === null || restDetail === void 0 ? void 0 : restDetail.data) === null || _f === void 0 ? void 0 : _f.fields) === null || _g === void 0 ? void 0 : _g.awards_accreditations) || [], contact: ((_j = (_h = restDetail === null || restDetail === void 0 ? void 0 : restDetail.data) === null || _h === void 0 ? void 0 : _h.fields) === null || _j === void 0 ? void 0 : _j.contact) || {}, }; (restDetail === null || restDetail === void 0 ? void 0 : restDetail.status) === 1 && setInfo(resInfo); setFaqs(((_k = faqsRes === null || faqsRes === void 0 ? void 0 : faqsRes.data) === null || _k === void 0 ? void 0 : _k.faqs) || []); setDescription(((_l = profileRes === null || profileRes === void 0 ? void 0 : profileRes.data) === null || _l === void 0 ? void 0 : _l.description) || ''); setLoading(false); }))(); }, []); return (React__default.createElement(ProfileDetailContext.Provider, { value: { isMarryBaby, siteType: isMarryBaby ? 'marryBaby' : 'helloSites', authorId: String((authorProps === null || authorProps === void 0 ? void 0 : authorProps.userId) || ''), authActionWrapper, onSkipQuestion, info, authorProps, onCloseFromPost, countValues, setCountValues, isAuthorLogin, showSkipQuestionTag, currentPageUrl, } }, React__default.createElement("div", Object.assign({}, rest, { className: `${styles.container} ${(rest === null || rest === void 0 ? void 0 : rest.className) || ''}`, "data-is-marrybaby": isMarryBaby }), loading ? (React__default.createElement(Loading, null)) : (React__default.createElement(React__default.Fragment, null, React__default.createElement("div", { className: styles.cardAuthorWrapper }, React__default.createElement(CardAuthor, Object.assign({}, authorProps, { className: "card-author", showDetailPopup: false, showChatbotButton: locale === LOCALE.Vietnam, onChatWithBot: onChatWithBot }))), React__default.createElement("div", { className: styles.description, dangerouslySetInnerHTML: { __html: description } }), faqs.length > 0 && (React__default.createElement("div", { className: styles.body }, React__default.createElement(Tabs, Object.assign({}, tabsProps))))))))); }; export { ProfileChatbot, TabDataInit, TabName, UserType };