Conversational Assessment

What is Conversational Assessment?

• An assessment is a set of questions that aim to improve the understanding of the condition of the patient.
• Conversational means that the questions are triggered one by one, as if you would have a conversation in person.

FHIR uses the term "questionnaire", which is the term we will use in a technical context.

Prerequisites

• Create a questionnaire in the questionnaire builder, note down the questionnaire ID.
• Prepare a screen where the user is authenticated.

Leverage the Questionnaire component

Use the <Questionnaire> component to ask a set of questions. The useQuestionnaireByName hook returns the matching questionnaire and a function to submit the response.

import { useQuestionnaireByName } from '@healthblocks-io/core/questionnaire'
import Questionnaire, { Progress } from '@healthblocks-io/native/Questionnaire'

function Example() {
  const navigation = useNavigation()
  const { data, submitResponse } = useQuestionnaireByName('intake')

  const onSubmit = useCallback(
    async (progress: Progress) => {
      await submitResponse(progress).catch(e => console.error(e))
      navigation.goBack()
    },
    [submitResponse]
  )

  if (!data) return null

  return (
    <Questionnaire
      questionnaire={data}
      onClose={navigation.goBack}
      onSubmit={onSubmit}
    />
  )
}

Customize the questions

If some questions are not relevant based on previous answers, consider removing those using the transform prop. Any transformation is possible: add, remove, reorder, translate questions... or even custom quick replies.

function Example(props) {
  return (
    <QuestionnaireComponent
      questionnaire={data}
      onClose={navigation.goBack}
      onSubmit={onSubmit}
      transform={({ questionnaire }) => ({
        ...questionnaire,
        // Skip the last 3 questions
        questions: questionnaire.questions.slice(-3),
      })}
    />
  )
}

Show my previous responses

Let's see if the response was actually saved by creating a page that shows all responses.

import useSWR from 'swr'

function Responses() {
  const fetcher = useFetcher()
  const responses = useSWR('/questionnaire-response', fetcher)

  return (
    <div className="responses">
      {responses.data?.map((response, key) => (
        <div className="response" key={key}>
          {response.questionnaire.title}
          {response.answers.map(answer => (
            <div className="response" key={key}>
              {answer.text}
            </div>
          ))}
        </div>
      ))}
    </div>
  )
}