Implement problem data for JavaScript levels

app/problems/index.ts

@@ -25,16 +25,53 @@ export type Problem = {
   issues: Issue[];
 };
 
+// Import all problem JSON files using Vite's glob import
+const problemModules = import.meta.glob<{ default: Problem }>(
+  './javascript/level*/*.json',
+  { eager: true }
+);
+
+// Cache for loaded problems
+const problemsCache: Problem[] = [];
+let cacheInitialized = false;
+
+/**
+ * Initialize problems cache
+ */
+function initializeProblemsCache() {
+  if (cacheInitialized) return;
+
+  for (const path in problemModules) {
+    const problem = problemModules[path].default;
+    problemsCache.push(problem);
+  }
+
+  cacheInitialized = true;
+}
+
 /**
  * Get problems by language and level
  * @param lang - Code language or 'all'
  * @param level - Problem difficulty level (1, 2, or 3)
  * @returns Array of problems matching the criteria
  */
-export function getProblems(_lang: CodeLanguageOrAll, _level: number): Problem[] {
-  // TODO: Implement problem loading logic
-  // This will be implemented in feature/problem-loader
-  return [];
+export function getProblems(lang: CodeLanguageOrAll, level: number): Problem[] {
+  initializeProblemsCache();
+
+  return problemsCache.filter((problem) => {
+    const langMatch = lang === 'all' || problem.codeLanguage === lang;
+    const levelMatch = problem.level === level;
+    return langMatch && levelMatch;
+  });
+}
+
+/**
+ * Get all problems
+ * @returns Array of all problems
+ */
+export function getAllProblems(): Problem[] {
+  initializeProblemsCache();
+  return [...problemsCache];
 }
 
 /**

app/problems/javascript/level1/js-l1-001.json

@@ -0,0 +1,25 @@
+{
+  "id": "js-l1-001",
+  "codeLanguage": "javascript",
+  "level": 1,
+  "code": [
+    "function processUserData(userId) {",
+    "  const userId = getUserId();",
+    "  const userData = fetchData(userId);",
+    "  return userData;",
+    "}"
+  ],
+  "issues": [
+    {
+      "id": "js-l1-001-1",
+      "lines": [2],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "引数userIdと同名の変数を再定義しているため、SyntaxErrorが発生します",
+        "en": "Redeclaring variable 'userId' with the same name as the parameter causes a SyntaxError"
+      }
+    }
+  ]
+}

app/problems/javascript/level1/js-l1-002.json

@@ -0,0 +1,27 @@
+{
+  "id": "js-l1-002",
+  "codeLanguage": "javascript",
+  "level": 1,
+  "code": [
+    "function countDown(num) {",
+    "  let i = num;",
+    "  while (i > 0) {",
+    "    console.log(i);",
+    "  }",
+    "  return 'Done';",
+    "}"
+  ],
+  "issues": [
+    {
+      "id": "js-l1-002-1",
+      "lines": [3, 4, 5],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "whileループ内でiをデクリメントしていないため、無限ループが発生します",
+        "en": "Infinite loop occurs because 'i' is never decremented inside the while loop"
+      }
+    }
+  ]
+}

app/problems/javascript/level1/js-l1-003.json

@@ -0,0 +1,26 @@
+{
+  "id": "js-l1-003",
+  "codeLanguage": "javascript",
+  "level": 1,
+  "code": [
+    "function formatDate(date) {",
+    "  const year = date.getFullYear();",
+    "  const month = date.getMonth();",
+    "  const day = date.getDate();",
+    "  return `${year}/${month}/${day}`;",
+    "}"
+  ],
+  "issues": [
+    {
+      "id": "js-l1-003-1",
+      "lines": [3, 5],
+      "type": "bug",
+      "severity": "normal",
+      "score": 4,
+      "description": {
+        "ja": "getMonth()は0-11の値を返すため、月の表示が1ヶ月ずれます。+1する必要があります",
+        "en": "getMonth() returns 0-11, so the month display will be off by one. Need to add +1"
+      }
+    }
+  ]
+}

app/problems/javascript/level2/js-l2-001.json

@@ -0,0 +1,37 @@
+{
+  "id": "js-l2-001",
+  "codeLanguage": "javascript",
+  "level": 2,
+  "code": [
+    "class Calculator {",
+    "  constructor(value) {",
+    "    this.value = value;",
+    "  }",
+    "",
+    "  add(n) {",
+    "    this.value += n;",
+    "    return this;",
+    "  }",
+    "",
+    "  getValue() {",
+    "    return this.value;",
+    "  }",
+    "}",
+    "",
+    "const calc = new Calculator(10);",
+    "calc.add(5).subtract(3).getValue();"
+  ],
+  "issues": [
+    {
+      "id": "js-l2-001-1",
+      "lines": [17],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "subtractメソッドが定義されていないため、実行時にTypeErrorが発生します",
+        "en": "The 'subtract' method is not defined, causing a TypeError at runtime"
+      }
+    }
+  ]
+}

app/problems/javascript/level2/js-l2-002.json

@@ -0,0 +1,38 @@
+{
+  "id": "js-l2-002",
+  "codeLanguage": "javascript",
+  "level": 2,
+  "code": [
+    "function removeDuplicates(items) {",
+    "  const uniqueItems = new Set(items);",
+    "  return uniqueItems[0];",
+    "}",
+    "",
+    "const result = removeDuplicates([1, 2, 2, 3, 3, 4]);",
+    "console.log(result);"
+  ],
+  "issues": [
+    {
+      "id": "js-l2-002-1",
+      "lines": [3],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "Setはインデックスアクセスできません。Array.from()やスプレッド構文を使う必要があります",
+        "en": "Set cannot be accessed by index. Need to use Array.from() or spread syntax"
+      }
+    },
+    {
+      "id": "js-l2-002-2",
+      "lines": [3],
+      "type": "design",
+      "severity": "normal",
+      "score": 2,
+      "description": {
+        "ja": "関数名はremoveDuplicatesなのに最初の要素だけを返すのは意図が不明確です",
+        "en": "The function name suggests removing duplicates, but it only returns the first element"
+      }
+    }
+  ]
+}

app/problems/javascript/level2/js-l2-003.json

@@ -0,0 +1,41 @@
+{
+  "id": "js-l2-003",
+  "codeLanguage": "javascript",
+  "level": 2,
+  "code": [
+    "function calculateTotal(price, quantity) {",
+    "  const tax = 0.1;",
+    "  const subtotal = price * quantity;",
+    "  const total = subtotal + subtotal * tax;",
+    "  return total.toFixed(2);",
+    "}",
+    "",
+    "const userInput = document.getElementById('quantity').value;",
+    "const result = calculateTotal(1000, userInput);",
+    "console.log(`合計: ${result}円`);"
+  ],
+  "issues": [
+    {
+      "id": "js-l2-003-1",
+      "lines": [8, 9],
+      "type": "bug",
+      "severity": "normal",
+      "score": 4,
+      "description": {
+        "ja": "input要素のvalueは文字列なので、数値演算の前にNumber()やparseInt()で変換が必要です",
+        "en": "The value property of input element is a string, needs conversion with Number() or parseInt() before arithmetic operations"
+      }
+    },
+    {
+      "id": "js-l2-003-2",
+      "lines": [9],
+      "type": "design",
+      "severity": "minor",
+      "score": 2,
+      "description": {
+        "ja": "入力値の妥当性チェック（NaN、負数、小数など）が行われていません",
+        "en": "No validation for input value (NaN, negative numbers, decimals, etc.)"
+      }
+    }
+  ]
+}

app/problems/javascript/level3/js-l3-001.json

@@ -0,0 +1,45 @@
+{
+  "id": "js-l3-001",
+  "codeLanguage": "javascript",
+  "level": 3,
+  "code": [
+    "function updateUserSettings(currentSettings, updates) {",
+    "  const entries = Object.entries(updates);",
+    "  ",
+    "  for (let i = 0; i < entries.length; i++) {",
+    "    const key = entries[i][0];",
+    "    const value = entries[i][1];",
+    "    currentSettings.key = value;",
+    "  }",
+    "  ",
+    "  return currentSettings;",
+    "}",
+    "",
+    "const settings = { theme: 'dark', language: 'ja' };",
+    "updateUserSettings(settings, { theme: 'light' });"
+  ],
+  "issues": [
+    {
+      "id": "js-l3-001-1",
+      "lines": [7],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "ドット記法でkeyを使うと文字列'key'がプロパティ名になります。ブラケット記法[key]を使う必要があります",
+        "en": "Using dot notation with 'key' creates a property named 'key'. Should use bracket notation [key]"
+      }
+    },
+    {
+      "id": "js-l3-001-2",
+      "lines": [4, 5, 6, 7, 8],
+      "type": "design",
+      "severity": "minor",
+      "score": 2,
+      "description": {
+        "ja": "for...ofループを使えばより簡潔に書けます: for (const [key, value] of entries)",
+        "en": "Can be written more concisely using for...of loop: for (const [key, value] of entries)"
+      }
+    }
+  ]
+}

app/problems/javascript/level3/js-l3-002.json

@@ -0,0 +1,64 @@
+{
+  "id": "js-l3-002",
+  "codeLanguage": "javascript",
+  "level": 3,
+  "code": [
+    "class User {",
+    "  constructor(id, name) {",
+    "    this.id = id;",
+    "    this.name = name;",
+    "  }",
+    "",
+    "  static findById(users, id) {",
+    "    return users.find(user => user.id === id);",
+    "  }",
+    "",
+    "  findByName(name) {",
+    "    return this.find(user => user.name === name);",
+    "  }",
+    "}",
+    "",
+    "const users = [",
+    "  new User(1, 'Alice'),",
+    "  new User(2, 'Bob')",
+    "];",
+    "",
+    "const user = User.findById(users, 1);",
+    "const result = user.findByName('Bob');"
+  ],
+  "issues": [
+    {
+      "id": "js-l3-002-1",
+      "lines": [12],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "インスタンスメソッド内でthis.find()を呼んでいますが、thisはUserインスタンスで配列ではありません",
+        "en": "Calling this.find() in instance method, but 'this' is a User instance, not an array"
+      }
+    },
+    {
+      "id": "js-l3-002-2",
+      "lines": [22],
+      "type": "bug",
+      "severity": "critical",
+      "score": 4,
+      "description": {
+        "ja": "findByNameはインスタンスメソッドですが、配列を受け取るように設計されていません。静的メソッドにすべきです",
+        "en": "findByName is an instance method but not designed to receive an array. Should be a static method"
+      }
+    },
+    {
+      "id": "js-l3-002-3",
+      "lines": [11, 12, 13],
+      "type": "design",
+      "severity": "normal",
+      "score": 2,
+      "description": {
+        "ja": "findByNameメソッドの設計が不適切です。静的メソッドとして定義し、配列を引数に取るべきです",
+        "en": "Poor design of findByName method. Should be defined as a static method and take an array as parameter"
+      }
+    }
+  ]
+}