Merge pull request #20 from cph-cachet/feature/new-expected-participa…

…nt-data

New expected participant data

package.json

@@ -22,9 +22,10 @@
     "@types/uuid": "^9.0.8",
     "@vitejs/plugin-react": "^4.3.1",
     "add": "^2.0.6",
-    "axios": "^1.7.2",
+    "axios": "^1.6.8",
     "axios-mock-adapter": "^1.22.0",
     "cross-env": "^7.0.3",
+    "eslint": "8.57.1",
     "jwt-decode": "^4.0.0",
     "typescript": "^5.4.5",
     "vite": "^5.3.0",
@@ -35,7 +36,7 @@
     "@babel/plugin-transform-react-jsx-self": "^7.24.7",
     "@babel/plugin-transform-react-jsx-source": "^7.24.7",
     "@carp-dk/authentication-react": "^1.0.1",
-    "@carp-dk/client": "1.2.0",
+    "@carp-dk/client": "1.3.0",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
     "@js-joda/core": "^5.6.2",
@@ -55,6 +56,8 @@
     "express": "^4.19.2",
     "form-data": "^4.0.0",
     "formik": "^2.4.6",
+    "i18n-iso-countries": "^7.12.0",
+    "libphonenumber-js": "^1.11.11",
     "material-react-table": "^2.13.0",
     "oidc-client-ts": "^3.0.1",
     "papaparse": "^5.4.1",

src/assets/inputTypeNames.ts

@@ -1,14 +1,15 @@
 const enUS: { [key: string]: string } = {
+  sex: "Biological Sex",
+  informed_consent: "Informed Consent",
+  phone_number: "Phone Number",
+  ssn: "Social Security Number",
+  full_name: "Full Name",
+  address: "Address",
+  diagnosis: "Diagnosis",
+};
 
-    sex: "Biological Sex",
-    informed_consent: "Informed Consent",
-    phone_number: "Phone Number",
-    ssn: "Social Security Number",
-    full_name: "Full Name",
-    address: "Address",
-    diagnosis: "Diagnosis",
+const getInputDataName = (key: string): string => {
+  return enUS[key] || key;
 };
 
-export const getInputDataName = (key: string): string => {
-    return enUS[key] || key;
-}
+export default getInputDataName;

src/assets/languageMap.ts

@@ -1,4 +1,9 @@
 import * as flags from "react-flags-select";
+import { getCountries, getCountryCallingCode } from "libphonenumber-js";
+import isoCountries from "i18n-iso-countries";
+import en from "i18n-iso-countries/langs/en.json";
+
+isoCountries.registerLocale(en);
 
 type Flags = typeof flags;
 type FlagKey = keyof Flags;
@@ -92,3 +97,24 @@ export const getCountry = (key: string): string => {
   }
   return "Unknown Language";
 };
+
+export interface CountryInfo {
+  name: string;
+  isoCode: string;
+  dialCode: string;
+}
+
+export const countryInfos = ((): CountryInfo[] => {
+  const countries = getCountries();
+
+  return countries.map((isoCode) => {
+    const dialCode = getCountryCallingCode(isoCode);
+    const name = isoCountries.getName(isoCode, "en") || "Unknown";
+
+    return {
+      name,
+      isoCode,
+      dialCode: `+${dialCode}`,
+    };
+  });
+})();

src/pages/Deployments/ParticipantRecord/index.tsx

@@ -49,21 +49,13 @@ const ParticipantRecord = ({
   );
   const participantDeviceType = primaryDevice.device.__type;
   const deviceStatus = primaryDevice.__type.split(".").pop();
-  if (participantData.firstName === undefined) {
-    participantData.firstName = "";
-  }
-  if (participantData.lastName === undefined) {
-    participantData.lastName = "";
-  }
 
   const lastDataUpload = useMemo(() => {
     const lastData = participantData.dateOfLastDataUpload;
     if (!lastData) {
       return "";
     }
-    const elapsedDays = calculateDaysPassedFromDate(
-      lastData.toString(),
-    );
+    const elapsedDays = calculateDaysPassedFromDate(lastData.toString());
     if (elapsedDays === 0) {
       return "Last data: Today";
     }
@@ -80,8 +72,7 @@ const ParticipantRecord = ({
     >
       <AccountIcon>
         <Initials variant="h4">
-          {participantData.firstName === "" ||
-          participantData.firstName === null
+          {participantData.firstName
             ? participantRole[0]
             : `${participantData.firstName[0]}${participantData.lastName[0]}`}
         </Initials>

src/pages/Participant/Deployment/index.tsx

@@ -62,16 +62,11 @@ const Deployment = () => {
     createSummary.mutateAsync({ studyId, deploymentIds: [deploymentId] });
   };
 
-  const lastDataUpload = (lastData: Date
-  ) => {
+  const lastDataUpload = (lastData: Date) => {
     if (!lastData) {
       return "";
     }
-    if (
-      calculateDaysPassedFromDate(
-        lastData.toString(),
-      ) === 0
-    ) {
+    if (calculateDaysPassedFromDate(lastData.toString()) === 0) {
       return "Last data: Today";
     }
     return `Last data: ${calculateDaysPassedFromDate(lastData.toString())} days ago`;
@@ -127,7 +122,7 @@ const Deployment = () => {
     if (
       participant.firstName === "" ||
       participant.lastName === "" ||
-      !participant.firstName || 
+      !participant.firstName ||
       !participant.lastName
     ) {
       return participant.role ? participant.role[0] : "?";

src/pages/Participant/InformedConsent/index.tsx

@@ -1,10 +1,10 @@
 import CarpErrorCardComponent from "@Components/CarpErrorCardComponent";
-import { useParticipantConsent } from "@Utils/queries/participants";
 import { formatDateTime } from "@Utils/utility";
 import FileDownloadOutlinedIcon from "@mui/icons-material/FileDownloadOutlined";
 import { Typography } from "@mui/material";
 import { useEffect, useMemo, useState } from "react";
 import { useParams } from "react-router-dom";
+import { useGetParticipantData } from "@Utils/queries/participants";
 import LoadingSkeleton from "../LoadingSkeleton";
 import {
   DownloadButton,
@@ -22,13 +22,13 @@ interface FileInfo {
 }
 
 const InformedConsent = () => {
-  const { deploymentId } = useParams(); // need to somehow get the role
+  const { deploymentId } = useParams();
 
   const {
-    data: consents,
+    data: participantData,
     isLoading,
     error,
-  } = useParticipantConsent(deploymentId);
+  } = useGetParticipantData(deploymentId);
   const [consent, setConsent] = useState(null);
 
   const downloadFile = ({ data, fileName, fileType }: FileInfo) => {
@@ -56,14 +56,21 @@ const InformedConsent = () => {
 
   useEffect(() => {
     if (!isLoading) {
-      // TODO: Get the consent for the current user
-      setConsent(consents[consents.length - 1]);
+      if (participantData.common.keys) {
+        const consentData = participantData.common.values.toArray().find(
+          (v) =>
+            // eslint-disable-next-line no-underscore-dangle
+            (v as unknown as any)?.__type ===
+            "dk.carp.webservices.input.informed_consent",
+        );
+        setConsent(consentData);
+      }
     }
-  }, [consents]);
+  }, [participantData]);
 
   const dateOfLastUpdate = useMemo(() => {
     if (consent) {
-      return `Last Updated: ${formatDateTime(consent.updated_at, {
+      return `Last Updated: ${formatDateTime(consent.signedTimestamp, {
         year: "numeric",
         month: "numeric",
         day: "numeric",