npm - fhir-react - Versions diffs - 0.2.1 → 0.3.0 - Mend

fhir-react 0.2.1 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (163) hide show

package/src/components/resources/MedicationKnowledge/MedicationKnowledge.js ADDED Viewed

@@ -0,0 +1,217 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import _get from 'lodash/get';
+import UnhandledResourceDataStructure from '../UnhandledResourceDataStructure';
+import fhirVersions from '../fhirResourceVersions';
+import { getExtension, isBoolean } from './utils';
+import {
+  Root,
+  Header,
+  Title,
+  Value,
+  Body,
+  Badge,
+  ValueSection,
+} from '../../ui';
+import Reference from '../../datatypes/Reference';
+import CodeableConcept from '../../datatypes/CodeableConcept';
+const commonDTO = fhirResource => {
+  const id = _get(fhirResource, 'id');
+  const code = _get(fhirResource, 'code');
+  const status = _get(fhirResource, 'status');
+  const manufacturer = _get(fhirResource, 'manufacturer');
+  const amount = _get(fhirResource, 'amount');
+  const synonym = _get(fhirResource, 'synonym');
+  return {
+    id,
+    code,
+    status,
+    manufacturer,
+    amount,
+    synonym,
+  };
+};
+const daVinciPDex = fhirResource => {
+  const extension = _get(fhirResource, 'extension', []);
+  const hasExtensions = extension.length > 0;
+  if (hasExtensions) {
+    const usdfPriorAuthorization = _get(
+      getExtension('usdf-PriorAuthorization-extension', extension),
+      'valueBoolean',
+    );
+    const usdfStepTherapyLimit = _get(
+      getExtension('usdf-StepTherapyLimit-extension', extension),
+      'valueBoolean',
+    );
+    const usdfQuantityLimit = _get(
+      getExtension('usdf-QuantityLimit-extension', extension),
+      'valueBoolean',
+    );
+    const usdfPlanID = _get(
+      getExtension('usdf-PlanID-extension', extension),
+      'valueString',
+    );
+    const usdfDrugTierID = _get(
+      getExtension('usdf-DrugTierID-extension', extension),
+      'valueCodeableConcept',
+    );
+    return {
+      hasExtensions,
+      usdfPriorAuthorization,
+      usdfStepTherapyLimit,
+      usdfQuantityLimit,
+      usdfPlanID,
+      usdfDrugTierID,
+    };
+  }
+  return {
+    hasExtensions,
+  };
+};
+const resourceDTO = (fhirVersion, fhirResource, withDaVinciPDex) => {
+  switch (fhirVersion) {
+    case fhirVersions.DSTU2:
+    case fhirVersions.STU3: {
+      throw Error(
+        `${fhirVersion} FHIR version is not supported for this resource.`,
+      );
+    }
+    case fhirVersions.R4: {
+      const dto = {
+        ...commonDTO(fhirResource),
+      };
+      if (withDaVinciPDex) {
+        return {
+          ...dto,
+          ...daVinciPDex(fhirResource),
+        };
+      }
+      return dto;
+    }
+    default:
+      throw Error('Unrecognized the fhir version property type.');
+  }
+};
+const MedicationKnowledge = props => {
+  const { fhirResource, fhirVersion, withDaVinciPDex = false } = props;
+  let fhirResourceData = {};
+  try {
+    fhirResourceData = resourceDTO(fhirVersion, fhirResource, withDaVinciPDex);
+  } catch (error) {
+    console.warn(error.message);
+    return (
+      <UnhandledResourceDataStructure resourceName="MedicationKnowledge" />
+    );
+  }
+  const {
+    id,
+    code,
+    status,
+    manufacturer,
+    amount,
+    synonym,
+    hasExtensions,
+    usdfPriorAuthorization,
+    usdfStepTherapyLimit,
+    usdfQuantityLimit,
+    usdfPlanID,
+    usdfDrugTierID,
+  } = fhirResourceData;
+  let amountDisplay = '';
+  if (amount && amount.value) {
+    amountDisplay = amount.value;
+    amountDisplay = amount.unit
+      ? `${amountDisplay} ${amount.unit}`
+      : amountDisplay;
+  }
+  return (
+    <Root name="MedicationKnowledge">
+      <Header>
+        <Title>
+          {id ? `Medication knowledge ID: ${id}` : 'Medication knowledge'}{' '}
+          {status && <Badge data-testid="status">{status}</Badge>}
+        </Title>
+      </Header>
+      <Body>
+        {code && (
+          <Value label="Code" data-testid="code">
+            <CodeableConcept fhirData={code} />
+          </Value>
+        )}
+        {manufacturer && (
+          <Value label="Manufacturer" data-testid="manufacturer">
+            <Reference fhirData={manufacturer} />
+          </Value>
+        )}
+        {amountDisplay && (
+          <Value label="Amount" data-testid="amount">
+            {amountDisplay}
+          </Value>
+        )}
+        {synonym && (
+          <Value label="Synonym" data-testid="synonym">
+            {synonym}
+          </Value>
+        )}
+        {hasExtensions && (
+          <ValueSection label="USDF extensions" data-testid="usdfExtensions">
+            {isBoolean(usdfPriorAuthorization) && (
+              <Value
+                label="Prior Authorization"
+                data-testid="usdfPriorAuthorization"
+              >
+                {usdfPriorAuthorization === true ? 'yes' : 'no'}
+              </Value>
+            )}
+            {isBoolean(usdfStepTherapyLimit) && (
+              <Value
+                label="Step Therapy Limit"
+                data-testid="usdfStepTherapyLimit"
+              >
+                {usdfStepTherapyLimit === true ? 'yes' : 'no'}
+              </Value>
+            )}
+            {isBoolean(usdfQuantityLimit) && (
+              <Value label="Quantity Limit" data-testid="usdfQuantityLimit">
+                {usdfQuantityLimit === true ? 'yes' : 'no'}
+              </Value>
+            )}
+            {usdfPlanID && (
+              <Value label="Plan ID" data-testid="usdfPlanID">
+                {usdfPlanID}
+              </Value>
+            )}
+            {usdfDrugTierID && (
+              <Value label="Drug Tier ID" data-testid="usdfDrugTierID">
+                <CodeableConcept fhirData={usdfDrugTierID} />
+              </Value>
+            )}
+          </ValueSection>
+        )}
+      </Body>
+    </Root>
+  );
+};
+MedicationKnowledge.propTypes = {
+  fhirResource: PropTypes.shape({}).isRequired,
+  fhirVersion: PropTypes.oneOf([fhirVersions.R4]).isRequired,
+  withDaVinciPDex: PropTypes.bool,
+};
+export default MedicationKnowledge;

