I am currently working on a UI form that allows users to update or add translation text.
To achieve this, I need to create an rxjs statement that will perform the following tasks:
Send an httpGet request to the database to retrieve translations in multiple languages.
Iterate through the list of translations obtained from the httpGet request.
If the translation language matches what was entered in the UI fields, then send an httpPut request to update the corresponding record in the database. For example: If a user inputs a Spanish translation in the UI and the httpGet response contains Spanish translations, an httpPut request should be sent to update the Spanish record in the database.
If the translation language from the UI does not exist in the httpGet results, then send an httpPost request to add a new translation record to the database. For example: If a user adds a Chinese translation in the UI and there are no Chinese translations returned by the httpGet request, an httpPost request should be sent to add the Chinese record to the database.
I have written the initial part of the code, but I understand that rxjs is non-sequential and it's not possible to use nested subscribes. Therefore, I'm looking for guidance on how to structure the rxjs statement accordingly.
p/s: The httpGet response object 'x' contains 'dataCount' and 'dataSet'. 'dataCount' represents the number of translation objects while 'dataSet' is an array containing the translation objects.
Any suggestions on how to approach writing the rxjs statement for this scenario?
this.GetTranslations(group).subscribe(x => {
x.dataSet.forEach(translation => {
switch (translation.Language) {
case chineseCode:
if (chineseInUI){
chineseExist = true;
let newChinese = {
"Id": translation.Id,
"Language": translation.Language,
"PhraseKey": translation.PhraseKey,
"PhraseValue": chineseInUI,
}
this.webApiService.httpPut$(this.resourceApiService.getURL('translationmanagerURL') + translation.Id, newChinese).subscribe();
}
break;
case spanishCode:
if (spanishInUI){
let newSpanish = {
"Id": translation.Id,
"Language": translation.Language,
"PhraseKey": translation.PhraseKey,
"PhraseValue": spanishInUI
}
this.webApiService.httpPut$(this.resourceApiService.getURL('translationmanagerURL') + translation.Id, newSpanish).subscribe();
}
break;
}
});
});