Add test creation filters and question loading improvements

README.md

@@ -108,7 +108,8 @@ Each subject has an `index.json` that lists all questions:
       "file": "questions/0001.json",
       "questionId": "032-0001",
       "questionNumber": "032-0001",
-      "correctOption": "a"
+      "correctOption": "a",
+      "hasAttachment": true
     }
   ]
 }

app/api/subject/route.js

@@ -0,0 +1,26 @@
+import { readFile } from "node:fs/promises";
+import path from "node:path";
+import { NextResponse } from "next/server";
+
+export async function GET(request) {
+  const { searchParams } = new URL(request.url);
+  const subject = searchParams.get("id");
+
+  if (!subject || !/^\d{3}$/.test(subject)) {
+    return NextResponse.json({ error: "Invalid subject" }, { status: 400 });
+  }
+
+  const indexPath = path.join(process.cwd(), "data", "tests", subject, "index.json");
+
+  try {
+    const raw = await readFile(indexPath, "utf-8");
+    const data = JSON.parse(raw);
+    const entries = (data.questions || []).map((q) => ({
+      id: q.questionId,
+      hasAttachment: Boolean(q.hasAttachment),
+    }));
+    return NextResponse.json({ entries });
+  } catch {
+    return NextResponse.json({ error: "Subject not found" }, { status: 404 });
+  }
+}

app/create-test/page.jsx

@@ -24,9 +24,7 @@ export default async function CreateTestPage() {
         <p className="muted">Choose subject and question count, then save the test.</p>
       </div>
 
-      <section className="setup-card">
-        <CreateTestForm subjects={subjects} />
-      </section>
+      <CreateTestForm subjects={subjects} />
     </main>
   );
 }

app/globals.css

@@ -451,8 +451,10 @@ a {
   border: 1px solid var(--line);
   border-radius: 16px;
   box-shadow: var(--shadow);
-  padding: 1rem;
+  padding: 1.15rem;
   max-width: 560px;
+  display: grid;
+  gap: 0.75rem;
 }
 
 .slider-form {
@@ -462,8 +464,9 @@ a {
 
 .create-test-form {
   display: grid;
-  gap: 0.9rem;
+  gap: 1rem;
   min-width: 0;
+  max-width: 560px;
   overflow: hidden;
 }
 
@@ -513,6 +516,30 @@ a {
 .slider-label {
   font-family: var(--font-heading), sans-serif;
   font-size: 0.95rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+}
+
+.count-input {
+  width: 4.5rem;
+  border-radius: 8px;
+  border: 1px solid var(--line);
+  background: var(--surface);
+  color: var(--ink);
+  font: inherit;
+  font-size: 0.95rem;
+  font-weight: 600;
+  padding: 0.35rem 0.5rem;
+  text-align: center;
+  -moz-appearance: textfield;
+}
+
+.count-input::-webkit-inner-spin-button,
+.count-input::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
 }
 
 .question-slider {
@@ -528,6 +555,75 @@ a {
   color: var(--ink-soft);
 }
 
+.field-heading {
+  font-family: var(--font-heading), sans-serif;
+  font-size: 1rem;
+  font-weight: 600;
+  color: var(--ink);
+}
+
+.filter-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.filter-mode-toggle {
+  appearance: none;
+  border: 1px solid var(--accent);
+  border-radius: 6px;
+  background: rgba(15, 122, 105, 0.08);
+  color: var(--accent);
+  font-family: var(--font-heading), sans-serif;
+  font-size: 0.72rem;
+  font-weight: 700;
+  letter-spacing: 0.05em;
+  padding: 0.2rem 0.5rem;
+  cursor: pointer;
+}
+
+.filter-mode-toggle:hover {
+  background: rgba(15, 122, 105, 0.16);
+}
+
+.filter-group {
+  display: grid;
+  gap: 0.4rem;
+  padding-top: 0.4rem;
+}
+
+.filter-group-label {
+  font-family: var(--font-heading), sans-serif;
+  font-size: 0.85rem;
+  font-weight: 600;
+  color: var(--ink-soft);
+  margin-bottom: 0.15rem;
+  padding-bottom: 0.2rem;
+  border-bottom: 1px solid var(--line);
+}
+
+.filter-option {
+  display: flex;
+  align-items: center;
+  gap: 0.55rem;
+  font-size: 0.88rem;
+  color: var(--ink);
+  cursor: pointer;
+  padding: 0.28rem 0.1rem;
+}
+
+.filter-option input[type="radio"],
+.filter-option input[type="checkbox"] {
+  accent-color: var(--accent);
+  margin: 0;
+  cursor: pointer;
+}
+
+.filter-option:has(input:disabled) {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+
 .runner-layout {
   display: grid;
   width: 100%;

app/tests/[testId]/run/page.jsx

@@ -42,10 +42,19 @@ export default async function RunTestPage({ params, searchParams }) {
 
   const explicitQuestionIds = parseQuestionIds(resolvedSearchParams?.questionIds);
   const explicitQuestionIdSet = new Set(explicitQuestionIds);
-  const scopedEntries = explicitQuestionIds.length
+  const filter = resolvedSearchParams?.filter || null;
+
+  let scopedEntries = explicitQuestionIds.length
     ? test.entries.filter((entry) => explicitQuestionIdSet.has(String(entry.id)))
     : test.entries;
 
+  // Apply filters (seen/not-seen are resolved client-side via questionIds)
+  if (filter === "with-attachment") {
+    scopedEntries = scopedEntries.filter((e) => e.hasAttachment);
+  } else if (filter === "without-attachment") {
+    scopedEntries = scopedEntries.filter((e) => !e.hasAttachment);
+  }
+
   if (!scopedEntries.length) {
     notFound();
   }