Merge pull request #563 from sledilnik/fix/load-gyn-den

fix: ZZZS differentiates how load for gynecologists and dentists is calculated

Author: lukarenko

src/components/DoctorCard/Info/index.js

@@ -1,13 +1,15 @@
-import { useNavigate, useParams } from 'react-router-dom';
 import { CardContent, Stack, Typography } from '@mui/material';
+import { useNavigate, useParams } from 'react-router-dom';
+
+import { t } from 'i18next';
 
 import { useLeafletContext } from 'context/leafletContext';
 
 import PropTypes from 'prop-types';
 import DoctorActions from './DoctorActions';
 
-import * as Shared from '../Shared';
 import { DoctorPropType } from '../../../types';
+import * as Shared from '../Shared';
 
 const Info = function Info({ doctor, handleZoom = () => {}, isMarker = false }) {
   const { lng } = useParams();
@@ -43,6 +45,18 @@ const Info = function Info({ doctor, handleZoom = () => {}, isMarker = false })
   };
 
   const phoneNum = doctor.phone?.split(',')?.[0];
+  const formatedLoad =
+    doctor.type.startsWith('gyn') || doctor.type.startsWith('den')
+      ? Intl.NumberFormat(lng, {
+          style: 'percent',
+          maximumFractionDigits: 2,
+        }).format(doctor.load / 100)
+      : Intl.NumberFormat(lng).format(doctor.load);
+
+  const headQuotientTooltipTItle =
+    doctor.type.startsWith('gyn') || doctor.type.startsWith('den')
+      ? t('achievingAverageOE')
+      : t('headQuotient');
 
   return (
     <>
@@ -73,11 +87,12 @@ const Info = function Info({ doctor, handleZoom = () => {}, isMarker = false })
         <Stack direction={isMarker ? 'column' : 'row'} justifyContent="space-between">
           <Stack direction="row" alignItems="center" spacing={1}>
             <Shared.HeadQuotient
-              load={doctor.load}
+              load={formatedLoad}
               note={doctor.note}
               date={doctor.updatedAt && doctor.formatUpdatedAt(lng)}
               accepts={doctor.accepts}
               hasOverride={doctor.acceptsOverride || doctor.note ? true : undefined}
+              tooltipTitle={headQuotientTooltipTItle}
             />
             <Shared.Availability
               isFloating={doctor.isFloating}

src/components/DoctorCard/Shared/Tooltips.js

@@ -2,16 +2,16 @@ import PropTypes from 'prop-types';
 
 import { t } from 'i18next';
 
-import { styled } from '@mui/material/styles';
 import { Divider, Stack, Typography } from '@mui/material';
+import { styled } from '@mui/material/styles';
 import { useParams } from 'react-router-dom';
 import { toPercent } from '../utils';
 
-export const HeadQuotient = function HeadQuotient({ load, note, date, hasOverride }) {
+export const HeadQuotient = function HeadQuotient({ load, note, date, hasOverride, tooltipTitle }) {
   return (
     <Stack sx={{ textAlign: 'center' }}>
-      <Typography variant="caption">{t('headQuotient')}</Typography>
-      <Typography variant="body2">{parseFloat(load)}</Typography>
+      <Typography variant="caption">{tooltipTitle}</Typography>
+      <Typography variant="body2">{load}</Typography>
       {hasOverride && (
         <>
           <TooltipDivider />
@@ -38,6 +38,7 @@ HeadQuotient.propTypes = {
   note: PropTypes.oneOfType([PropTypes.string, PropTypes.instanceOf(undefined)]).isRequired,
   date: PropTypes.oneOfType([PropTypes.string, PropTypes.instanceOf(undefined)]).isRequired,
   hasOverride: PropTypes.bool,
+  tooltipTitle: PropTypes.string.isRequired,
 };
 
 export const Availability = function Availability({ date, hasOverride, availability }) {

src/components/DoctorCard/Shared/index.js

@@ -10,10 +10,10 @@ import * as Icons from 'components/Shared/Icons';
 import Accepts from './Accepts';
 
 import {
-  TypeTranslate,
+  AgeGroupIconTranslate,
   AgeGroupTranslate,
   TypeIconTranslate,
-  AgeGroupIconTranslate,
+  TypeTranslate,
 } from '../dicts';
 import * as Styled from '../styles';
 
@@ -22,11 +22,11 @@ import * as Tooltips from './Tooltips';
 export * as Tooltip from './Tooltips';
 
 // it would be better to import just like Tooltip but don't want to make to many changes all over the code
-export { Link, LinkNoRel, ConditionalLink } from './Links';
+export { ConditionalLink, Link, LinkNoRel } from './Links';
 
+export { default as Accepts } from './Accepts';
 export { default as DoctorLinks } from './DoctorLinks';
 export { default as PhoneButton } from './PhoneButton';
-export { default as Accepts } from './Accepts';
 
 export const DoubleChip = function DoubleChip({ type, ageGroup, isExtra, isFloating, viewType }) {
   const drType = t(TypeTranslate[type]);
@@ -113,11 +113,24 @@ DoubleChip.propTypes = {
   viewType: PropTypes.oneOf(['marker', 'list', 'page']),
 };
 
-export const HeadQuotient = function HeadQuotient({ load, note, date, accepts, hasOverride }) {
+export const HeadQuotient = function HeadQuotient({
+  load,
+  note,
+  date,
+  accepts,
+  hasOverride,
+  tooltipTitle,
+}) {
   return (
     <Tooltip
       title={
-        <Tooltips.HeadQuotient load={load} note={note} date={date} hasOverride={hasOverride} />
+        <Tooltips.HeadQuotient
+          load={load}
+          note={note}
+          date={date}
+          hasOverride={hasOverride}
+          tooltipTitle={tooltipTitle}
+        />
       }
       leaveTouchDelay={3000}
       enterTouchDelay={50}
@@ -139,6 +152,7 @@ HeadQuotient.propTypes = {
   load: PropTypes.string.isRequired,
   accepts: PropTypes.oneOf(['y', 'n']).isRequired,
   hasOverride: PropTypes.bool,
+  tooltipTitle: PropTypes.string.isRequired,
 };
 
 export const Availability = function Availability({ date, availability, hasOverride, isFloating }) {

src/locales/en.json

@@ -35,6 +35,7 @@
     "noResults": "No doctor found based on your search criteria. Check if you have the right doctor type selected or zoom out the map.",
     "changedOn": "Changed on: ",
     "headQuotient": "Capitation",
+    "achievingAverageOE": "Achieving average OE",
     "doctorAvailabilityLabel": "Availability",
     "doctorAvailability": "Availability can be lower than 100% for doctors that work part time on preventive programs or in other units (e.g. dentist working with adults and youth).",
     "yourLocation": "Your location",

src/locales/sl.json

@@ -37,6 +37,7 @@
     "noResults": "Noben zdravnik ne ustreza iskalnim pogojem. Preverite, če imate označeno pravilno vrsto zdravnika ali razširite pogled na zemljevidu.",
     "changedOn": "Popravek od: ",
     "headQuotient": "Glavarinski količnik",
+    "achievingAverageOE": "Doseganje povprečja OE",
     "doctorAvailabilityLabel": "Obseg zaposlitve",
     "doctorAvailability": "Obseg zaposlitve: delež je lahko nižji od 100 %, ker zdravnik določen del časa dela na preventivnih programih ali na drugih dejavnostih (recimo zobozdravnik za odrasle in mladino).",
     "yourLocation": "Tvoja lokacija",