Skip to content

Unable to use Tabs component #235

Open
@sarathBM

Description

@sarathBM

Hi All,

I am using AEM artifact 47 with extending react version to 18 and aem-react-editable-componnets version 2.1.1

I am able to use container component with aem-react-editable-componnets version 2.1.1, but unable to use Tabs component, I have done mapping Tabs component to Core AEM tabs component I am getting below issue
image

Below is the one using package.json
"dependencies": {
"@adobe/aem-react-editable-components": "^2.1.1",
"@adobe/aem-spa-component-mapping": "1.1.1",
"@adobe/aem-spa-page-model-manager": "1.5.0 ",
"custom-event-polyfill": "^1.0.7",
"history": "^5.3.0",
"neom-ui": "github:NEOM-KSA/Neom-UI#develop",
"react": "^18.2.0",
"react-app-polyfill": "^3.0.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.21.3",
"sanitize-html": "^2.11.0",
"util": "^0.12.5"
},

Here is the code UI.frontend component code
import {
MapTo,
Container,
ResponsiveGrid
} from '@adobe/aem-react-editable-components';

const MyTabsEditConfig = {
emptyLabel: 'Tabs',
isEmpty: function(props){
return !props.cqItemsOrder || !props.cqItemsOrder.length ===0
}
}

const MyTabs = (props) =>

{
const tabItemsInOrder = Container.getChildComponents(props);
const tabItemsJsx = tabItemsInOrder.map((tabItemJsx) =>

{tabItemJsx}
);
return
{tabItemsJsx}
;
}

export default MapTo('neom-authority-platform/components/tabs')(MyTabs, MyTabsEditConfig);

After integrating the code I am gettin the error
clientlib-react.js:2 TypeError: pe.Container.getChildComponents is not a function
at emptyLabel (clientlib-react.js:2:149121)

Can any one help with This issue

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions