This is my onClick function:
const handleRunServicesClick = () => {
setIsFetching(true);
getImiginoVideoAction(articleId, videoUrl, selectedTab);
};
These are the relative actions:
getImiginoVideoAction: (articleId: string, videoUrl: string, imiginoServiceKey: string) => ({
type: ActionTypes.GET_IMIGINO_VIDEO_ACTION,
payload: { articleId, videoUrl, imiginoServiceKey },
}),
initiateVideoAutoTagService: (articleId: string, videoUrl: string, imiginoServiceKey: string) => ({
type: ActionTypes.INITIATE_VIDEO_AUTOTAG_SERVICE,
payload: { articleId, videoUrl, imiginoServiceKey },
}),
updateVideoAutotagMedia: (articleId: string, videoUrl: string, imiginoServiceKey: string) => ({
type: ActionTypes.UPDATE_VIDEO_AUTOTAG_MEDIA,
payload: { articleId, videoUrl, imiginoServiceKey },
}),
My getImiginoVideoAction epic looks like this and just fires off the relevant Action based on the service key:
export const getImiginoVideoAction: Epic<IGetImiginoVideoAction, RootState, any, any> = (action$, { getState }) =>
action$.pipe(
ofType(ActionTypes.GET_IMIGINO_VIDEO_ACTION),
map((action) => {
const { videoUrl, articleId, imiginoServiceKey } = action.payload;
switch (imiginoServiceKey) {
case "auto-tag":
return imiginoServicesActions.initiateVideoAutoTagService(articleId, videoUrl, imiginoServiceKey);
case "transcribe":
return imiginoServicesActions.initiateVideoTranscribeService(articleId, videoUrl, imiginoServiceKey);
case "text":
return imiginoServicesActions.initiateVideoTextService(articleId, videoUrl, imiginoServiceKey);
case "celebrity":
return imiginoServicesActions.initiateVideoCelebrityService(articleId, videoUrl, imiginoServiceKey);
default:
break;
}
return appActions.showSnackbarMessage("Service coming soon");
})
);
And for some reason it always fires the "inatiate" Action twice, regardless of which service it is.
Here is one of the initiate actions:
export const initiateVideoTranscribeService: Epic<IGetImiginoVideoAction, RootState, any, any> = (
action$,
{ getState }
) => action$.pipe( ofType(ActionTypes.INITIATE_VIDEO_TRANSCRIBE_SERVICE), switchMap((action) => { const { videoUrl, articleId, imiginoServiceKey } = action.payload; const { esApiKey, esSearchBaseUrl, imiginoServicesUrl, imiginoServicesApiKey } = getState().launchConfig; const { email } = getState().user;
return fromPromise(
imiginoAdvancedVideoService.initiateVideoTranscribeService(
imiginoServicesUrl,
esSearchBaseUrl,
esApiKey,
articleId,
imiginoServicesApiKey,
email,
videoUrl
)
).pipe(
map((data: string) => {
return imiginoServicesActions.updateVideoTranscribeMedia(articleId, videoUrl, imiginoServiceKey);
}),
catchError((error) => {
return of(appActions.showSnackbarMessage(failedFetchMessage));
})
);
})
);
I really just want the initiate action to fire once and only once and it's driving me mad at this point. Any help would be greatly appreciated