+
+ Question Repository
+
+
+
+
+
+
+ );
+};
+
+export default QuestionList;
diff --git a/frontend/src/constants/.gitkeep b/frontend/src/constants/.gitkeep
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/frontend/src/constants/mock_questions.ts b/frontend/src/constants/mock_questions.ts
new file mode 100644
index 0000000000..6ef0bc7c2c
--- /dev/null
+++ b/frontend/src/constants/mock_questions.ts
@@ -0,0 +1,38 @@
+import { Question } from "../models/question.model";
+
+export const mockQuestions: Question[] = [
+ {
+ questionId: "1",
+ title: "What is a Binary Search Tree?",
+ description:
+ "A binary search tree is a data structure that facilitates fast lookup, addition, and removal of items.",
+ categories: ["Algorithms", "Data Structures"],
+ complexity: "Medium",
+ link: "",
+ },
+ {
+ questionId: "2",
+ title: "Explain the concept of closures in JavaScript",
+ description: "Closures are a way to access variables defined outsquestionIde of a function's scope.",
+ categories: ["JavaScript", "Functional Programming"],
+ complexity: "Hard",
+ link: "",
+ },
+ {
+ questionId: "3",
+ title: "What is polymorphism in OOP?",
+ description:
+ "Polymorphism is the ability of different objects to respond in different ways to the same method call.",
+ categories: ["OOP"],
+ complexity: "Easy",
+ link: "",
+ },
+ {
+ questionId: "4",
+ title: "Reverse a String",
+ description: "Write a function that reverses a string. The input string is given as an array of characters.",
+ categories: ["Strings", "Algorithms"],
+ complexity: "Easy",
+ link: "",
+ },
+];
diff --git a/frontend/src/constants/urls.ts b/frontend/src/constants/urls.ts
new file mode 100644
index 0000000000..e0b82b405f
--- /dev/null
+++ b/frontend/src/constants/urls.ts
@@ -0,0 +1 @@
+export const gitHubUrl = "https://github.com/CS3219-AY2425S1/cs3219-ay2425s1-project-g06";
diff --git a/frontend/src/contexts/ConfirmationDialogContext.tsx b/frontend/src/contexts/ConfirmationDialogContext.tsx
new file mode 100644
index 0000000000..6de86433da
--- /dev/null
+++ b/frontend/src/contexts/ConfirmationDialogContext.tsx
@@ -0,0 +1,68 @@
+import { createContext, ReactNode, useContext, useState } from "react";
+import ConfirmationDialog from "../components/ConfirmationDialog/ConfirmationDialog";
+//import ConfirmationDialog from "../components/ConfirmationDialog/ConfirmationDialog";
+
+interface ConfirmationDialogContextType {
+ isOpen: boolean;
+ title: string;
+ content: string;
+ openConfirmationDialog: () => void;
+ closeConfirmationDialog: () => void;
+ chooseConfirm: () => void;
+ setConfirmationDialogTitle: (title: string) => void;
+ setConfirmationDialogContent: (content: string) => void;
+ setConfirmationCallBack: (confirmationCallback: () => void) => void;
+}
+
+const ConfirmationDialogContext = createContext| handleSort("questionId")} + className={`${styles.clickable} ${sortKey === "questionId" ? styles[sortOrder] : ""}`} + > + ID + | +handleSort("title")} + className={`${styles.clickable} ${sortKey === "title" ? styles[sortOrder] : ""}`} + > + Title + | +Categories | +handleSort("complexity")} + className={`${styles.clickable} ${sortKey === "complexity" ? styles[sortOrder] : ""}`} + > + Complexity + | +Actions | +
|---|---|---|---|---|
| {question.questionId} | +
+
+
+ |
+
+
+ {question.categories.map((tag, index) => (
+
+ {tag}
+
+ ))}
+
+ |
+ {question.complexity} | +
+ |
+
-
- 
-
-
+ Welcome to lucKY JiNX!
-Empowering Your{" "} +
Loading questions...
; + // } + + // if (error) { + // return{error}
; + // } + + // Function to truncate long descriptions + const truncateDescription = (description: string, maxLength: number) => { + if (description.length > maxLength) { + return description.substring(0, maxLength) + "..."; + } + return description; + }; + + const handleSort = (key: keyof Question) => { + const order = sortKey === key && sortOrder === "asc" ? "desc" : "asc"; + setSortKey(key); + setSortOrder(order); + + const sortedQuestions = [...questions].sort((a, b) => { + if (key === "complexity") { + const aValue = getComplexityValue(a.complexity); + const bValue = getComplexityValue(b.complexity); + return order === "asc" ? aValue - bValue : bValue - aValue; + } + + if (a[key] < b[key]) { + return order === "asc" ? -1 : 1; + } + if (a[key] > b[key]) { + return order === "asc" ? 1 : -1; + } + return 0; + }); + + setQuestions(sortedQuestions); + }; + + return ( +
+
+
+
+
+ );
+};
+
+export default QuestionList;
diff --git a/frontend/src/services/question.service.ts b/frontend/src/services/question.service.ts
new file mode 100644
index 0000000000..6245309dc3
--- /dev/null
+++ b/frontend/src/services/question.service.ts
@@ -0,0 +1,41 @@
+import axios from "axios";
+import { Question, QuestionComplexity } from "../models/question.model";
+import { verifyNewQuestion } from "../util/question.helper";
+
+export default class QuestionService {
+ static async getQuestions(): PromiseQuestion Repository
+| handleSort("id")} + className={`${styles.clickable} ${sortKey === "id" ? styles[sortOrder] : ""}`} + > + ID + | +handleSort("title")} + className={`${styles.clickable} ${sortKey === "title" ? styles[sortOrder] : ""}`} + > + Title + | +Description | +Category | +handleSort("complexity")} + className={`${styles.clickable} ${sortKey === "complexity" ? styles[sortOrder] : ""}`} + > + Complexity + | +
|---|---|---|---|---|
| {question.id} | +{question.title} | +{truncateDescription(question.description, 100)} | +
+
+ {question.category.map((tag, index) => (
+
+ {tag}
+
+ ))}
+
+ |
+ {question.complexity} | +