BAS - Load error in app using Attachment Services Reuse Component RAP V4 OData Service

[Dhirajsap2024]

Hello Expert,

I have created a Fiori element application based on RAP V4 OData service and my application is working fine and getting data on list page and object page.

We have created the RAP V4 service and created the application based on this. Now I want to add the "Reusable Attachment component" in my object page. And added the configuration same as provided in SAPUI5 demokit for ODATA V4 version. 

https://sapui5.hana.ondemand.com/sdk/#/topic/d869d7ab3caa48b2a20dc20dfa248380

Now when I am running my application then newly added section getting with blank and in console I am getting error "Attachment reusable" component not found. 

Development Tool: BAS

Updated pom.xml file as well.

Manifest file code:

{

  "_version": "1.65.0",

  "sap.app": {

    "id": "z1tcp",

    "type": "application",

    "i18n": "i18n/i18n.properties",

    "applicationVersion": {

      "version": "${project.version}"

    },

    "title": "{{appTitle}}",

    "description": "{{appDescription}}",

    "resources": "resources.json",

    "sourceTemplate": {

      "id": "@sap/generator-fiori:lrop",

      "version": "1.16.1",

      "toolsId": "87db7502-71fa-4d4a-85c2-f10ca23474b6"

    },

    "dataSources": {

      "mainService": {

        "uri": "/sap/opu/odata4/sap/ui_tradeclaimrequest_v4/srvd/sap/ui_tradeclaimrequest1/0001/",

        "type": "OData",

        "settings": {

          "annotations": [

            "annotation"

          ],

          "localUri": "localService/metadata.xml",

          "odataVersion": "4.0"

        }

      },

      "annotation": {

        "type": "ODataAnnotation",

        "uri": "annotations/annotation.xml",

        "settings": {

          "localUri": "annotations/annotation.xml"

        }

      }

    },

    "ach": "123"

  },

  "sap.ui": {

    "technology": "UI5",

    "icons": {

      "icon": "",

      "favIcon": "",

      "phone": "",

      "phone@2": "",

      "tablet": "",

      "tablet@2": ""

    },

    "deviceTypes": {

      "desktop": true,

      "tablet": true,

      "phone": true

    }

  },

  "sap.ui5": {

    "flexEnabled": true,

    "componentUsages": {

      "attachmentReuseComponent": {

        "name": "sap.se.mi.plm.lib.attachmentservice.attachment.components.stcomponent",

        "settings": {}

      }

    },

    "dependencies": {

      "minUI5Version": "${sap.ui5.dist.version}",

      "libs": {

        "sap.m": {

          "lazy": false

        },

        "sap.ui.core": {

          "lazy": false

        },

        "sap.fe.templates": {

          "lazy": false

        },

        "sap.nw.core.gbt.notes.lib.reuse": {

          "lazy": false

        },

        "sap.se.mi.plm.lib.attachmentservice": {

          "lazy": true

        }

      },

      "components": {

        "sap.se.mi.plm.lib.attachmentservice.attachment.components.stcomponent": {

          "lazy": true

        }

      }

    },

    "contentDensities": {

      "compact": true,

      "cozy": true

    },

    "models": {

      "i18n": {

        "type": "sap.ui.model.resource.ResourceModel",

        "settings": {

          "bundleName": "z1tcp.i18n.i18n"

        }

      },

      "": {

        "dataSource": "mainService",

        "preload": true,

        "settings": {

          "operationMode": "Server",

          "autoExpandSelect": true,

          "earlyRequests": true

        }

      },

      "@i18n": {

        "type": "sap.ui.model.resource.ResourceModel",

        "uri": "i18n/i18n.properties"

      }

    },

    "resources": {

      "css": []

    },

    "routing": {

      "config": {},

      "routes": [

        {

          "pattern": ":?query:",

          "name": "C_TradeClaimRequestTPList",

          "target": "C_TradeClaimRequestTPList"

        },

        {

          "pattern": "C_TradeClaimRequestTP({key}):?query:",

          "name": "C_TradeClaimRequestTPObjectPage",

          "target": [

            "C_TradeClaimRequestTPObjectPage",

            "ReuseComponent"

          ]

        }

      ],

      "targets": {

        "C_TradeClaimRequestTPList": {

          "type": "Component",

          "id": "C_TradeClaimRequestTPList",

          "name": "sap.fe.templates.ListReport",

          "options": {

            "settings": {

              "contextPath": "/C_TradeClaimRequestTP",

              "variantManagement": "Page",

              "navigation": {

                "C_TradeClaimRequestTP": {

                  "detail": {

                    "route": "C_TradeClaimRequestTPObjectPage"

                  }

                }

              },

              "controlConfiguration": {

                "@com.sap.vocabularies.UI.v1.LineItem": {

                  "tableSettings": {

                    "type": "ResponsiveTable",

                    "selectionMode": "Auto",

                    "condensedTableLayout": true

                  }

                }

              }

            }

          }

        },

        "C_TradeClaimRequestTPObjectPage": {

          "type": "Component",

          "id": "C_TradeClaimRequestTPObjectPage",

          "name": "sap.fe.templates.ObjectPage",

          "options": {

            "settings": {

              "editableHeaderContent": false,

              "contextPath": "/C_TradeClaimRequestTP",

              "content": {

                "body": {

                  "sections": {

                    "customSectionReuse": {

                      "title": "{i18n>customSectionReuse}",

                      "embeddedComponent": {

                        "name": "sap.se.mi.plm.lib.attachmentservice.attachment.components.stcomponent",

                        "settings": {

                          "mode": "{= ${ui>/editable}?'C':'D'}",

                          "visible": true

                        }

                      },

                      "position": {

                        "placement": "After",

                        "anchor": "someOtherSection"

                      }

                    },

                    "ReuseComponentContainer": {

                      "position": {

                        "placement": "Before",

                        "anchor": "Attachments"

                      },

                      "title": "Reuse Container",

                      "subSections": {

                        "ReuseContainer": {

                          "id": "ReuseComponentContainer"

                        }

                      }

                    }

                  }

                }

              }

            }

          }

        },

        "ReuseComponent": {

          "type": "Component",

          "id": "Reuse",

          "name": "",

          "options": {

            "settings": {

              "exampleSettings": ""

            }

          },

          "parent": "C_TradeClaimRequestTPObjectPage",

          "controlId": "ReuseComponentContainer",

          "controlAggregation": "blocks",

          "clearControlAggregation": true

        }

      }

    }

  },

  "sap.fiori": {

    "registrationIds": [

      "z1tcp"

    ],

    "archeType": "transactional"

  },

  "sap.fe": {

    "macros": {

      "table": {

        "defaultCreationMode": "InlineCreationRows"

      }

    }

  }

}

Error which I am getting: 

Log-dbg.js:497 2024-12-24 20:12:30.218399 The following error occurred while displaying routing target with name 'z1tcp::C_TradeClaimRequestTPObjectPage--fe::CustomSubSection::customSectionReuse::component': ModuleError: failed to load 'sap/se/mi/plm/lib/attachmentservice/attachment/components/stcomponent/Component.js' from ../resources/sap/se/mi/plm/lib/attachmentservice/attachment/components/stcomponent/Component.js: script load error -

Could you please help me or share the sample file if I am missing anything.  Thank you.

REgards,

Dhiraj

[venky02]

Hello, Did you found any resolution for this. I'm also facing the same issue just like yours

[ganeshkanwa]

Hello Guys,

[ganeshkanwa]

Hello Guys, Your manifest config won’t work, please follow the steps in this link https://help.sap.com/docs/sap-btp-abap-environment/abap-environment/fiori-elements-integration-odata...

You only need to define at 2 places, first is at lib section not in component section and second is in the object page section inside the embedded component.

Also stComponet will store the document in GOS and if you want to store the document in DMS then use fsComponent 

But interestingly you will component loaded when App is deployed not on running it locally.