package/src/components/resources/MedicationKnowledge/MedicationKnowledge.stories.js ADDED Viewed

@@ -0,0 +1,78 @@
+import React from 'react';
+import { object } from '@storybook/addon-knobs';
+import MedicationKnowledge from './MedicationKnowledge';
+import fhirVersions from '../fhirResourceVersions';
+import example1R4 from '../../../fixtures/r4/resources/medicationKnowledge/example1.json';
+import example2R4 from '../../../fixtures/r4/resources/medicationKnowledge/example2.json';
+import example3R4 from '../../../fixtures/r4/resources/medicationKnowledge/example3.json';
+import example4R4 from '../../../fixtures/r4/resources/medicationKnowledge/example4.json';
+export default {
+  title: 'MedicationKnowledge',
+};
+export const DefaultVisualizationR4 = () => {
+  const fhirResource = object('Resource', example1R4);
+  return (
+    <MedicationKnowledge
+      fhirVersion={fhirVersions.R4}
+      fhirResource={fhirResource}
+    />
+  );
+};
+export const ExampleR4WithoutDaVinciPDex = () => {
+  const fhirResource = object('Resource', example2R4);
+  return (
+    <MedicationKnowledge
+      fhirVersion={fhirVersions.R4}
+      fhirResource={fhirResource}
+    />
+  );
+};
+export const ExampleR4WithDaVinciPDex = () => {
+  const fhirResource = object('Resource', example2R4);
+  return (
+    <MedicationKnowledge
+      fhirVersion={fhirVersions.R4}
+      fhirResource={fhirResource}
+      withDaVinciPDex
+    />
+  );
+};
+export const Example2R4 = () => {
+  const fhirResource = object('Resource', example3R4);
+  return (
+    <MedicationKnowledge
+      fhirVersion={fhirVersions.R4}
+      fhirResource={fhirResource}
+    />
+  );
+};
+export const Example3R4WithDaVinciPDex = () => {
+  const fhirResource = object('Resource', example4R4);
+  return (
+    <MedicationKnowledge
+      fhirVersion={fhirVersions.R4}
+      fhirResource={fhirResource}
+      withDaVinciPDex
+    />
+  );
+};
+export const ExampleWithoutFHIRVersionProperty = () => {
+  const fhirResource = object('Resource', example3R4);
+  return <MedicationKnowledge fhirResource={fhirResource} />;
+};
+export const ExampleWithUnsupportedFHIRVersionProperty = () => {
+  const fhirResource = object('Resource', example4R4);
+  return (
+    <MedicationKnowledge
+      fhirVersion={fhirVersions.DSTU2}
+      fhirResource={fhirResource}
+    />
+  );
+};

