CM-453: added working selection fields based on programme schema

src/components/dialogs/DeduplicationFieldSelectionDialog.js

@@ -25,6 +25,7 @@ function DeduplicationFieldSelectionDialog({
 }) {
   if (!benefitPlan) return null;
 
+  const [selectedValues, setSelectedValues] = useState([]);
   const [isOpen, setIsOpen] = useState(false);
 
   const handleOpen = () => {
@@ -35,6 +36,10 @@ function DeduplicationFieldSelectionDialog({
     setIsOpen(false);
   };
 
+  const handlePickerChange = (selectedOptions) => {
+    setSelectedValues(selectedOptions);
+  };
+
   return (
     <>
       <Button
@@ -69,9 +74,10 @@ function DeduplicationFieldSelectionDialog({
         <DialogContent>
           <DeduplicationFieldPicker
             required
-            value={[]}
+            value={selectedValues}
             module="deduplication"
-            onChange={() => []}
+            benefitPlan={benefitPlan}
+            onChange={handlePickerChange}
           />
         </DialogContent>
         <DialogActions

src/components/pickers/DeduplicationFieldPicker.js

@@ -1,8 +1,10 @@
 import React, { useState } from 'react';
-import { useGraphqlQuery, useTranslations, Autocomplete } from '@openimis/fe-core';
+import { useTranslations, Autocomplete } from '@openimis/fe-core';
+import { BASIC_FIELDS } from '../../constants';
 
 function DeduplicationFieldPicker({
   readOnly,
+  benefitPlan,
   value,
   onChange,
   required,
@@ -17,28 +19,24 @@ function DeduplicationFieldPicker({
   const [searchString, setSearchString] = useState();
   const { formatMessage } = useTranslations('deduplication');
 
-  const { isLoading, data, error } = useGraphqlQuery(
-    `
-  `,
-    { str: searchString },
-  );
-
-  const roles = data?.role?.edges.map((edge) => edge.node) ?? [];
-  const uniqueValues = [...new Map(value?.map((role) => [role.id, role])).values()];
+  const beneficiaryDataSchema = JSON.parse(benefitPlan?.beneficiaryDataSchema);
+  const schemaFields = Object.keys(beneficiaryDataSchema?.properties ?? {});
+  const schemaFieldsList = schemaFields.map((key) => ({ id: key, name: key }));
+  const possibleFields = [...schemaFieldsList, ...BASIC_FIELDS];
 
   return (
     <Autocomplete
       multiple={multiple}
       required={required}
       placeholder={placeholder ?? formatMessage('deduplication.deduplicate.fields.placeholder')}
       label={label ?? formatMessage('deduplication.deduplicate.fields')}
-      error={error}
+      error={[]}
       withLabel={withLabel}
       withPlaceholder={withPlaceholder}
       readOnly={readOnly}
-      options={roles}
-      isLoading={isLoading}
-      value={uniqueValues}
+      options={possibleFields}
+      isLoading={false}
+      value={value}
       getOptionLabel={(o) => o?.name}
       onChange={(option) => onChange(option, option?.name)}
       filterOptions={filterOptions}

src/constants.js

@@ -0,0 +1,6 @@
+export const BASIC_FIELDS = [
+  { id: 'first_name', name: 'first_name' },
+  { id: 'last_name', name: 'last_name' },
+  { id: 'dob', name: 'dob' },
+];
+export const MODULE_NAME = 'Deduplication';