Added slot for children in orgunit label and disabled state prop

[p3rcypj]

📌 References

CLPC Facial reconstruction https://github.com/EyeSeeTea/emergency-responses-app/pull/70

📝 Implementation

• Added children slot for labels, in order to allow jsx next to the label
• Added disabled prop to disallow selecting an orgunit (for loading states where the component is used)

🎨 Screenshots

Added Chip tag as an example

Disabled state; it still allow expanding the tree, but not selecting any orgunit

🔥 Testing

docker.eyeseetea.com/samaritans/dhis2-data:40.4.1-sp-ip-develop-est

In EMR app, go to http://localhost:8081/#/frr and select 'Responses Configuration'. If you don't see anything or it says you are not in the user group, you should add your user to the needed user groups. If you don't have user, ask to project manager.

On 'Responses configuration' you will see the orgunit tree. If you select a country and later click on 'Create response for country level' and confirm the dialog, you will see the disabled state while the request outside is loading. Check video media on the attached PR if needed.

[tokland]

code-wise, all good

[tokland]

No need to change it, but typically: {id: true, ...., ..extraFields}

[p3rcypj]

But extraFields might be undefined. Thats why I used Object.assign, I tried in console to do { hello:"a", ...undefined } at console and it gave me error

[tokland]

In the browser console, object literals appear to require parentheses: ({ hello:"a", ...undefined }).

However, even if "undefined" were problematic, you'd typically use something like ' ...(extraFields || {})`.