@hhgtech/hhg-components
Version:
Hello Health Group common components
161 lines (156 loc) • 7.88 kB
JavaScript
import { _ as __rest, a as __awaiter } from './tslib.es6-00ab44b2.js';
import React__default, { useState, useMemo, useCallback } from 'react';
import { u as useTranslations } from './index-09d9e570.js';
import { createStyles } from '@mantine/core';
import { P as PATHS } from './paths-4a2d3f94.js';
import { L as LOCALIZED_SLUGS } from './constants-ce67620e.js';
import { B as Button } from './index-2d25b0f0.js';
import './index-8c40504a.js';
import { c as callApi, b as getCarePath } from './utils-5e9c89a7.js';
import { domainLocales } from './constantsDomainLocales.js';
import { isProduction } from './constantsIsProduction.js';
var useStyles = createStyles((theme) => {
return {
root: {
display: 'inline-block',
// height: 1rem,
flexShrink: 0,
padding: '2px 0.5rem',
marginLeft: '4px',
borderRadius: theme.radius.xs,
// color: white,
fontSize: '12px',
fontWeight: 400,
lineHeight: '18px',
'&[data-label-type="admin"]': {
background: theme.primaryColor[0],
color: theme.primaryColor[9],
// &[data-is-marrybaby='true'] {
// background: #{map-get($mbColors, 'tonePink')};
// color: #{map-get($mbColors, 'cRed')};
// }
},
'&[data-label-type="local admin"]': {
background: theme.primaryColor[8],
},
'&[data-label-type="ambassador"]': {
background: theme.colors.green[4],
},
'&[data-label-type="expert"]': {
background: theme.colors.yellow[6],
// &[data-is-marrybaby='true'] {
// background: #{map-get($mbColors, 'cOrange')};
// color: #{map-get($colors, 'cWhite')};
// }
},
'&[data-label-type="moderator"]': {
background: theme.colors.red[0],
color: theme.colors.red[8],
// &[data-is-marrybaby='true'] {
// background: #{map-get($mbColors, 'toneBlue')};
// color: #{map-get($mbColors, 'cobalt')};
// }
},
'&[data-label-type="sponsor"]': {
background: theme.colors.teal[4],
},
'&[data-label-type="guide"]': {
background: theme.colors.teal[4],
},
'&[data-label-type="influencer"]': {
background: theme.colors.teal[4],
},
},
};
});
const AuthorLabelTextMapping = {
admin: 'cardAuthor.admin',
moderator: 'cardAuthor.moderator',
ambassador: 'cardAuthor.ambassador',
expert: 'cardAuthor.expert',
sponsor: 'cardAuthor.sponsor',
// 'local-admin': 'cardAuthor.localAdmin',
guide: 'cardAuthor.guide',
influencer: 'cardAuthor.influencer',
};
const looselyMatchRole = (role) => {
const allRoles = [
'admin',
'moderator',
'ambassador',
'expert',
'sponsor',
'guide',
'influencer',
];
return allRoles.find((r) => r === role);
};
const AuthorBadge = (_a) => {
var { siteType, role, title, styles, className } = _a, rest = __rest(_a, ["siteType", "role", "title", "styles", "className"]);
const { t } = useTranslations();
const matchedRole = role ? looselyMatchRole(role) : '';
const { classes, cx } = useStyles(undefined,
// Second argument is responsible for styles api integration
{ name: 'AuthorBadge', styles });
return matchedRole && AuthorLabelTextMapping[matchedRole] ? (React__default.createElement("div", Object.assign({
// className={styles.authorBadge}
className: cx(classes.root, className), "data-label-type": matchedRole, "data-is-marrybaby": siteType === 'marryBaby' }, rest), title || t(AuthorLabelTextMapping[matchedRole]))) : null;
};
const BookingBtn = (_a) => {
var { label, bookingId, bookingType = 'doctor', locale = 'vi-VN' } = _a, rest = __rest(_a, ["label", "bookingId", "bookingType", "locale"]);
const { t } = useTranslations();
const [loading, setLoading] = useState(false);
const currentUrl = useMemo(() => {
if (typeof window !== 'undefined') {
return window.location.href;
}
else
return '';
}, []);
const handleOnClick = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
const url = bookingType === 'doctor'
? PATHS.GET_DOCTOR_DETAIL
: bookingType === 'hospital'
? PATHS.GET_HOSPITAL_DETAIL
: bookingType === 'service'
? PATHS.GET_SERVICE_DETAIL
: '';
try {
setLoading(true);
const response = yield callApi(getCarePath(url, {
id: bookingId,
site: domainLocales[locale],
}), 'get');
if ((response === null || response === void 0 ? void 0 : response._status) === 1) {
const result = bookingType === 'doctor'
? {
id: (_c = (_b = response === null || response === void 0 ? void 0 : response._data) === null || _b === void 0 ? void 0 : _b.doctor) === null || _c === void 0 ? void 0 : _c.id,
slug: (_e = (_d = response === null || response === void 0 ? void 0 : response._data) === null || _d === void 0 ? void 0 : _d.doctor) === null || _e === void 0 ? void 0 : _e.slug,
localSlug: (_f = LOCALIZED_SLUGS[locale]) === null || _f === void 0 ? void 0 : _f.DOCTOR,
}
: bookingType === 'hospital'
? {
id: (_h = (_g = response === null || response === void 0 ? void 0 : response._data) === null || _g === void 0 ? void 0 : _g.branch) === null || _h === void 0 ? void 0 : _h.id,
slug: (_k = (_j = response === null || response === void 0 ? void 0 : response._data) === null || _j === void 0 ? void 0 : _j.branch) === null || _k === void 0 ? void 0 : _k.slug,
localSlug: (_l = LOCALIZED_SLUGS[locale]) === null || _l === void 0 ? void 0 : _l.HOSPITAL,
}
: {
id: (_o = (_m = response === null || response === void 0 ? void 0 : response._data) === null || _m === void 0 ? void 0 : _m.service) === null || _o === void 0 ? void 0 : _o.id,
slug: (_q = (_p = response === null || response === void 0 ? void 0 : response._data) === null || _p === void 0 ? void 0 : _p.service) === null || _q === void 0 ? void 0 : _q.slug,
localSlug: (_r = LOCALIZED_SLUGS[locale]) === null || _r === void 0 ? void 0 : _r.SERVICE,
};
window.location.href = `https://${!isProduction ? 'discover.' : ''}${domainLocales[locale]}/care/${result.localSlug}/${result.slug}-${result.id}/`;
}
else {
setLoading(false);
}
}
catch (err) {
console.log(err);
setLoading(false);
}
}), []);
return bookingId && bookingType ? (React__default.createElement(Button, Object.assign({ dataEventCategory: "Care", dataEventAction: "Comment - Quick Booking", dataEventLabel: currentUrl, onClick: handleOnClick, loading: loading }, rest), label || t('careBooking.bookAnAppointment'))) : null;
};
export { AuthorBadge as A, BookingBtn as B };