package/src/components/resources/MedicationKnowledge/MedicationKnowledge.test.js ADDED Viewed

@@ -0,0 +1,69 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { fhirVersions } from '../../../index';
+import MedicationKnowledge from './MedicationKnowledge';
+import example1R4 from '../../../fixtures/r4/resources/medicationKnowledge/example1.json';
+import example2R4 from '../../../fixtures/r4/resources/medicationKnowledge/example2.json';
+describe('should render MedicationKnowledge component properly', () => {
+  it('should render with R4 source data', () => {
+    const defaultProps = {
+      fhirResource: example1R4,
+      fhirVersion: fhirVersions.R4,
+    };
+    const { container, getByTestId } = render(
+      <MedicationKnowledge {...defaultProps} />,
+    );
+    expect(container).not.toBeNull();
+    expect(getByTestId('title').textContent).toContain('example');
+    expect(getByTestId('status').textContent).toContain('active');
+    expect(getByTestId('code').textContent).toContain('Vancomycin');
+    expect(getByTestId('manufacturer').textContent).toContain('#org4');
+    expect(getByTestId('amount').textContent).toContain('50');
+    expect(getByTestId('synonym').textContent).toContain('Vancomycin');
+  });
+  it('should render R4 without daVinci PDex profile', () => {
+    const defaultProps = {
+      fhirResource: example2R4,
+      fhirVersion: fhirVersions.R4,
+    };
+    const { container, getByTestId, queryByTestId } = render(
+      <MedicationKnowledge {...defaultProps} />,
+    );
+    expect(container).not.toBeNull();
+    expect(getByTestId('code').textContent).toContain('ibuprofen');
+    expect(queryByTestId('usdfExtensions')).toBeNull();
+  });
+  it('should render R4 with daVinci PDex profile', () => {
+    const defaultProps = {
+      fhirResource: example2R4,
+      fhirVersion: fhirVersions.R4,
+      withDaVinciPDex: true,
+    };
+    const { container, getByTestId, queryByTestId } = render(
+      <MedicationKnowledge {...defaultProps} />,
+    );
+    expect(container).not.toBeNull();
+    expect(getByTestId('code').textContent).toContain('ibuprofen');
+    expect(queryByTestId('usdfExtensions')).not.toBeNull();
+    expect(getByTestId('usdfPriorAuthorization').textContent).toContain('no');
+    expect(getByTestId('usdfStepTherapyLimit').textContent).toContain('no');
+    expect(getByTestId('usdfQuantityLimit').textContent).toContain('no');
+    expect(getByTestId('usdfPlanID').textContent).toContain('Kansas');
+    expect(getByTestId('usdfDrugTierID').textContent).toContain(
+      '(preferred-generic)',
+    );
+  });
+});

package/src/components/resources/MedicationKnowledge/index.js ADDED Viewed

@@ -0,0 +1,3 @@
+import MedicationKnowledge from './MedicationKnowledge';
+export default MedicationKnowledge;

package/src/components/resources/MedicationKnowledge/utils.js ADDED Viewed

@@ -0,0 +1,8 @@
+const getExtension = (key, extensions) => {
+  const result = extensions.find(item => item.url && item.url.includes(key));
+  return Boolean(result) ? result : null;
+};
+const isBoolean = value => value === true || value === false;
+export { getExtension, isBoolean };

package/src/components/resources/MedicationRequest/MedicationRequest.test.js CHANGED Viewed

