Property Tax module UI description:
- PT was the first major module built on the Rainmaker platform
- Due to significant differences between citizen and employee interface, the code for both has been segregated into two separate apps, pt-citizen and pt-employee under dev-packages.
- The UI code is written in pure react.js with significant use of react HOCs, middlewares and action hooks, there has been no use of a defined UI framework.
- The starting/parent component of PT under which other child components are rendered is formWizard component, its the main wizard component which shows the stepper and the content is loaded as per the active index running. (path: \egov-web-app\web\rainmaker\dev-packages\pt-employee-dev\src\Screens\FormWizard\index.js).
- PT uses UI components defined in egov-ui-kit.
Intricacies in the module:-
- The most complex part in the module is the assessment information part, where we have handled the multiItem component to show multiple units on the same floor.
- the units are received and sent in the API as an array.
- To render a different variety of plot and floor details for every unique combination of property usage type and property type selected, we have all possible specs written at "\egov-ui-kit-dev\src\config\forms\specs\PropertyTaxPay\", which can be dynamically picked as per the collection with the help of assessInfoFormManager.js present in egov-ui-kit's utils folder.
PT Form hooks:
- beforeFieldChange → gets called before the every "handleFieldChange" action. it accepts action, dispatch and state as its parameters. it can be used to set other fields or perform any action/operation on every field change. we can alter the value as well here and return the action.
- updateDependentFields → gets called on every "handleFieldChange" action and is specifically used to load dependent fields. If the data of one dropdown gets loaded only after selecting an option in the previous dropdown, then updateDependentFields hook is the right choice. it gets formKey, field, dispatch, and state as its parameters
PT form actions:
- setFieldProperty : eg setFieldProperty(formKey, "ownerCategoryIdType", "dropDownData", documentTypes)
- prepareFormData : eg prepareFormData(jsonPath, fieldValue)