Skip to content

Commit c197306

Browse files
cyitingcyiting
committed
PEER-248: PR comments
1 parent 2a4241b commit c197306

File tree

5 files changed

+228
-24
lines changed

5 files changed

+228
-24
lines changed

‎frontend/src/assets/dummyData.ts‎

Lines changed: 203 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,4 +78,207 @@ export const dummyData: Question[] = [
7878
difficulty: 'Medium',
7979
topic: ['Machine Learning', 'Algorithms'],
8080
},
81+
{
82+
id: 12,
83+
attempted: false,
84+
title: 'Linked Lists',
85+
difficulty: 'Easy',
86+
topic: ['Data Structures', 'Linked List'],
87+
},
88+
{
89+
id: 13,
90+
attempted: true,
91+
title: 'Binary Trees',
92+
difficulty: 'Medium',
93+
topic: ['Trees', 'Binary Tree'],
94+
},
95+
{
96+
id: 14,
97+
attempted: false,
98+
title: 'Advanced Recursion',
99+
difficulty: 'Hard',
100+
topic: ['Recursion', 'Dynamic Programming'],
101+
},
102+
{
103+
id: 15,
104+
attempted: true,
105+
title: 'Greedy Algorithms',
106+
difficulty: 'Medium',
107+
topic: ['Algorithms', 'Greedy'],
108+
},
109+
{
110+
id: 16,
111+
attempted: false,
112+
title: 'Backtracking',
113+
difficulty: 'Hard',
114+
topic: ['Algorithms', 'Backtracking'],
115+
},
116+
{
117+
id: 17,
118+
attempted: true,
119+
title: 'Stack and Queues',
120+
difficulty: 'Easy',
121+
topic: ['Data Structures', 'Stack', 'Queue'],
122+
},
123+
{
124+
id: 18,
125+
attempted: false,
126+
title: 'Graph Theory Basics',
127+
difficulty: 'Medium',
128+
topic: ['Graphs', 'Theory'],
129+
},
130+
{
131+
id: 19,
132+
attempted: true,
133+
title: 'Advanced Sorting Techniques',
134+
difficulty: 'Hard',
135+
topic: ['Algorithms', 'Sorting'],
136+
},
137+
{
138+
id: 20,
139+
attempted: false,
140+
title: 'Binary Search',
141+
difficulty: 'Easy',
142+
topic: ['Algorithms', 'Search'],
143+
},
144+
{
145+
id: 21,
146+
attempted: true,
147+
title: 'KMP String Matching',
148+
difficulty: 'Hard',
149+
topic: ['Algorithms', 'String Matching'],
150+
},
151+
{
152+
id: 22,
153+
attempted: false,
154+
title: 'Divide and Conquer',
155+
difficulty: 'Medium',
156+
topic: ['Algorithms', 'Divide and Conquer'],
157+
},
158+
{
159+
id: 23,
160+
attempted: true,
161+
title: 'Trie Data Structure',
162+
difficulty: 'Hard',
163+
topic: ['Data Structures', 'Trie'],
164+
},
165+
{
166+
id: 24,
167+
attempted: false,
168+
title: 'Heap and Priority Queue',
169+
difficulty: 'Medium',
170+
topic: ['Data Structures', 'Heap'],
171+
},
172+
{
173+
id: 25,
174+
attempted: true,
175+
title: 'Dynamic Array',
176+
difficulty: 'Easy',
177+
topic: ['Arrays', 'Data Structures'],
178+
},
179+
{
180+
id: 26,
181+
attempted: false,
182+
title: 'Breadth-First Search',
183+
difficulty: 'Medium',
184+
topic: ['Graphs', 'BFS'],
185+
},
186+
{
187+
id: 27,
188+
attempted: true,
189+
title: 'Depth-First Search',
190+
difficulty: 'Medium',
191+
topic: ['Graphs', 'DFS'],
192+
},
193+
{
194+
id: 28,
195+
attempted: false,
196+
title: 'Floyd-Warshall Algorithm',
197+
difficulty: 'Hard',
198+
topic: ['Algorithms', 'Graphs'],
199+
},
200+
{
201+
id: 29,
202+
attempted: true,
203+
title: 'Binary Indexed Tree',
204+
difficulty: 'Hard',
205+
topic: ['Data Structures', 'Fenwick Tree'],
206+
},
207+
{
208+
id: 30,
209+
attempted: false,
210+
title: 'Knapsack Problem',
211+
difficulty: 'Medium',
212+
topic: ['Algorithms', 'Dynamic Programming'],
213+
},
214+
{
215+
id: 31,
216+
attempted: true,
217+
title: 'Segment Tree',
218+
difficulty: 'Hard',
219+
topic: ['Data Structures', 'Segment Tree'],
220+
},
221+
{
222+
id: 32,
223+
attempted: false,
224+
title: 'Linear Regression',
225+
difficulty: 'Medium',
226+
topic: ['Machine Learning', 'Regression'],
227+
},
228+
{
229+
id: 33,
230+
attempted: true,
231+
title: 'Polynomial Time Algorithms',
232+
difficulty: 'Hard',
233+
topic: ['Algorithms', 'Complexity'],
234+
},
235+
{
236+
id: 34,
237+
attempted: false,
238+
title: 'Monte Carlo Simulation',
239+
difficulty: 'Medium',
240+
topic: ['Algorithms', 'Simulation'],
241+
},
242+
{
243+
id: 35,
244+
attempted: true,
245+
title: 'Neural Networks',
246+
difficulty: 'Hard',
247+
topic: ['Machine Learning', 'Neural Networks'],
248+
},
249+
{
250+
id: 36,
251+
attempted: false,
252+
title: 'Reinforcement Learning Basics',
253+
difficulty: 'Hard',
254+
topic: ['Machine Learning', 'Reinforcement Learning'],
255+
},
256+
{
257+
id: 37,
258+
attempted: true,
259+
title: 'Bayesian Networks',
260+
difficulty: 'Medium',
261+
topic: ['Machine Learning', 'Bayesian Networks'],
262+
},
263+
{
264+
id: 38,
265+
attempted: false,
266+
title: 'Markov Chains',
267+
difficulty: 'Hard',
268+
topic: ['Machine Learning', 'Markov Chains'],
269+
},
270+
{
271+
id: 39,
272+
attempted: true,
273+
title: 'Quantum Algorithms',
274+
difficulty: 'Hard',
275+
topic: ['Algorithms', 'Quantum Computing'],
276+
},
277+
{
278+
id: 40,
279+
attempted: false,
280+
title: 'Cryptography Basics',
281+
difficulty: 'Medium',
282+
topic: ['Cryptography', 'Security'],
283+
},
81284
];

