diff --git a/src/components/DoctorCard/index.js b/src/components/DoctorCard/index.js index 2feda124..79ea8fc2 100644 --- a/src/components/DoctorCard/index.js +++ b/src/components/DoctorCard/index.js @@ -1,4 +1,5 @@ import { memo } from 'react'; +import slugify from 'slugify'; import CardContent from '@mui/material/CardContent'; import CardMedia from '@mui/material/CardMedia'; @@ -17,9 +18,11 @@ const DoctorCard = function DoctorCard({ doctor, isPage = false, isReportError } map.flyTo([lat, lon], 13); }; + const id = `${doctor.type}-${slugify(doctor.name).toLowerCase()}`; + if (isPage) { return ( - + @@ -33,11 +36,11 @@ const DoctorCard = function DoctorCard({ doctor, isPage = false, isReportError } } return ( - + ); }; -const propsAreEqual = (prevProps, nextProps) => prevProps.doctor.id === nextProps.doctor.id; +const propsAreEqual = (prevProps, nextProps) => prevProps.doctor.key === nextProps.doctor.key; export default memo(DoctorCard, propsAreEqual); diff --git a/src/components/Doctors/Map.js b/src/components/Doctors/Map.js index 2c49f6fd..24ab2a40 100644 --- a/src/components/Doctors/Map.js +++ b/src/components/Doctors/Map.js @@ -18,7 +18,7 @@ function withLeaflet(Component) { userLocation = false, ...other }) { - const markers = doctors?.map(doctor => ); + const markers = doctors?.map(doctor => ); const injectedProps = { center, zoom, diff --git a/src/components/Doctors/Markers.js b/src/components/Doctors/Markers.js index 26ef34fd..dd342bf0 100644 --- a/src/components/Doctors/Markers.js +++ b/src/components/Doctors/Markers.js @@ -40,7 +40,7 @@ const PopUpData = function PopUpData({ doctor }) { ); }; -const areEqual = (prevProps, nextProps) => prevProps.doctor.id === nextProps.doctor.id; +const areEqual = (prevProps, nextProps) => prevProps.doctor.key === nextProps.doctor.key; export const Doctor = memo(({ doctor }) => { const ref = createRef(null); const theme = useTheme(); diff --git a/src/services/doctors.js b/src/services/doctors.js index fccad8b8..3f0e687d 100644 --- a/src/services/doctors.js +++ b/src/services/doctors.js @@ -44,9 +44,6 @@ export function createDoctor(doctor, type, institution) { get key() { return uuid; }, - get id() { - return doctor.id; - }, get type() { return doctor.type; }, @@ -99,8 +96,6 @@ export default function createDoctors(doctorsDict, institutionsDict, typesDict) return acc; }, {}); - const getById = id => doctors[`${id}`]; - const doctorValues = Object.values(doctors); const doctorsValues = Intl.Collator ? doctorValues.sort((a, b) => new Intl.Collator('sl').compare(a.name, b.name)) @@ -125,7 +120,6 @@ export default function createDoctors(doctorsDict, institutionsDict, typesDict) return Object.freeze({ all: doctorsValues, - getById, types, filterByType, typesDict,