Skip to content

Commit ca65293

Browse files
committed
Add forkJoin to combine question and topic API calls
This ensures that both requests are complete before updating UI
1 parent 193e33f commit ca65293

File tree

3 files changed

+26
-30
lines changed

3 files changed

+26
-30
lines changed

frontend/src/app/questions/question.service.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Injectable } from '@angular/core';
33
import { API_CONFIG } from '../api.config';
44
import { Observable } from 'rxjs';
55
import { QuestionResponse } from './question.model';
6-
import { Topic, TopicResponse } from './topic.model';
6+
import { TopicResponse } from './topic.model';
77

88
@Injectable({
99
providedIn: 'root',

frontend/src/app/questions/questions.component.ts

Lines changed: 23 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,13 @@ import { DialogModule } from 'primeng/dialog';
1111
import { MultiSelectModule } from 'primeng/multiselect';
1212
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
1313
import { DropdownModule } from 'primeng/dropdown';
14-
import { Question, QuestionResponse } from './question.model';
14+
import { Question } from './question.model';
1515
import { Column } from './column.model';
16-
import { Topic, TopicResponse } from './topic.model';
16+
import { Topic } from './topic.model';
1717
import { Difficulty } from './difficulty.model';
1818
import { DifficultyLevels } from './difficulty-levels.enum';
1919
import { QuestionService } from './question.service';
20+
import { forkJoin } from 'rxjs';
2021

2122
@Component({
2223
selector: 'app-questions',
@@ -41,8 +42,6 @@ import { QuestionService } from './question.service';
4142
styleUrl: './questions.component.css',
4243
})
4344
export class QuestionsComponent implements OnInit {
44-
questionResponse!: QuestionResponse;
45-
4645
questions: Question[] = [];
4746

4847
topics!: Topic[];
@@ -80,30 +79,28 @@ export class QuestionsComponent implements OnInit {
8079
difficulty: '',
8180
};
8281

83-
this.questionService.getQuestions().subscribe({
84-
next: (response: QuestionResponse) => {
85-
this.questions = response.data!;
82+
forkJoin({
83+
questions: this.questionService.getQuestions(),
84+
topics: this.questionService.getTopics(),
85+
}).subscribe({
86+
next: results => {
87+
this.questions = results.questions.data || [];
88+
this.topics =
89+
results.topics.data?.map(topic => ({
90+
label: topic,
91+
value: topic,
92+
})) || [];
8693
},
8794
error: (error: Error) => {
88-
// TODO: prompt an error on unsuccessful fetch
89-
console.log(error);
90-
},
91-
complete: () => {
92-
// TODO: add loading state for this
93-
console.log('complete');
94-
},
95-
});
96-
97-
this.questionService.getTopics().subscribe({
98-
next: (response: TopicResponse) => {
99-
this.topics = response.data!.map(topic => ({
100-
label: topic,
101-
value: topic
102-
}))
103-
},
104-
error: (error: Error) => {
105-
// TODO: prompt an error on unsuccessful fetch
106-
console.log(error);
95+
console.error(error);
96+
this.questions = [];
97+
this.topics = [];
98+
this.messageService.add({
99+
severity: 'error',
100+
summary: 'Error',
101+
detail: 'Failed to load data. Please try again later.',
102+
life: 3000,
103+
});
107104
},
108105
complete: () => {
109106
// TODO: add loading state for this

frontend/src/app/questions/topic.model.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,5 @@ export interface Topic {
66
export interface TopicResponse {
77
status: string;
88
message: string;
9-
data?: (string)[] | null;
10-
}
11-
9+
data?: string[] | null;
10+
}

0 commit comments

Comments
 (0)