Integrate question list endpoint

Signed-off-by: SeeuSim <[email protected]>

Author: SeeuSim

backend/question/src/services/get/index.ts

@@ -36,7 +36,8 @@ export const getQuestionsService = async (
     .from(questions)
     .where(and(...whereClause))
     .limit(recordsPerPage)
-    .offset(offset);
+    .offset(offset)
+    .orderBy(questions.id);
 
   const [results, totalCount] = await Promise.all([
     query,

frontend/src/components/providers/query-provider.tsx

@@ -1,9 +1,10 @@
 import { FC, PropsWithChildren } from 'react';
 import { QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+
 import { queryClient } from '@/lib/query-client';
 
-const IS_SHOW_DEVTOOLS = true;
+const IS_SHOW_DEVTOOLS = false;
 
 export const QueryProvider: FC<PropsWithChildren> = ({ children }) => {
   return (

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

@@ -39,10 +39,10 @@ export const columns: ColumnDef<Question>[] = [
     filterFn: 'equals',
   },
   {
-    accessorKey: 'topics',
+    accessorKey: 'topic',
     header: 'Topics',
     cell: ({ row }) => {
-      const topics: string[] = row.getValue('topics');
+      const topics: string[] = row.getValue('topic');
       return (
         <div>
           {topics.map((topic) => (

frontend/src/services/question-service.ts

@@ -1,13 +1,12 @@
-import { questionApiClient } from './api-clients';
-import { questions } from '@/assets/questions';
 import type { IGetQuestionsResponse } from '@/types/question-types';
 
+import { questionApiClient } from './api-clients';
+
 const QUESTION_SERVICE_ROUTES = {
   GET_QUESTIONS: '/questions',
   GET_QUESTION_DETAILS: '/questions/<questionId>',
 };
 
-// type QuestionDetails = (typeof questionDetails)[number];
 type IGetQuestionDetailsResponse = {
   question: {
     title: string;
@@ -18,30 +17,24 @@ type IGetQuestionDetailsResponse = {
   };
 };
 
-type IQuestionDetails = Required<IGetQuestionDetailsResponse>['question'];
-
 export const getQuestionDetails = (questionId: number): Promise<IGetQuestionDetailsResponse> => {
+  // TODO: Add error handling and notifs
   return questionApiClient
     .get(QUESTION_SERVICE_ROUTES.GET_QUESTION_DETAILS.replace(/<questionId>/, String(questionId)))
     .then((v) => {
       return v.data as IGetQuestionDetailsResponse;
     });
-  // // return questionApiClient.get
-  // console.log(questionDetails.find(({ id }) => id === questionId));
-  // return new Promise((resolve, _reject) => {
-  //   setTimeout(() => resolve(questionDetails.find(({ id }) => id === questionId)!), 1000);
-  // });
 };
 
 export const ROWS_PER_PAGE = 8;
-export async function fetchQuestions(pageParam: number = 0): Promise<IGetQuestionsResponse> {
-  // return questionApiClient.get
-  const start = pageParam * ROWS_PER_PAGE;
-  const end = start + ROWS_PER_PAGE;
-  await new Promise((r) => setTimeout(r, 10));
+export async function fetchQuestions(pageNum: number = 0): Promise<IGetQuestionsResponse> {
+  const params = new URLSearchParams({
+    pageNum: String(pageNum),
+    recordsPerPage: String(ROWS_PER_PAGE),
+  }).toString();
 
-  return {
-    questions: questions.slice(start, end),
-    totalQuestions: questions.length,
-  };
+  // TODO: Add error handling and notifs
+  return questionApiClient
+    .get(QUESTION_SERVICE_ROUTES.GET_QUESTIONS + `?${params}`)
+    .then((res) => res.data as IGetQuestionsResponse);
 }