How to compare jobId from api and of mat-table in angular material

Question

I have a mat-table which shows Jobs and it's detail like jobId,executionId,status etc. Additionally I have a webSocket which sends notification status of Job ie Running,Success or Failed. The problem with my WebSocket right now is that it doesn't differentiate jobs based on Projects or Users which means that if user 2 runs a project then also i will get a notification of Job Running.

I want to put a condition in my code in such a way that when I click on stop button next to my Job List the code should compare my jobId and status and get a response whether job was stopped or not from webSocket.

HTML Code for my Stop Job Button:

 <button *ngIf="index === 0"
                    mat-icon-button
                    (click)="stop_exec_job(element)"
                    matTooltip="Stop Executing the Job"
                    [disabled]="element.status == 'Completed' || element.status == 'FINISH'"
                >
                    <!-- Edit icon for row -->
                    <i class="material-icons" style="color:red"> stop </i>
                </button>

Stop Function Code in TypeScript:

stop_exec_job(element) {
    if (element.status == 'RUNNING' || element.status == 'Pending')  {
        //Api to stop Job Execution
        this.recommendationService
            .stopJobExecution(element.jobId,element.status)
            .subscribe(data => {
                this.executeJobStop = data;
            });
        this.displaySpinner = false;

        this.snakbar.statusBar('Job Execution Stopped', 'Sucess');
    } else {
        this.snakbar.statusBar('Job Failed to start', 'Failure');
    }
}

WebSocket Code:

this.messageService.messageReceived$.subscribe(data => {
        let status: any = data;
        this.snakbar.statusBar(
            "Platform job status - " + status.message,
            "Info"
        );
});

I want to recieve notification from WebSocket corresponding to the Job I have Stopped by using if-else condition. How do I achieve this??

Answer 1

I dont know if i understand what you want and i also dont know what this.recommendationService.stopJobExecution(jobId,status) returns but maybe you have to put the snackbar-action in the subscription like:

...
this.recommendationService
            .stopJobExecution(element.jobId,element.status)
            .subscribe(data => {
                this.executeJobStop = data;
                if(data.stopped) {
                    this.snakbar.statusBar('Job Execution Stopped', 'Success');
                }
            });
....