contact-summary.templated.js

Contact profile pages display basic information about the contact along with their history and upcoming tasks. A contact’s profile page is defined by the Fields, Cards, and Care Guides available.

Helper variables and functions for the contact summary can be defined in contact-summary-extras.js. There are several variables available to inspect to generate the summary information:

CHT API

Introduced in v3.12.0

Provides CHT-Core Framework’s functions to contact summary, targets and tasks. The API is available in the cht reserved variable under the v1 version.

CHT API’s code samples

const canEdit = cht.v1.hasPermissions('can_edit');
const canManagePlaces = cht.v1.hasPermissions(['can_create_places', 'can_update_places']);
const hasAnyGroup = cht.v1.hasAnyPermission([
    ['can_view_messages', 'can_view_message_action'], 
    ['can_view_reports', 'can_verify_reports']
]);

Contact Summary

Each field that can be shown on a contact’s profile is defined as an object in the fields array of contact-summary.templated.js. The properties for each object determine how and when the field is shown.

contact-summary.templated.js .fields[]

Condition Cards

Each condition card is defined as a card object in the cards array of contact-summary.templated.js. The properties for each object determine how and when the card and its fields are shown.

contact-summary.templated.js .cards[]

Care Guides

Each care guide accessible from a contact profile is defined as an App Form. Context information can be provided to forms via the context object of contact-summary.templated.js.

To show an App Form on a contact’s profile, the form’s expression field in its properties file must evaluate to true for that contact. The context infomation from the profile is accessible as the variable summary.

The context data is also available directly within the app forms’ XForm calculations, as instance('contact-summary')/context/${variable}. For instance if context.is_pregnant is used in the contact summary, it can be accessed in an XForm field’s calculation as instance('contact-summary')/context/is_pregnant. Note that these fields are not available when editing a previously completed form, or when accessing the form from outside of the profile page.

Code samples

The following samples show how fields, cards, and care guide context comes together in the contact-summary.templated.js file.

contact-summary.templated.js

module.exports = {
  context: {
    use_cases: {
      anc: isCoveredByUseCaseInLineage(lineage, 'anc'),
      pnc: isCoveredByUseCaseInLineage(lineage, 'pnc'),
    },
  },

  fields: [
    { appliesToType: 'person',  label: 'patient_id', value: contact.patient_id, width: 4 },
    { appliesToType: 'person',  label: 'contact.age', value: contact.date_of_birth, width: 4, filter: 'age' },
    { appliesToType: 'person',  label: 'contact.parent', value: lineage, filter: 'lineage' },
    { appliesToType: '!person', appliesIf: function() { return contact.parent && lineage[0]; }, label: 'contact.parent', value: lineage, filter: 'lineage' },
  ],

  cards: [
    {
      label: 'contact.profile.pregnancy',
      appliesToType: 'report',
      appliesIf: extras.isActivePregnancy,
      fields: [
        {
          label: 'contact.profile.edd',
          value: function(report) { return report.fields.edd_8601; },
          filter: 'relativeDay',
          width: 12
        },
        {
          label: 'contact.profile.visit',
          value: 'contact.profile.visits.of',
          translate: true,
          context: {
            count: function(report) { return extras.getSubsequentVisits(report).length; },
            total: 4,
          },
          width: 6,
        },
        {
          label: 'contact.profile.risk.title',
          value: function(report) { return extras.isHighRiskPregnancy(report) ? 'high' : 'normal'; },
          translate: true,
          width: 5,
          icon: function(report) { return extras.isHighRiskPregnancy(report) ? 'risk' : ''; },
        },
      ],
      modifyContext: function(ctx) {
        ctx.pregnant = true; // don't show Create Pregnancy Report button
      },
    },
  ],
};

contact-summary-extras.js

module.exports = {
  isActivePregnancy : function(report) {
    // ...
  },
  isCoveredByUseCaseInLineage: function(lineage, usecase) {
    // ...
  },
  isHighRiskPregnancy: function(report) {
    // ...
  },
  getSubsequentVisits: function(report) {
    // ...
  },
};

Build

To update the Contact profiles for an app, changes must be compiled into app-settings, then uploaded.

cht --local compile-app-settings backup-app-settings upload-app-settings

Related Content