Custom Cards

The customCards config defines the list of Custom cards that Workspaces will display on the Details screen in the Custom cards section.

info

• A Custom card doesn't appear if there isn't any data available to display.
• A horizontal scrollbar appears if the content exceeds the width of the card.
• Custom cards support links in key-value pairs.

Example

The following example shows three ways to configure the customCards property.

• Using a mapping string.
• Inserting the definition object directly into the properties array with a list of property mappings.
• Inserting the whole definition object without using any mappings.

Example - Txn properties

{
  "properties": {
    "FundingAmount": "$25,000",
    "FundingType": "ACH",
    "GenericContent": "[{\"type\": \"Identity verification\",\"pdfContent\": \"https://tm.workspaces.avoka-transact.com/workspaces/servlet/FormReceipt.pdf?submitKey=54cb2ad573303fedd0044cba2208223f\"},{\"type\": \"Driver licence\",\"pdfContent\": \"https://tm.workspaces.avoka-transact.com/workspaces/servlet/FormReceipt.pdf?submitKey=54cb2ad573303fedd0044cba2208223f\"}]",
    "EmailList": "[{\"name\": \"AO402.1.AVOKA\",\"dateAttempted\": \"05/30/2018 14:55:01\",\"emailSent\": \"true\"}]"
  }
}

Example - Global mappings config

{
  "mappings": {
    "$applicantValidations": {
      "label": "Applicant validations",
      "dataSource": "properties['GenericContent']",
      "foreach": true,
      "properties": [
        {
          "label": "Type",
          "dataIndex": "type",
          "type": "text"
        },
        {
          "label": "View PDF",
          "link": {
            "dataIndex": "pdfContent",
            "type": "pdf"
          }
        }
      ]
    },
    "$fundingType": {
      "label": "Type",
      "dataIndex": "properties['FundingType']",
      "type": "text"
    },
    "$fundingAmount": {
      "label": "Amount",
      "dataIndex": "properties['FundingAmount']",
      "type": "text"
    }
  }
}

Example - CustomCards config

{
  "customCards": [
    "$applicantValidations",
    {
      "label": "Funding Status",
      "properties": ["$fundingType", "$fundingAmount"]
    },
    {
      "label": "Sent Emails",
      "dataSource": "properties['EmailList']",
      "foreach": true,
      "properties": [
        {
          "label": "Name",
          "link": {
            "dataIndex": "name",
            "type": "text"
          }
        },
        {
          "label": "Delivery Status",
          "link": {
            "dataIndex": "emailSent",
            "type": "text"
          }
        }
      ]
    }
  ]
}

Properties

Custom Card

Property	Descriptions
label	String (Default: null) Required. The text to display as the custom card title.
dataSource	String (Default: null) Used to define a deep data source. The value of this property must be formatted as a JSON string.
foreach	Boolean (Default: false) Used to loop through a deep data source.
properties	Array<Mapping> (Default: []) Required. List of Mapping Objects or Mapping keys.