Mobile and Web React Configuration - kwantu/platformconfiguration GitHub Wiki

Overview

User management in the mobile application is centrally handled by BetterData. Upon logging in, the application retrieves all communities the user has access to and verifies if the accessControl property in the applicationConfiguration matches the user’s role or is set to "*" (indicating any role).

Application Selector Page

Kwantu Mobile application lists all the applications on a page called ApplicationSelector page.

image image

Once you click on the application item in the list it opens a specific page defined under applicationConfiguration layoutV2 property. "layoutV2": "dashboard:BEEI:1:landing:layout"

image

There is standard structure of these files.

{
  "_id": "dashboard:BEEI:1:landing:layout",
  "_rev": "3-cdc79775db5187395585f387ba55ccfa",
  "filtersData": [],
  "migrationId": "14-16133b0d1c8f54795da25a0119e25ea9",
  "applicationId": "5b8aa9fd-709c-4d20-b48a-c65c3135d932:1",
  "context": "application",
  "communityName": "BEEI",
  "categoryToShow": "",
  "displayTitle": "Schools Application",
  "filterCount": "",
  "title": "BEEI",
  "type": "page",
  "adoptions": [],
  "templateArray": [
    {
      "width": 12,
      "height": 2,
      "x": 0,
      "y": 0,
      "customDataObject": {
        "config": {
          "contentRole": {
            "filter": "#APPLICATION_ID",
            "type": "subprofile",
            "targetPageUUID": "dashboard:BEEI:1:Schools_Details:layout"
          }
        },
        "widget": "dataList",
        "title": "User data"
      },
      "id": "node97892"
    }
  ]
}

Sample files mall in one. documents_backup.json

The templateArray stores all the components of a page. These components are independent, renderable units arranged in a top-to-bottom layout. The templateArray follows an array structure.

Multiple component types are supported within templateArray, and each component is identified by its "widget" property. Additionally, some components may have subtypes.

There are initially few widgets implemented

  • dataList

    • profileListing
    • subprofileListing
    • newInstanceListing
    • contentRole
    • favourites
    • participants
  • card

  • kul-react-sdo

  • process-view

  • task-dashboard

  • global-search


dataList - profileListing

{
    "width": 12,
    "height": 2,
    "x": 0,
    "y": 0,
    "customDataObject": {
        "config": {
            {
                "profileListing": {
                    "nullMessage": "",
                    "searchAvailable": true,
                    "titleField": "projectName", -- specifies the title displayed on the list must be from data model
                    "includeImageOnTop": true, -- if specified will look for "imageField" to render on top and will not be rendered on the field list
                    "displayStyledField": { -- field that will be displayed as styled from data model
                        "label": "Status",
                        "field": "projectStatus"
                    },
                    "descField": "projectType", -- field that will be displayed as description
                    "makeAsFavourite": true, -- if true mark favourite will appear
                    "showStatus": false, -- if true will show workflow status
                    "listStyle": "cardList", -- normalList/cardList
                    "uiView": "react", -- uiView to render in case of cardList
                    "filter1": {
                        "defaultField": "",
                        "filters": [
                            {
                                "filterField": "description",
                                "filterLabel": "Description"
                            },
                            {
                                "filterField": "projectSector.code",
                                "filterLabel": "Sector"
                            }
                        ]
                    },
                    "pagination": true,
                    "presetFilter1": [
                        {
                            "label": "Rehab & wells",
                            "filter": {
                                "values": [
                                    {
                                        "value": "1"
                                    },
                                    {
                                        "value": "3"
                                    }
                                ],
                                "field": "projectType.code"
                            }
                        },
                        {
                            "label": "Construction",
                            "filter": {
                                "values": [
                                    {
                                        "value": "2"
                                    }
                                ],
                                "field": "projectType.code"
                            }
                        }
                    ],
                    "profileStatus": false,
                    "targetPageUUID": "dashboard:GRM:3:Projects_Object:layout", -- next page once clicked
                    "setId": "publicPMISDetails:1", -- setId to render
                    "sort": { -- sort options
                        "order": "",
                        "field": "number<number>"
                    },
                    "imageField": "photosRepeat.photodef.photoData.photos" -- any image field or field from repeat
                }
            }
        },
        "widget": "dataList",
        "title": "Farms"
    },
    "id": "node97891"
}
image

dataList - subprofileListing

