diff --git a/frontend/src/components/questions/completion-indicator.tsx b/frontend/src/components/questions/completion-indicator.tsx
new file mode 100644
index 0000000..a427378
--- /dev/null
+++ b/frontend/src/components/questions/completion-indicator.tsx
@@ -0,0 +1,26 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import { CheckCircle } from "lucide-react";
+import { isQuestionCompleted } from "@/lib/progress";
+
+interface CompletionIndicatorProps {
+ slug: string;
+}
+
+export function CompletionIndicator({ slug }: CompletionIndicatorProps) {
+ const [completed, setCompleted] = useState(false);
+
+ useEffect(() => {
+ setCompleted(isQuestionCompleted(slug));
+ }, [slug]);
+
+ if (!completed) return null;
+
+ return (
+
+ );
+}
diff --git a/frontend/src/components/questions/question-card.tsx b/frontend/src/components/questions/question-card.tsx
index fffba35..7f5e7de 100644
--- a/frontend/src/components/questions/question-card.tsx
+++ b/frontend/src/components/questions/question-card.tsx
@@ -1,6 +1,7 @@
import Link from "next/link";
import { Badge } from "@/components/ui/badge";
import { getDifficultyVariant, getDifficultyLabel, capitalize } from "@/lib/utils";
+import { CompletionIndicator } from "./completion-indicator";
import type { QuestionListItem } from "@/types";
interface QuestionCardProps {
@@ -14,7 +15,10 @@ export function QuestionCard({ question }: QuestionCardProps) {
className="block p-4 rounded-lg border border-[var(--border)] bg-[var(--card)] hover:border-[var(--primary)] transition-colors"
>
-
{question.title}
+
+
+
{question.title}
+
{
+ if (typeof window === "undefined") return new Set();
+ const stored = localStorage.getItem(PROGRESS_KEY);
+ return stored ? new Set(JSON.parse(stored)) : new Set();
+}
+
+export function markQuestionCompleted(slug: string, code?: string): void {
+ const completed = getCompletedQuestions();
+ completed.add(slug);
+ localStorage.setItem(PROGRESS_KEY, JSON.stringify([...completed]));
+
+ if (code) {
+ saveSolution(slug, code);
+ }
+}
+
+export function isQuestionCompleted(slug: string): boolean {
+ return getCompletedQuestions().has(slug);
+}
+
+export function saveSolution(slug: string, code: string): void {
+ if (typeof window === "undefined") return;
+ const solutions = getSavedSolutions();
+ solutions[slug] = code;
+ localStorage.setItem(SOLUTIONS_KEY, JSON.stringify(solutions));
+}
+
+export function getSavedSolution(slug: string): string | null {
+ if (typeof window === "undefined") return null;
+ const solutions = getSavedSolutions();
+ return solutions[slug] || null;
+}
+
+function getSavedSolutions(): Record {
+ const stored = localStorage.getItem(SOLUTIONS_KEY);
+ return stored ? JSON.parse(stored) : {};
+}