Currently, I am working on a flow that involves adding a new object to another object's collection. This process starts with some domain-related tasks.
Initially, I send an object to the backend and upon receiving a callback, I trigger another action in the store which should activate another effect.
In this subsequent action, I need to make another call to the backend controller with a fresh payload before completing the flow. However, trouble arises when trying to communicate with the backend, as I encounter the following error:
from update project effect
project.effects.ts:52 {projectId: "5980ea8390dfb5285402e18b", userId: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="1273767f7b7c5265623c627e">[email protected]</a>", drawings: Array(2), projectName: "Test pro"}
project.service.ts:37
z update project service
project.service.ts:38 {projectId: "5980ea8390dfb5285402e18b", userId: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="2647424b4f4866515608564a">[email protected]</a>", drawings: Array(2), projectName: "Test pro"}drawings: (2) [{…}, Drawing]projectId: "5980ea8390dfb5285402e18b"projectName: "Test pro"userId: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="650401080c0b2512154b1509">[email protected]</a>"__proto__: Object
core.es5.js:1084
ERROR TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
at Object.subscribeToResult (subscribeToResult.js:73)
at
A similar flow is successfully implemented in another part of the app, like the login feature. Here is a snippet of the code:
@Effect() addNewDrawing = this.actions
.ofType(ProjectActions.ADD_NEW_DRAWING)
.map(toPayload)
.withLatestFrom(this.store.select(getProject))
.switchMap(([payload, project] : [AddDrawingCommand, Project]) =>
this.uploadService.upload(payload.file)
.mergeMap((result:any) : any => {
project.drawings.push(new Drawing(payload.drawingName, result.drawingUrl, 0));
console.log(payload)
console.log('------------------')
console.log(result)
console.log(project)
console.log('------------------')
return this.store.dispatch(new UpdateProject(project));
}));
@Effect() updateProject = this.actions
.ofType(ProjectActions.UPDATE_PROJECT)
.map(toPayload)
.switchMap(payload => {
console.log('from update project effect');
console.log(payload);
return this.projectService.updateProject(payload)
}
);
The issue seems to arise specifically during the communication with the projectService:
updateProject(project: Project): Observable<any> {
console.log('z update project service')
console.log(project)
return this.http.put(`${this.projectUrl}/${project.projectId}`, project)
.map(response => response.json());
}
This error is perplexing since other services function properly utilizing a similar structure.