{
    "x": 0,
    "y": 0,
    "width": 12,
    "height": 2,
    "id": "node65458",
    "customDataObject": {
        "widget": "dataList",
        "title": "Growbeds",
        "config": {
            "subprofileListing": {
                "uiView": "card",
                "searchAvailable": true,
                "listStyle": "cardList",
                "includeImageOnTop": false,
                "imageField": "",
                "targetPageUUID": "dashboard:UF:2:GB_Object:layout",
                "filter1": {
                    "defaultField": "",
                    "filters": [
                        {
                            "filterLabel": "Name",
                            "filterField": "name"
                        },
                        {
                            "filterLabel": "Address",
                            "filterField": "address"
                        }
                    ]
                },
                "presetTabs1": [
                    {
                        "label": "Spinach",
                        "field": "currentCrop",
                        "values": [
                            "Spinach_Swiss Chard",
                            "a"
                        ]
                    },
                    {
                        "label": "Red cabbage",
                        "field": "currentCrop",
                        "values": [
                            "Red cabbage(Red cabbage)"
                        ]
                    }
                ],
                "sort": {
                    "field": "number<number>",
                    "order": ""
                },
                "makeAsFavourite": true,
                "pagination": true,
                "setId": "ufGrowBed:1",
                "category": "ufGrowBed:1",
                "nullMessage": ""
            }
        }
    }
}
image

dataList - newInstanceListing

{
    "width": 12,
    "height": 2,
    "x": 0,
    "y": 0,
    "customDataObject": {
        "config": {
            "newInstanceListing": {
                "nullMessage": "",
                "searchAvailable": true,
                "titleField": "title",
                "includeImageOnTop": false,
                "descField": "description",
                "makeAsFavourite": true,
                "subProcessId": "spCase",
                "processId": "Case",
                "showStatus": false,
                "listStyle": "cardList",
                "filter": {
                    "defaultField": "",
                    "filters": []
                },
                "uiView": "grid",
                "pagination": true,
                "targetPageUUID": "dashboard:GRM:3:Grievances_Object:layout",
                "setId": "grievance:1",
                "sort": {
                    "order": "",
                    "field": ""
                },
                "imageField": "evidence"
            }
        },
        "widget": "dataList",
        "title": "Farms"
    },
    "id": "node97891"
}

dataList - contentRole


{
    "width": 12,
    "height": 2,
    "x": 0,
    "y": 0,
    "customDataObject": {
        "config": {
            "contentRole": {
                "filter": "#APPLICATION_ID",
                "type": "subprofile", -- profile/subprofile
                "targetPageUUID": "dashboard:BEEI:1:Schools_Details:layout"
            }
        },
        "widget": "dataList",
        "title": "User data"
    },
    "id": "node97892"
}

<img width="323" alt="image" src="https://github.com/user-attachments/assets/c5d2875d-faf2-4277-8e98-5ee7f14bb263" />


dataList - favourites

{
    "width": 12,
    "height": 2,
    "x": 0,
    "y": 0,
    "customDataObject": {
        "config": {
            "favourites": {
                "config": [
                    {
                        "type": "profile",
                        "targetPageUUID": "dashboard:GRM:3:Projects_Object:layout"
                    },
                    {
                        "type": "subprofile",
                        "targetPageUUID": "",
                        "category": "aaa"
                    }
                ]
            }
        },
        "widget": "dataList",
        "title": "Favourites"
    },
    "id": "node97891"
}

dataList - participants


{
    "x": 0,
    "y": 0,
    "width": 12,
    "height": 2,
    "id": "node65458",
    "customDataObject": {
        "widget": "dataList",
        "title": "Growbeds",
        "config": {
            "participants": {
                "uiView": "card",
                "searchAvailable": false,
                "listStyle": "cardList",
                "includeImageOnTop": false,
                "imageField": "",
                "targetPageUUID": "dashboard:BEEI:1:Participants_Profile:layout",
                "sort": {
                    "field": "",
                    "order": ""
                },
                "makeAsFavourite": true,
                "pagination": true,
                "setId": "ufGrowBed:1",
                "category": "",
                "nullMessage": "No assistance added to this school."
            }
        }
    }
}


card

card has two styles, square boxes and list style