@@ -28,7 +28,7 @@ describe('should render MedicationRequest component properly', () => {
       'Take one tablet',
     );
     expect(getByTestId('requester').textContent).toContain('Patrick Pump');
-    expect(getByTestId('created').textContent).toEqual('2015-03-01');
+    expect(getByTestId('created').textContent).toEqual('3/1/2015');
     expect(getByTestId('intent').textContent).toEqual('order');
   });
   it('should render with STU3 source data in which medicationReference key does not exist', () => {
@@ -59,7 +59,7 @@ describe('should render MedicationRequest component properly', () => {
       'Take one tablet',
     );
     expect(getByTestId('requester').textContent).toContain('Patrick Pump');
-    expect(getByTestId('created').textContent).toEqual('2015-03-01');
+    expect(getByTestId('created').textContent).toEqual('3/1/2015');
     expect(getByTestId('intent').textContent).toEqual('order');
   });
@@ -79,7 +79,7 @@ describe('should render MedicationRequest component properly', () => {
       'Take 4 tablets daily',
     );
     expect(getByTestId('requester').textContent).toContain('Patrick Pump');
-    expect(getByTestId('created').textContent).toEqual('2015-01-15');
+    expect(getByTestId('created').textContent).toEqual('1/15/2015');
     expect(getByTestId('intent').textContent).toEqual('order');
   });
@@ -101,7 +101,7 @@ describe('should render MedicationRequest component properly', () => {
       '6 mg PO daily for remission',
     );
     expect(getByTestId('requester').textContent).toContain('Patrick Pump');
-    expect(getByTestId('created').textContent).toEqual('2015-01-15');
+    expect(getByTestId('created').textContent).toEqual('1/15/2015');
     expect(getByTestId('intent').textContent).toEqual('order');
   });
 });

package/src/components/resources/Observation/Observation.js CHANGED Viewed

@@ -2,16 +2,17 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import _get from 'lodash/get';
-import _isFinite from 'lodash/isFinite';
+import _isEmpty from 'lodash/isEmpty';
+import Accordion from '../../containers/Accordion';
 import Coding from '../../datatypes/Coding';
 import Date from '../../datatypes/Date';
 import ObservationGraph from './ObservationGraph';
 import {
   Root,
   Header,
-  Title,
   Badge,
   BadgeSecondary,
+  ValueUnit,
   Body,
   Value,
 } from '../../ui';
