QMS - Substitute Measure Functionality

services/app-api/forms/defaultMeasures.ts

@@ -104,7 +104,7 @@ export const defaultMeasureTemplates = {
     id: "LTSS-1",
     title: "LTSS-1: Comprehensive Assessment and Update",
     type: PageType.Measure,
-    substitutable: true,
+    substitutable: MeasureTemplateName["FASI-1"],
     sidebar: false,
     elements: [
       {
@@ -206,7 +206,6 @@ export const defaultMeasureTemplates = {
     id: "FFS",
     title: "LTSS-1: FFS LTSS Measure Results",
     type: PageType.MeasureResults,
-    substitutable: true,
     sidebar: false,
     elements: [
       {
@@ -218,6 +217,16 @@ export const defaultMeasureTemplates = {
         type: ElementType.Header,
         text: "Fee-For-Service Measure Results",
       },
+      {
+        type: ElementType.Accordion,
+        label: "Instructions",
+        value:
+          "[Optional instructional content that could support the user in completing this page]",
+      },
+      {
+        type: ElementType.SubHeader,
+        text: "FSS LTSS Measure Details",
+      },
       {
         type: ElementType.TextAreaField,
         label: "Which Medicaid HCBS programs are being reported? (optional)",
@@ -236,7 +245,7 @@ export const defaultMeasureTemplates = {
     title: "LTSS-2: Comprehensive Person-Centered Plan and Update",
     type: PageType.Measure,
     sidebar: false,
-    substitutable: true,
+    substitutable: MeasureTemplateName["FASI-2"],
     elements: [
       {
         type: ElementType.ButtonLink,
@@ -1126,7 +1135,7 @@ export const defaultMeasureTemplates = {
   [MeasureTemplateName["MLTSS"]]: {
     id: "MLTSS",
     title: "MLTSS: Plan All-Cause Readmission",
-    type: PageType.Measure,
+    type: PageType.MeasureResults,
     sidebar: false,
     elements: [
       {

services/app-api/forms/pomMeasures.ts

@@ -20,7 +20,7 @@ export const pomMeasures: MeasureOptions[] = [
     uid: "1822-2",
     required: true,
     stratified: false,
-    measureTemplate: MeasureTemplateName["POM-2"],
+    measureTemplate: [MeasureTemplateName["POM-2"]],
   },
 ];
 

services/app-api/types/reports.ts

@@ -85,7 +85,7 @@ export interface MeasurePageTemplate extends FormPageTemplate {
   required?: boolean;
   stratified?: boolean;
   optional?: boolean;
-  substitutable?: boolean;
+  substitutable?: string;
 }
 
 export interface SectionTemplate {

services/app-api/utils/reportValidation.ts

@@ -178,7 +178,7 @@ const measurePageTemplateSchema = formPageTemplateSchema.shape({
   required: boolean().notRequired(),
   stratified: boolean().notRequired(),
   optional: boolean().notRequired(),
-  substitutable: boolean().notRequired(),
+  substitutable: string().notRequired(),
 });
 
 const measureOptionsArraySchema = array().of(

services/app-api/utils/tests/mockReport.ts

@@ -45,7 +45,7 @@ export const invalidMeasureTemplatesReport = {
       id: "LTSS-1",
       title: "LTSS-1: Comprehensive Assessment and Update",
       //   type: PageType.Measure,
-      substitutable: true,
+      substitutable: MeasureTemplateName["FASI-1"],
       sidebar: false,
       elements: [
         {
@@ -141,7 +141,7 @@ export const invalidRadioCheckedChildrenReport = {
       id: "LTSS-1",
       title: "LTSS-1: Comprehensive Assessment and Update",
       type: PageType.Measure,
-      substitutable: true,
+      substitutable: MeasureTemplateName["FASI-2"],
       sidebar: false,
       elements: [
         {

services/ui-src/src/components/report/MeasureReplacementModal.tsx

@@ -1,32 +1,49 @@
-import {
-  ModalBody,
-  ModalFooter,
-  Button,
-  Stack,
-  Radio,
-  RadioGroup,
-} from "@chakra-ui/react";
+import { ModalBody, ModalFooter, Button } from "@chakra-ui/react";
 import React from "react";
+import { ChoiceList } from "@cmsgov/design-system";
+import { MeasurePageTemplate } from "types";
 
 export const MeasureReplacementModal = (
-  cmit: number | undefined,
+  measure: MeasurePageTemplate,
   onClose: Function,
   onSubmit: Function
 ): React.ReactFragment => {
+  let selectMeasure: MeasurePageTemplate | undefined;
+
+  const onChangeHandler = (event: React.ChangeEvent<HTMLInputElement>) => {
+    selectMeasure = event.target.value === "0" ? measure : undefined;
+  };
+
+  const name = measure.title.split(":")[0];
+  const label = `Do you want to substitute ${name} for ${measure.substitutable}`;
+
   return (
     <React.Fragment>
       <ModalBody>
-        Select alternate measure type for CMIT {cmit}
-        {/* @ts-ignore TODO */}
-        <RadioGroup onChange={() => {}} value={1}>
-          <Stack direction="column">
-            <Radio value="1">Measure Type One</Radio>
-            <Radio value="2">Measure Type Two</Radio>
-          </Stack>
-        </RadioGroup>
+        [hint text explaining what happens when substituting a measure]
+        <ChoiceList
+          name={"subsitute"}
+          type={"radio"}
+          label={label}
+          choices={[
+            {
+              label: "Yes",
+              value: 0,
+            },
+            {
+              label: "No",
+              value: 1,
+            },
+          ]}
+          onChange={onChangeHandler}
+        />
       </ModalBody>
       <ModalFooter gap="4">
-        <Button colorScheme="blue" mr={3} onClick={() => onSubmit(false)}>
+        <Button
+          colorScheme="blue"
+          mr={3}
+          onClick={() => onSubmit(selectMeasure)}
+        >
           Substitute Measure
         </Button>
         <Button variant="link" onClick={() => onClose(false)}>

services/ui-src/src/components/report/MeasureTable.tsx

@@ -17,7 +17,7 @@ import {
   MeasureTableTemplate,
   PageType,
 } from "types";
-import { useStore } from "utils";
+import { putReport, useStore } from "utils";
 import { PageElementProps } from "./Elements";
 
 export const MeasureTableElement = (props: PageElementProps) => {
@@ -35,11 +35,31 @@ export const MeasureTableElement = (props: PageElementProps) => {
       page.type === PageType.Measure
   );
 
-  const buildModal = (cmit: number | undefined) => {
+  const onSubstitute = async (selectMeasure: MeasurePageTemplate) => {
+    if (selectMeasure) {
+      const substitute = selectMeasure.substitutable?.toString();
+      const measure = measures.find((measure) =>
+        measure.title.includes(substitute!)
+      );
+      if (report && measure) {
+        measure.required = true;
+        measure.substitutable = selectMeasure.title.split(":")[0];
+
+        selectMeasure.required = false;
+        selectMeasure.substitutable = undefined;
+
+        await putReport(report);
+      }
+    }
+
+    setModalOpen(false);
+  };
+
+  const buildModal = (measure: MeasurePageTemplate) => {
     const modal = MeasureReplacementModal(
-      cmit,
+      measure,
       () => setModalOpen(false), // Close Action
-      () => setModalOpen(false) // Submit
+      onSubstitute // Submit
     ); // This will need the whole measure eventually
     setModalComponent(modal);
   };
@@ -66,9 +86,7 @@ export const MeasureTableElement = (props: PageElementProps) => {
         </Td>
         <Td>
           {measure.substitutable ? (
-            <Link onClick={() => buildModal(measure.cmit)}>
-              Substitute measure
-            </Link>
+            <Link onClick={() => buildModal(measure)}>Substitute measure</Link>
           ) : null}
         </Td>
 

services/ui-src/src/types/report.ts

@@ -82,7 +82,7 @@ export interface MeasurePageTemplate extends FormPageTemplate {
   required?: boolean;
   stratified?: boolean;
   optional?: boolean;
-  substitutable?: boolean;
+  substitutable?: string;
 }
 
 export interface StatusPageTemplate extends FormPageTemplate {

services/ui-src/src/utils/testing/setupJest.tsx

@@ -193,7 +193,7 @@ const mockMeasureTemplate: MeasurePageTemplate = {
   title: "mock-title",
   type: PageType.Measure,
   required: true,
-  substitutable: true,
+  substitutable: MeasureTemplateName["LTSS-2"],
   elements: [],
 };