{
    "x": 0,
    "y": 0,
    "width": 3,
    "height": 2,
    "id": "node49831",
    "customDataObject": {
        "widget": "card",
        "title": "BankDetails",
        "config": {
            "list": {
                "targetPageUUID": "dashboard:BEEI:1:Contracts_Object:layout",
                "icon": "analysis.png",
                "type": "fullWidth",
                "title": "Participant contract details",
                "description": "View and update participant contract details to complete the process."
            }
        }
    }
}

{
    "x": 0,
    "y": 0,
    "width": 3,
    "height": 2,
    "id": "node49831",
    "customDataObject": {
        "widget": "card",
        "title": "Farm setup",
        "config": {
            "card": {
                "targetPageUUID": "dashboard:UF:1:Farm_Setup:layout",
                "icon": "analysis.png",
                "title": "Farm setup"
            }
        }
    }
},


kul-react-sdo

{
    "width": 12,
    "height": 2,
    "x": 0,
    "y": 0,
    "customDataObject": {
        "config": {
            "sdo": {
                "includeImageOnTop": false,
                "contextFilter": "",
                "acrossCommunity": false,
                "showStatus": false,
                "workflowStatus": "Yes",
                "objectTitle": "School",
                "uiView": "reactView",
                "canEdit": "Yes",
                "targetPageUUID": "dashboard:BEEI:1:School_Process:layout",
                "setId": "taSchool:1",
                "imageField": ""
            }
        },
        "widget": "kul-react-sdo",
        "title": "School"
    },
    "id": "node75097"
}

{
    "width": 12,
    "height": 2,
    "x": 0,
    "y": 0,
    "customDataObject": {
        "config": {
            "sdo": {
                "canCreateProcess": true,
                "process": {
                    "type": "newSequence",
                    "targetPageUUID": "dashboard:BEEI:1:Assistants_Process:layout",
                    "processId": "SchoolCandidateSelection",
                    "processLabel": "Select the assistants that will work at this school",
                    "processDescription": "Process not available. Create assistance process here.",
                    "button": {
                        "i18n": {
                            "en": "Capture assistance"
                        }
                    }
                },
                "includeImageOnTop": false,
                "contextFilter": "",
                "acrossCommunity": false,
                "showStatus": false,
                "workflowStatus": "Yes",
                "objectTitle": "Assistants Details",
                "uiView": "MReview",
                "canEdit": true,
                "targetPageUUID": "dashboard:BEEI:1:Assistants_Process:layout",
                "setId": "taCandidateSelection:1",
                "imageField": ""
            }
        },
        "widget": "kul-react-sdo",
        "title": "School"
    },
    "id": "node75097"
}

process-view

{
    "x": 0,
    "y": 0,
    "width": 12,
    "height": 2,
    "id": "node75099",
    "customDataObject": {
        "widget": "process-view",
        "config": {
            "edit": {
                "targetPageUUID": "dashboard:GRM:3:Survey_Process:layout"
            },
            "delete": {
                "targetPageUUID": ""
            },
            "process": {
                "processTitle": {
                    "setId": "pmisSocialAudit",
                    "field": "name",
                    "default": "New Survey"
                },
                "processDescription": {
                    "description": "",
                    "setId": "pmisSocialAudit",
                    "field": "other",
                    "label": "Other: "
                }
            }
        }
    }
}

task-dashboard


{
    "x": 0,
    "y": 0,
    "width": 12,
    "height": 2,
    "id": "node65458",
    "customDataObject": {
        "widget": "task-dashboard",
        "title": "Jobs",
        "config": {
            "TaskDashboard": {
                "scope": "profile"
            }
        }
    }
}

Task configurations


global-search

{
    "x": 0,
    "y": 0,
    "width": 12,
    "height": 2,
    "id": "node61252",
    "customDataObject": {
        "widget": "global-search",
        "title": "Search",
        "config": {
            "newinstanceList": {
                "setId": "",
                "targetPageUUID": "",
                "nullMessage": "",
                "label": "",
                "uiView": "grid",
                "showAdd": false,
                "showWorkflowStatus": false,
                "spListShowAll": false,
                "spListStatusFilter": "",
                "spListAsignee": false
            },
            "workflowStatus": {
                "processes": [],
                "wfCanEdit": "",
                "wfStatus": "",
                "vegaHeight": 250,
                "vegaWidth": 400
            },
            "mysqlGrid": {
                "query": ""
            }
        }
    }
}
⚠️ **GitHub.com Fallback** ⚠️