BPA Report giving issues for fileUpload , Richtext , granite:renderCondition and datasource

[bhavanavk028]

Hi ,

Need help in understanding these below issues . Not sure they are false positives. If anybody knows fixes for these it would be of great help.

1. granite/ui/components/coral/foundation/renderconditions/simple

2. cq/gui/components/authoring/dialog/richtext

3. cq/gui/components/authoring/dialog/fileupload

4. datasource

In BPA report it says "A custom coral dialog widget was found". Are there any coral 3 alternatives available for these resource types.

[imshailesh]

Hi @bhavanavk028 !

I ran BPA report on AEM as a Cloud Service local setup with BPA Version: 21.42. Although I had all the above mentioned resourceType used under /apps/core/wcm/components, but I am unable to see any issue mentioning "A custom coral dialog widget was found". Can you please help us sharing any path where it is pointing, if it outside of your Project Structure.

Regards,
Shailesh

[bhavanavk028]

Hi @imshailesh 

Please find below report which was generated using best-practices-analyzer.ui.apps-2.1.40 version

custom.coral.widget	MAJOR	/apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/ResultsDisclaimer	\N	A custom coral dialog widget was found at /apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/ResultsDisclaimer.	https://www.adobe.com/go/aem_pd_CDW	{"data":{"path":"/apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/ResultsDisclaimer"},"type":"custom.coral.widget"}
custom.coral.widget	MAJOR	/apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/file	\N	A custom coral dialog widget was found at /apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/file.	https://www.adobe.com/go/aem_pd_CDW	{"data":{"path":"/apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/file"},"type":"custom.coral.widget"}
custom.coral.widget	MAJOR	/apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/linkNewWindow/granite:rendercondition	\N	A custom coral dialog widget was found at /apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/linkNewWindow/granite:rendercondition.	https://www.adobe.com/go/aem_pd_CDW	{"data":{"path":"/apps/test-project/title/cq:dialog/content/items/tab1/items/column/items/linkNewWindow/granite:rendercondition"},"type":"custom.coral.widget"}

[Nilesh_Mali]

Hi @bhavanavk028,

To ensure a smooth generation of the BPA Report, please follow the steps below before running the report:

1. Check the configuration of the widget in the AEM component's dialog XML file and update it with Coral 3 if possible.
2. Verify JavaScript errors or conflicts.
3. Review the AEM logs for any relevant error messages or stack traces.
4. Confirm that any required dependencies or dependencies defined in the component's component.json file are correctly configured and accessible.

Here are some Coral 3 alternatives for updating the dialog XML

- For render conditions: Replace "granite/ui/components/coral/foundation/renderconditions/" with "coral 3: granite/ui/components/coral/foundation/container".

- For rich text: Replace "cq/gui/components/authoring/dialog/richtext" with "coral 3: granite/ui/components/coral/foundation/form/textfield".

- For file upload: Replace "cq/gui/components/authoring/dialog/fileupload" with "coral 3: granite/ui/components/coral/foundation/form/fileupload".

If you are encountering issues with a custom datasource, review the code and configuration related to the datasource and check for any errors or misconfigurations.

[bhavanavk028]

Hi @Nilesh_Mali ,

Thanks for the reply.

1.For richtext I need the different styling options so if I replace it with textfield styling wont be possible.

2. I didnt get this how rendercondition can be replaced with container.

3. Replace "cq/gui/components/authoring/dialog/fileupload" with "granite/ui/components/coral/foundation/form/fileupload" -- I tried this but I am just getting one button and there is no drag and drop option , dialog ui is breaking.

[Tanika02]

Hello @bhavanavk028 - 

Here are some Coral 3 alternatives or equivalents for the mentioned resource types:

1. granite/ui/components/coral/foundation/renderconditions/simple:
In Coral 3, you can use the "granite/ui/components/coral/foundation/renderconditions" resource type.

2. cq/gui/components/authoring/dialog/richtext:
The Coral 3 rich text editor component is available under the "granite/ui/components/coral/foundation/form/richtext" resource type.

It provides a similar functionality to the Coral 2 rich text editor. You can update your custom dialogs to use this standard Coral 3 component for rich text editing.

3. cq/gui/components/authoring/dialog/fileupload:
For file uploads in Coral 3, you can use the "granite/ui/components/coral/foundation/form/fileupload" resource type. It offers a standard file upload widget that you can use as a replacement for the Coral 2 file upload component. Update your custom dialogs to utilize this Coral 3 file upload component.

https://developer.adobe.com/experience-manager/reference-materials/6-4/coral-ui/coralui3/Coral.html 

https://techrevel.blog/2017/05/26/coral-3-granite-ui-components/ 

[bhavanavk028]

Hi @Tanika02 ,

1. granite/ui/components/coral/foundation/renderconditions/simple:
In Coral 3, you can use the "granite/ui/components/coral/foundation/renderconditions" resource type -- We are already using "coral/foundation" path but this didnt fix.

2. cq/gui/components/authoring/dialog/richtext:
The Coral 3 rich text editor component is available under the "granite/ui/components/coral/foundation/form/richtext" resource type.

-- I checked this path , I didnt find any richtext under this "/libs/granite/ui/components/coral/foundation/form"

3. cq/gui/components/authoring/dialog/fileupload:
For file uploads in Coral 3, you can use the "granite/ui/components/coral/foundation/form/fileupload" resource type. It offers a standard file upload widget that you can use as a replacement for the Coral 2 file upload component. Update your custom dialogs to utilize this Coral 3 file upload component -- This is breaking UI and also there is no drag and drop option.