Promise.all not waiting for functions to finish

I have a function that adds a new record to the database. Once that is successful, it will then call the other functions (on different files) to have them add their data to the database. I am needing to check that each function runs and adds the data to the database. If that is true, I want to console log each success message, otherwise console log the error.

I tried using promise.all(), but every time I have it run I get an undefined for my data. It seems that it is hitting the function but then jumping ahead before it has a chance to run.

Could I get help in understanding what I am doing wrong, and how to fix it?

Main:

add() { var result = this.#constructModel().Validate(); if (result.Success) { const onSuccess = (result) => { let mode = new ModeComponent(selectedModeIDs); let item = new ItemComponent(selectedItemIDs); Promise.all([mode.add(), item.add()]).then((data) => { console.log(data); }) } const onInvalid = (response) => { console.log(response.message) } this.service.Add(result.Value, onSuccess, onInvalid); } if (result.Failure) { this.#displayFailedResult(result); } }

Mode:

constructor(modeTypeIDsList) { this.modeTypeIDs = modeTypeIDsList; this.service = new ModeActionService(httpService); } add(Id) { const onSuccess = (results) => { return results.status; } const onInvalid = (response) => { console.log(response.message); return response.status; } this.service.Add(Id, this.modeTypeIDs, onSuccess, onInvalid); }

Item:

constructor(itemIDsList) { this.itemIDs = itemIDsList; this.service = new ItemActionService(httpService); } add(Id) { const onSuccess = (results) => { return results.status; } const onInvalid = (response) => { console.log(response.message); return response.status; } this.service.Add(Id, this.itemIDs, onSuccess, onInvalid); }