I was just trying to integrate the AEM SPA editor to my existing angular application which is developed mostly by following the Redux pattern. So all the presentational components, I was aiming to expose as an AEM component are dumb. They will get its data through @Input() and the user interactions are managed by the EventEmitters with an @Output() directive. Some of the input values are dynamic which are supplied by the parent component to the dumb components by reading the Redux state store.
![image.png image.png](https://experienceleaguecommunities.adobe.com/t5/image/serverpage/image-id/24262iBA3C18D682F218C7/image-size/large/is-moderation-mode/true?v=v2&px=999)
Since the AEM is only responsible for the static content, I am not sure how to achieve the dynamic behavior of the dumb components. Some of the things that I have tried (Added below) so far are in fact beats the whole purpose of the Redux Pattern.
- Injected the state store into the dumb components and read the data directly from it instead of relying on the supplied data through the @Input() directive. In this case, I will use mock data to support the authoring experience.
I am not able to turn my head around this problem. My questions are:
- Is this even possible in AEM?
- Is my understanding of the AEM is completely wrong?
- Is the AEM not matured yet to support SPAs developed using the Redux pattern?
- Should I create a single component in AEM which maps to the Parent component in Angular?
Thanks in Advance. Any help will be much appreciated.