‎frontend/src/routes/questions/main.tsx‎

Lines changed: 7 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,21 @@
1-
import { useEffect, useState } from 'react';
1+
import { useEffect, useMemo } from 'react';
22
import { columns } from './table-columns';
33
import { QuestionTable } from './question-table';
44
import { useInfiniteQuery } from '@tanstack/react-query';
5-
import { IGetQuestionsResponse, Question } from '@/types/question-types';
5+
import { IGetQuestionsResponse } from '@/types/question-types';
66
import { useCrumbs } from '@/lib/hooks/use-crumbs';
77
import { WithNavBanner } from '@/components/blocks/authed/with-nav-banner';
8-
import { dummyData } from '@/assets/dummyData';
9-
10-
const ROWS_PER_PAGE = 12;
11-
async function fetchQuestions(): Promise<IGetQuestionsResponse> {
12-
return {
13-
questions: dummyData,
14-
totalQuestions: 20,
15-
};
16-
}
8+
import { fetchQuestions, ROWS_PER_PAGE } from '@/services/question-service';
179

1810
export function Questions() {
1911
const { crumbs } = useCrumbs();
2012

21-
const [questions, setQuestions] = useState<Question[]>([]);
22-
2313
const { data, error, fetchNextPage, hasNextPage, isError, isFetchingNextPage } = useInfiniteQuery<
2414
IGetQuestionsResponse,
2515
Error
2616
>({
2717
queryKey: ['questions'],
28-
queryFn: fetchQuestions,
18+
queryFn: ({ pageParam }) => fetchQuestions(pageParam as number | undefined),
2919
initialPageParam: 0,
3020
getNextPageParam: (lastPage, pages) => {
3121
const nextPage = pages.length;
@@ -44,11 +34,11 @@ export function Questions() {
4434
}
4535
}, [hasNextPage, isFetchingNextPage, fetchNextPage]);
4636

47-
useEffect(() => {
37+
const questions = useMemo(() => {
4838
if (data) {
49-
const newQuestions = data.pages.flatMap((page) => page.questions);
50-
setQuestions(newQuestions);
39+
return data.pages.flatMap((page) => page.questions);
5140
}
41+
return [];
5242
}, [data]);
5343

5444
return (

‎frontend/src/routes/questions/question-table.tsx‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,6 @@ import {
3333
SelectValue,
3434
} from '@/components/ui/select';
3535
import { useState } from 'react';
36-
import { Link } from 'react-router-dom';
3736

3837
interface QuestionTableProps<TData, TValue> {
3938
columns: ColumnDef<TData, TValue>[];
@@ -131,9 +130,7 @@ export function QuestionTable<TData, TValue>({
131130
<TableRow key={row.id}>
132131
{row.getVisibleCells().map((cell) => (
133132
<TableCell key={cell.id}>
134-
<Link to={`/questions/${row.id}`}>
135-
{flexRender(cell.column.columnDef.cell, cell.getContext())}
136-
</Link>
133+
{flexRender(cell.column.columnDef.cell, cell.getContext())}
137134
</TableCell>
138135
))}
139136
</TableRow>

‎frontend/src/routes/questions/table-columns.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Badge } from '@/components/ui/badge';
22
import { Question } from '@/types/question-types';
33
import { CheckCircledIcon } from '@radix-ui/react-icons';
44
import { ColumnDef } from '@tanstack/react-table';
5+
import { Link } from 'react-router-dom';
56

67
export const columns: ColumnDef<Question>[] = [
78
{
@@ -19,11 +20,10 @@ export const columns: ColumnDef<Question>[] = [
1920
cell: ({ row }) => {
2021
const id: number = row.original.id;
2122
const title: string = row.getValue('title');
22-
console.log(row);
2323
return (
24-
<p>
24+
<Link to={`/questions/${row.original.id}`} className='hover:underline'>
2525
{id}.&nbsp;{title}
26-
</p>
26+
</Link>
2727
);
2828
},
2929
},

‎frontend/src/services/question-service.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
// import { questionApiClient } from "./api-clients"
2+
import { dummyData } from '@/assets/dummyData';
23
import { questions } from '@/assets/questions';
4+
import { IGetQuestionsResponse } from '@/types/question-types';
35

46
type Question = (typeof questions)[number];
57

@@ -9,3 +11,15 @@ export const getQuestionDetails = (questionId: number): Promise<Question> => {
911
setTimeout(() => resolve(questions.find(({ id }) => id === questionId)!), 1000);
1012
});
1113
};
14+
15+
export const ROWS_PER_PAGE = 8;
16+
export async function fetchQuestions(pageParam: number = 0): Promise<IGetQuestionsResponse> {
17+
// return questionApiClient.get
18+
const start = pageParam * ROWS_PER_PAGE;
19+
const end = start + ROWS_PER_PAGE;
20+
await new Promise((r) => setTimeout(r, 10));
21+
return {
22+
questions: dummyData.slice(start, end),
23+
totalQuestions: dummyData.length,
24+
};
25+
}

0 commit comments

Comments
 (0)