Page Comparison

...

Accessory details - The option for accessory are retrieved from MDMS, according to the option selected Unit of measure gets pre-populated, which is non editable by user, rest UOM value and accessory count user can edit or gets pre-populated from MDMS, for adding multiple accessory Add More Trade Accessory button can be clicked, it will be as similar as trade units.

...

TL Enhanced Flow :

If the citizen selects Movable as the structure type in the previous screens, then the flow will jump to owner details flow, in which “Same as Property Owner’s” check box will not be visible.

If the citizen selects Immovable as the structure type then user is allowed to add the property details, Once property is added, the flow will redirect to owner details flow, where “Same as Property Owner’s” check box is added, if user checked it, then following details will get auto populated and screen will skip to proof of Identity page.

...

Image Added

CommonPT integration with TL :

After entering the details of the Trade, user will have an option to either search and integrate the already created property or create a new lightweight property for the trade license, or can skip this step altogether and proceed with normal address details flow.

Once property is selected user can see the details of the property throught property details page, for in-depth knowledge about the flow, please refer to Common PT

...

Address Details Flow:

After entering about the details about the Trade user will need to enter about the address of the Trade, where it is located. The flow will be straight forward, without any conditional routing.

...

On clicking on the Download Acknowledgement Form, A PDF will be downloaded.

...

Release 2.8 Enhancements & Changes:

In the Trade Units page, values for trade type and trade subtype has been loaded by the following MDMS call :

const { isLoading, data: Data = {} } = Digit.Hooks.tl.useTradeLicenseMDMS(stateId, "TradeLicense", "TradeUnits", "[?(@.type=='TL')]");

Following Validation has been added for the same :

Users when select trade type and then subtype, it compared with the available billing slab for which the hook has been mentioned below, and if the billing slab is not there it wont allow users to move forward and error will get displayed.

const { data: billingSlabTradeTypeData, isLoading : isBillingSlabLoading } = Digit.Hooks.tl.useTradeLicenseBillingslab({ tenantId: tenantId, filters: {} }, {
    select: (data) => {
    return data?.billingSlab.filter((e) => e.tradeType && e.applicationType === "NEW" && e.licenseType === "PERMANENT" && e.uom);
    }});

...

once the right trade type and subtype is added, and correct billing slab is there, then for the UOM value validation is added, it will check the value in the given range, mentioned in the billing slab object and displays the error if the value is outside of the range.

...

Technical Implementation Details:

...

The link for the Apply Trade License Main Index is given below, it can be used to understand the starting point of the flow:

https://github.com/egovernments/digit/DIGIT-Dev/blob/master/frontend/micro-ui/web/micro-ui-internals/blob/main/packages/modules/tl/src/pages/citizen/Create/index.js

TL (Trade License) Module has been segregated into a specified structure, All the screen configuration is inside PageComponent Folder, and the configuration for routing of the pages are mentioned under config folder which is common for both Citizen as well as Employee. Below is the snippet for folder structure and routing configuration.

...

Pages Folder is where the high level configuration for controlling the whole flow is mentioned, for citizens and employees. Citizen includes Create, EditTrade, Renewal, Applications and search Trade. Which inside carry the index (the main starting point of the whole flow).

In Accessory-details page, Billing slab search API "/tl-calculator/billingslab/_search" is being called, which returns the array list of all the accessories for which the billing slab has been configured, from that object only list of accessory has been formed, if the response came out to be empty array then the options are curated from the MDMS API mentioned in the MDMS data section.

After completing the flow the user can download the acknowledgement PDF form of the License created and the config for the PDF generation can be found in the link given below:

https://github.com/egovernments/digitDIGIT-Dev/blob/master/frontend/micro-ui/web/micro-ui-internals/blob/main/packages/modules/tl/src/utils/getTLAcknowledgementData.js

Utils Folder basically contains all the methods which are being used throughout the TL module, and if any common method needs to be declared here, which in turn can be imported in other files. 

...

Throughout the flow, few of the pages data are being imported from MDMS, Following are the list of pages which are using MDMS data, These pages .js files can be found under page components.

For calling of MDMS data React Hooks has been used, so that it could be shared throughout the modules. Below is the little code snippet for the call used for MDMS.

...

API Call Role Action mapping: