How to simulate progress bar when changing thong?

Question

JavaScript

I have an object with statuses, suppose:

const validationProgressSteps: IterableObject<string[]>  = {
firstStep: ['one', 'two'],
secondStep: ['three', 'four'],
thirdStep: ['five', 'six'],
fourthStep: ['seven', 'eight'],
}

From the server, I get the same statuses, but first I need to check them for identity with "validationProgressSteps", if the status matches, for example, with "validationProgressSteps.firstStep", then for each match, add + to the this.progressStatusBar variable so that it would not be in the first step more than 25 further on the second no more than 50, the third 75, the fourth 100. That is, imitate the Progress bar by changing the file statuses. Can you please tell me how to call step 2, 3, 4 after the first one?

public handleValidationProgress(status: string, id: number): number {
      const fileInTable: FileTableItem | undefined = this.uploadedFiles.find
      ((item: FileTableItem) => item.fileId === id);
          if(fileInTable) {
            this.validationProgressSteps.firstStep.filter((item: string) => {
              if (status === item) {
                const progressBar = setInterval(() => {
                  if (this.progressStatusBar === 30) {
                    clearInterval(progressBar);
                  } else {
                    this.progressStatusBar += 1;
                  }
                }, 1000);
              }
            });
          }
      return this.progressStatusBar;
    }