Updated challenges and solution page (#87)

* Updated langind page and pagination for challenges page

* Updated the admin dashboard

* Updated challenge and solution page

Author: ramtejvigna

client-test/src/components/Challenges/index.tsx

@@ -55,7 +55,7 @@ const Challenges: React.FC = () => {
     platforms: []
   });
   const itemsPerPage = 5;
-  const { user } = useAuth();
+  const { user, isAuthenticated } = useAuth();
 
   // Debounced search function
   const useDebounce = (value: string, delay: number) => {
@@ -289,6 +289,11 @@ const Challenges: React.FC = () => {
 
   const checkPotdSolved = async () => {
     setIsRefreshing(true);
+    if(!isAuthenticated) {
+      toast.error("Please login to check status");
+      setIsRefreshing(false)
+      return;
+    }
     try {
       const response = await axios.post(`${import.meta.env.VITE_API_BASE_URL}/api/challenges/check-potd-status`, {
         dailyChallengeId: dailyProblem?._id
@@ -304,7 +309,7 @@ const Challenges: React.FC = () => {
       }
     } catch (error: any) {
       console.error("Error updating POTD status:", error);
-      toast.error("Challenge NOT solved Today");
+      toast.error("Challenge not solved today");
     } finally {
       setIsRefreshing(false);
     }
@@ -340,7 +345,16 @@ const Challenges: React.FC = () => {
   };
 
   // Open challenge link in a new tab
-  const openProblemLink = (url?: string) => url && window.open(url, "_blank");
+  const openProblemLink = (url?: string) => {
+    if(!isAuthenticated) {
+      toast.error("Please login to open problem");
+      return;
+    } else {
+      if(url) {
+        window.open(url, "_blank")
+      }
+    }
+  };
 
   return (
     <div className="w-full max-w-[1040px] mx-auto px-4 py-5 space-y-8 min-h-screen">

client-test/src/components/Challenges/solutionPage.tsx

@@ -22,6 +22,7 @@ interface SolutionData {
   description: string;
   category: string[];
   problemLink: string;
+  solved?: boolean;
   codeSnippets: {
     explanation: string;
     python: string;
@@ -163,6 +164,21 @@ const CategoryPill: React.FC<{ category: string; index: number }> = ({ category,
   );
 };
 
+// Solved Status Badge component
+const SolvedBadge: React.FC = () => {
+  return (
+    <motion.div
+      initial={{ scale: 0.8, opacity: 0 }}
+      animate={{ scale: 1, opacity: 1 }}
+      transition={{ duration: 0.3, delay: 0.2 }}
+      className="flex items-center gap-1.5 px-2.5 py-1 rounded-full bg-green-500/10 text-green-600 border border-green-500/20"
+    >
+      <Check className="h-3.5 w-3.5" />
+      <span className="text-xs font-medium">Solved</span>
+    </motion.div>
+  );
+};
+
 const SolutionPage: React.FC = () => {
   const location = useLocation();
   const navigate = useNavigate();
@@ -207,7 +223,6 @@ const SolutionPage: React.FC = () => {
         }
 
         const data: SolutionData = response.data;
-        console.log("data", data);
         if (data) {
           setSolution(data);
         } else {
@@ -281,10 +296,13 @@ const SolutionPage: React.FC = () => {
                   <div className="p-1.5 sm:p-2 rounded-xl bg-primary/10 dark:bg-primary/20 shadow-inner border border-primary/10">
                     <TerminalSquare className="h-5 w-5 sm:h-6 sm:w-6 text-primary" />
                   </div>
-                  <div>
-                    <h1 className="text-xl sm:text-2xl font-bold text-foreground">
-                      {solution.title}
-                    </h1>
+                  <div className="flex-1">
+                    <div className="flex items-center gap-2 flex-wrap">
+                      <h1 className="text-xl sm:text-2xl font-bold text-foreground">
+                        {solution.title}
+                      </h1>
+                      {solution.solved && <SolvedBadge />}
+                    </div>
                     <p className="text-xs sm:text-sm text-muted-foreground">Solution Explorer</p>
                   </div>
                 </motion.div>

server/controllers/challengeController.js

@@ -48,7 +48,6 @@ export const getChallenges = async (req, res) => {
         if (search && search.trim()) {
             filter.$or = [
                 { title: { $regex: search.trim(), $options: 'i' } },
-                { description: { $regex: search.trim(), $options: 'i' } },
                 { category: { $regex: search.trim(), $options: 'i' } }
             ];
         }
@@ -202,17 +201,31 @@ export const getChallengeById = async (req, res) => {
 export const getSolutionByChallengeId = async (req, res) => {
     try {
         const { id } = req.params;
+        const authenticatedUser = req.user;
 
         const solution = await Solution.findOne({ challenge: id })
             .populate('challenge', 'title description category problemLink')
             .select('-_id -__v');
 
         if (solution) {
+            // Check if user has solved this challenge
+            let isSolved = false;
+            if (authenticatedUser) {
+                const solvedChallengeIds = [
+                    ...(authenticatedUser.solveChallenges?.easy || []).map(item => item.challenge?.toString()),
+                    ...(authenticatedUser.solveChallenges?.medium || []).map(item => item.challenge?.toString()),
+                    ...(authenticatedUser.solveChallenges?.hard || []).map(item => item.challenge?.toString())
+                ].filter(Boolean);
+
+                isSolved = solvedChallengeIds.includes(id);
+            }
+
             const formattedSolution = {
                 title: solution.challenge.title,
                 description: solution.challenge.description,
                 category: solution.challenge.category,
                 problemLink: solution.challenge.problemLink,
+                solved: isSolved,
                 codeSnippets: {
                     explanation: solution.explanation,
                     python: solution.python,