@@ -23,6 +24,7 @@ const Observation = props => {
   const codeCodingDisplay = _get(fhirResource, 'code.coding.0.display');
   const codeText = _get(fhirResource, 'code.text', '');
   const valueQuantityValue = _get(fhirResource, 'valueQuantity.value', '');
+  const issued = _get(fhirResource, 'issued', '');
   const valueQuantityUnit = _get(fhirResource, 'valueQuantity.unit', '');
   const status = _get(fhirResource, 'status', '');
   const valueCodeableConceptText = _get(
@@ -41,68 +43,84 @@ const Observation = props => {
   let valueQuantityValueNumber = valueQuantityValue;
-  if (
-    _isFinite(Number(props.digitsToRoundForQuantity)) &&
-    valueQuantityValue !== '' &&
-    _isFinite(Number(valueQuantityValue))
-  ) {
-    valueQuantityValueNumber = Number(valueQuantityValue).toFixed(
-      props.digitsToRoundForQuantity,
-    );
-  }
-  const valueQuantityString = `${valueQuantityValueNumber}${valueQuantityUnit}`.trim();
   const subject = _get(fhirResource, 'subject');
+  const tableData = [
+    {
+      label: 'Issued on',
+      testId: 'issuedOn',
+      data: effectiveDate && <Date fhirData={effectiveDate} isBlack />,
+      status: effectiveDate,
+    },
+    {
+      label: 'Subject',
+      testId: 'subject',
+      data: subject && <Reference fhirData={subject} />,
+      status: subject,
+    },
+    {
+      label: 'Coding',
+      testId: 'coding',
+      data: valueCodeableConceptCoding.map((coding, i) => (
+        <Coding fhirData={coding} key={`value-coding-${i}`} />
+      )),
+      status: !_isEmpty(valueCodeableConceptCoding),
+    },
+  ];
   return (
     <Root name="Observation">
-      <Header>
-        <Title>
-          {codeCodingDisplay || codeText}
-          {valueQuantityString && (
-            <>
-              &nbsp;
-              <code data-testid="valueQuantity">{valueQuantityString}</code>
-            </>
-          )}
-        </Title>
-        {status && <Badge data-testid="status">{status}</Badge>}
-        {(valueCodeableConceptText || valueCodeableConceptCodingDisplay) && (
-          <BadgeSecondary data-testid="secondaryStatus">
-            {valueCodeableConceptText || valueCodeableConceptCodingDisplay}
-          </BadgeSecondary>
-        )}
-      </Header>
-      <Body>
-        <ObservationGraph
-          valueQuantity={fhirResource.valueQuantity}
-          referenceRange={fhirResource.referenceRange}
-        />
-        {effectiveDate && (
-          <Value label="Issued on" data-testid="issuedOn">
-            <Date fhirData={effectiveDate} />
-          </Value>
-        )}
-        {subject && (
-          <Value label="Subject" data-testid="subject">
-            <Reference fhirData={subject} />
-          </Value>
-        )}
-        {valueCodeableConceptCoding.map((coding, i) => (
-          <Coding fhirData={coding} key={`value-coding-${i}`} />
-        ))}
-      </Body>
+      <Accordion
+        headerContent={
+          <Header
+            resourceName={fhirResource.resourceType}
+            additionalContent={
+              issued && (
+                <Value label="Start date" data-testid="headerStartDate">
+                  <Date fhirData={issued} isBlack />
+                </Value>
+              )
+            }
+            prefixBadge={
+              <ValueUnit
+                valueQty={valueQuantityValueNumber}
+                valueUnit={valueQuantityUnit}
+              />
+            }
+            additionalBadge={
+              (valueCodeableConceptText ||
+                valueCodeableConceptCodingDisplay) && (
+                <BadgeSecondary data-testid="secondaryStatus">
+                  {valueCodeableConceptText ||
+                    valueCodeableConceptCodingDisplay}
+                </BadgeSecondary>
+              )
+            }
+            badges={status && <Badge data-testid="status">{status}</Badge>}
+            title={codeCodingDisplay || codeText}
+            rightAdditionalContent={
+              <ObservationGraph
+                valueQuantity={fhirResource.valueQuantity}
+                referenceRange={fhirResource.referenceRange}
+                small
+              />
+            }
+          />
+        }
+        bodyContent={
+          <Body tableData={tableData} reverseContent>
+            <ObservationGraph
+              valueQuantity={fhirResource.valueQuantity}
+              referenceRange={fhirResource.referenceRange}
+            />
+          </Body>
+        }
+      />
     </Root>
   );
 };
 Observation.propTypes = {
   fhirResource: PropTypes.shape({}).isRequired,
-  digitsToRoundForQuantity: PropTypes.number,
-};
-Observation.defaultProps = {
-  digitsToRoundForQuantity: 2,
 };
 export default Observation;

package/src/components/resources/Observation/Observation.test.js CHANGED Viewed

@@ -62,14 +62,14 @@ describe('should render component correctly', () => {
     );
     expect(getByTestId('status').textContent).toEqual('final');
     expect(getByTestId('secondaryStatus').textContent).toEqual('YES');
-    expect(getByTestId('issuedOn').textContent).toEqual('2016-05-18');
+    expect(getByTestId('issuedOn').textContent).toEqual('5/18/2016');
     expect(getByTestId('subject').textContent).toContain('Patient/infant');
     expect(queryByText(/373066001/g)).not.toBeNull();
   });
-  test('should round the quantity to default value of digitsToRoundForQuantity props ', () => {
+  test('should display not rounded value', () => {
     const resource = example1ObservationExcessR4;
-    resource.valueQuantity.value = 6.43534535434;
+    resource.valueQuantity.value = 6.443;
     const defaultProps = {
       fhirResource: example1ObservationExcessR4,
@@ -77,20 +77,8 @@ describe('should render component correctly', () => {
     const { getByTestId } = render(<Observation {...defaultProps} />);
     expect(getByTestId('valueQuantity')).not.toBeNull();
-    expect(getByTestId('valueQuantity').textContent).toEqual('6.44mmol/l');
-  });
-  test('should round the quantity to specific value of digitsToRoundForQuantity props ', () => {
-    const resource = example1ObservationExcessR4;
-    resource.valueQuantity.value = 6.43534535434;
-    const defaultProps = {
-      fhirResource: example1ObservationExcessR4,
-      digitsToRoundForQuantity: 3,
-    };
-    const { getByTestId } = render(<Observation {...defaultProps} />);
-    expect(getByTestId('valueQuantity')).not.toBeNull();
-    expect(getByTestId('valueQuantity').textContent).toEqual('6.435mmol/l');
+    expect(getByTestId('valueQuantity').textContent).toEqual('6.443');
+    expect(getByTestId('valueQuantityUnit')).not.toBeNull();
+    expect(getByTestId('valueQuantityUnit').textContent).toEqual('mmol/l');
   });
 });