diff --git a/.env.development b/.env.development
new file mode 100644
index 0000000..b8d33d1
--- /dev/null
+++ b/.env.development
@@ -0,0 +1,2 @@
+VITE_API_BASE_URL=/mocks
+VITE_API_MOCKING_ENABLED=true
diff --git a/.env.production b/.env.production
new file mode 100644
index 0000000..d98ad3c
--- /dev/null
+++ b/.env.production
@@ -0,0 +1,2 @@
+VITE_API_BASE_URL=http://127.0.0.1:3338
+VITE_API_MOCKING_ENABLED=false
diff --git a/eslint.config.js b/eslint.config.js
index ee2ff17..0af1c9e 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -14,9 +14,13 @@ export default tseslint.config(
         tsconfigRootDir: import.meta.dirname,
       },
     },
-  },
-  { ignores: ['dist'] },
-  {
+  }, {
+    ignores: [
+      'dist',
+      '.storybook',
+      'public/mockServiceWorker.js',
+    ]
+  }, {
     extends: [
       js.configs.recommended, 
       ...tseslint.configs.recommendedTypeChecked,
diff --git a/package-lock.json b/package-lock.json
index 6cf6579..37ab38c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -22,6 +22,7 @@
         "@radix-ui/react-toggle": "^1.1.2",
         "@radix-ui/react-tooltip": "^1.1.8",
         "@tailwindcss/vite": "^4.0.7",
+        "@tanstack/react-query": "^5.66.8",
         "class-variance-authority": "^0.7.1",
         "clsx": "^2.1.1",
         "eslint-plugin-react": "^7.37.4",
@@ -37,6 +38,7 @@
       },
       "devDependencies": {
         "@eslint/js": "^9.19.0",
+        "@mswjs/data": "^0.16.2",
         "@testing-library/jest-dom": "^6.6.3",
         "@types/node": "^22.13.4",
         "@types/react": "^19.0.8",
@@ -48,6 +50,7 @@
         "eslint-plugin-react-refresh": "^0.4.18",
         "globals": "^15.14.0",
         "jsdom": "^26.0.0",
+        "msw": "^2.7.0",
         "typescript": "~5.7.2",
         "typescript-eslint": "^8.22.0",
         "vite": "^6.1.0",
@@ -360,6 +363,63 @@
         "node": ">=18"
       }
     },
+    "node_modules/@bundled-es-modules/cookie": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/cookie/-/cookie-2.0.1.tgz",
+      "integrity": "sha512-8o+5fRPLNbjbdGRRmJj3h6Hh1AQJf2dk3qQ/5ZFb+PXkRNiSoMGGUKlsgLfrxneb72axVJyIYji64E2+nNfYyw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "cookie": "^0.7.2"
+      }
+    },
+    "node_modules/@bundled-es-modules/cookie/node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/@bundled-es-modules/statuses": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/statuses/-/statuses-1.0.1.tgz",
+      "integrity": "sha512-yn7BklA5acgcBr+7w064fGV+SGIFySjCKpqjcWgBAIfrAkY+4GQTJJHQMeT3V/sgz23VTEVV8TtOmkvJAhFVfg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "statuses": "^2.0.1"
+      }
+    },
+    "node_modules/@bundled-es-modules/tough-cookie": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/tough-cookie/-/tough-cookie-0.1.6.tgz",
+      "integrity": "sha512-dvMHbL464C0zI+Yqxbz6kZ5TOEp7GLW+pry/RWndAR8MJQAXZ2rPmIs8tziTZjeIyhSNZgZbCePtfSbdWqStJw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@types/tough-cookie": "^4.0.5",
+        "tough-cookie": "^4.1.4"
+      }
+    },
+    "node_modules/@bundled-es-modules/tough-cookie/node_modules/tough-cookie": {
+      "version": "4.1.4",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.4.tgz",
+      "integrity": "sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "psl": "^1.1.33",
+        "punycode": "^2.1.1",
+        "universalify": "^0.2.0",
+        "url-parse": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/@csstools/color-helpers": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.0.1.tgz",
@@ -689,6 +749,144 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
+    "node_modules/@inquirer/confirm": {
+      "version": "5.1.6",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.6.tgz",
+      "integrity": "sha512-6ZXYK3M1XmaVBZX6FCfChgtponnL0R6I7k8Nu+kaoNkT828FVZTcca1MqmWQipaW2oNREQl5AaPCUOOCVNdRMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.1.7",
+        "@inquirer/type": "^3.0.4"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/core": {
+      "version": "10.1.7",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.1.7.tgz",
+      "integrity": "sha512-AA9CQhlrt6ZgiSy6qoAigiA1izOa751ugX6ioSjqgJ+/Gd+tEN/TORk5sUYNjXuHWfW0r1n/a6ak4u/NqHHrtA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/figures": "^1.0.10",
+        "@inquirer/type": "^3.0.4",
+        "ansi-escapes": "^4.3.2",
+        "cli-width": "^4.1.0",
+        "mute-stream": "^2.0.0",
+        "signal-exit": "^4.1.0",
+        "wrap-ansi": "^6.2.0",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@inquirer/core/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/figures": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.10.tgz",
+      "integrity": "sha512-Ey6176gZmeqZuY/W/nZiUyvmb1/qInjcpiZjXWi6nON+nxJpD1bxtSoBxNliGISae32n6OwbY+TSXPZ1CfS4bw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/type": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-3.0.4.tgz",
+      "integrity": "sha512-2MNFrDY8jkFYc9Il9DgLsHhMzuHnOYM1+CUYVWbzu9oT0hC7V7EcYvdCKeoll/Fcci04A+ERZ9wcc7cQ8lTkIA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -760,6 +958,49 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@mswjs/data": {
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/@mswjs/data/-/data-0.16.2.tgz",
+      "integrity": "sha512-/C0d/PBcJyQJokUhcjO4HiZPc67hzllKlRtD1XELygl2t991/ATAAQJVcStn4YtVALsNodruzOHT0JIvgr0hnA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/lodash": "^4.14.172",
+        "@types/md5": "^2.3.0",
+        "@types/pluralize": "^0.0.29",
+        "@types/uuid": "^8.3.0",
+        "date-fns": "^2.21.1",
+        "debug": "^4.3.1",
+        "graphql": "^16.8.1",
+        "lodash": "^4.17.21",
+        "md5": "^2.3.0",
+        "outvariant": "^1.2.1",
+        "pluralize": "^8.0.0",
+        "strict-event-emitter": "^0.5.0",
+        "uuid": "^8.3.1"
+      },
+      "optionalDependencies": {
+        "msw": "^2.0.8"
+      }
+    },
+    "node_modules/@mswjs/interceptors": {
+      "version": "0.37.6",
+      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.37.6.tgz",
+      "integrity": "sha512-wK+5pLK5XFmgtH3aQ2YVvA3HohS3xqV/OxuVOdNx9Wpnz7VE/fnC+e1A7ln6LFYeck7gOJ/dsZV6OLplOtAJ2w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@open-draft/deferred-promise": "^2.2.0",
+        "@open-draft/logger": "^0.3.0",
+        "@open-draft/until": "^2.0.0",
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.3",
+        "strict-event-emitter": "^0.5.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "dev": true,
@@ -792,6 +1033,31 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@open-draft/deferred-promise": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/deferred-promise/-/deferred-promise-2.2.0.tgz",
+      "integrity": "sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@open-draft/logger": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/logger/-/logger-0.3.0.tgz",
+      "integrity": "sha512-X2g45fzhxH238HKO4xbSr7+wBS8Fvw6ixhTDuvLd5mqh6bJJCFAPwU9mPDxbcrRtfxv4u5IHCEH77BmxvXmmxQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.0"
+      }
+    },
+    "node_modules/@open-draft/until": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/until/-/until-2.1.0.tgz",
+      "integrity": "sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@pkgjs/parseargs": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
@@ -1900,6 +2166,32 @@
         "vite": "^5.2.0 || ^6"
       }
     },
+    "node_modules/@tanstack/query-core": {
+      "version": "5.66.4",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.66.4.tgz",
+      "integrity": "sha512-skM/gzNX4shPkqmdTCSoHtJAPMTtmIJNS0hE+xwTTUVYwezArCT34NMermABmBVUg5Ls5aiUXEDXfqwR1oVkcA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
+    "node_modules/@tanstack/react-query": {
+      "version": "5.66.8",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.66.8.tgz",
+      "integrity": "sha512-LqYHYArmM7ycyT1I/Txc/n6KzI8S/hBFw2SQ9Uj1GpbZ89AvZLEvetquiQEHkZ5rFEm+iVNpZ6zYjTiPmJ9N5Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/query-core": "5.66.4"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "react": "^18 || ^19"
+      }
+    },
     "node_modules/@testing-library/jest-dom": {
       "version": "6.6.3",
       "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.6.3.tgz",
@@ -2049,6 +2341,20 @@
       "version": "7.0.15",
       "license": "MIT"
     },
+    "node_modules/@types/lodash": {
+      "version": "4.17.15",
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.15.tgz",
+      "integrity": "sha512-w/P33JFeySuhN6JLkysYUK2gEmy9kHHFN7E8ro0tkfmlDOgxBDzWEZ/J8cWA+fHqFevpswDTFZnDx+R9lbL6xw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/md5": {
+      "version": "2.3.5",
+      "resolved": "https://registry.npmjs.org/@types/md5/-/md5-2.3.5.tgz",
+      "integrity": "sha512-/i42wjYNgE6wf0j2bcTX6kuowmdL/6PE4IVitMpm2eYKBUuYCprdcWVK+xEF0gcV6ufMCRhtxmReGfc6hIK7Jw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/node": {
       "version": "22.13.4",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-22.13.4.tgz",
@@ -2059,6 +2365,13 @@
         "undici-types": "~6.20.0"
       }
     },
+    "node_modules/@types/pluralize": {
+      "version": "0.0.29",
+      "resolved": "https://registry.npmjs.org/@types/pluralize/-/pluralize-0.0.29.tgz",
+      "integrity": "sha512-BYOID+l2Aco2nBik+iYS4SZX0Lf20KPILP5RGmM1IgzdwNdTs0eebiFriOPcej1sX9mLnSoiNte5zcFxssgpGA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/react": {
       "version": "19.0.10",
       "devOptional": true,
@@ -2075,6 +2388,27 @@
         "@types/react": "^19.0.0"
       }
     },
+    "node_modules/@types/statuses": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@types/statuses/-/statuses-2.0.5.tgz",
+      "integrity": "sha512-jmIUGWrAiwu3dZpxntxieC+1n/5c3mjrImkmOSQ2NC5uP6cYO4aAZDdSmRcI5C1oiTmqlZGHC+/NmJrKogbP5A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/tough-cookie": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.5.tgz",
+      "integrity": "sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/uuid": {
+      "version": "8.3.4",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-8.3.4.tgz",
+      "integrity": "sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@typescript-eslint/eslint-plugin": {
       "version": "8.24.1",
       "dev": true,
@@ -2477,6 +2811,35 @@
         "url": "https://github.com/sponsors/epoberezkin"
       }
     },
+    "node_modules/ansi-escapes": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
+      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "type-fest": "^0.21.3"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ansi-escapes/node_modules/type-fest": {
+      "version": "0.21.3",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
+      "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/ansi-regex": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
@@ -2867,6 +3230,16 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/charenc": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
+      "integrity": "sha512-yrLQ/yVUFXkzg7EDQsPieE/53+0RlaWTs+wBrvW36cyilJ2SaDWfl4Yj7MtLTXleV9uEKefbAGUPv2/iWSooRA==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/check-error": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/check-error/-/check-error-2.1.1.tgz",
@@ -2889,6 +3262,94 @@
         "url": "https://polar.sh/cva"
       }
     },
+    "node_modules/cli-width": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-4.1.0.tgz",
+      "integrity": "sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/cliui/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cliui/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/clsx": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
@@ -2955,6 +3416,16 @@
         "node": ">= 8"
       }
     },
+    "node_modules/crypt": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
+      "integrity": "sha512-mCxBlsHFYh9C+HVpiEacem8FEBnMXgU9gy4zmNC+SXAZNB/1idgp/aulFJ4FgCi7GPEVbfyng092GqL2k2rmow==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/css.escape": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
@@ -3166,6 +3637,23 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/date-fns": {
+      "version": "2.30.0",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz",
+      "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.21.0"
+      },
+      "engines": {
+        "node": ">=0.11"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/date-fns"
+      }
+    },
     "node_modules/debug": {
       "version": "4.4.0",
       "license": "MIT",
@@ -3993,6 +4481,16 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
     "node_modules/get-intrinsic": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.7.tgz",
@@ -4163,6 +4661,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/graphql": {
+      "version": "16.10.0",
+      "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.10.0.tgz",
+      "integrity": "sha512-AjqGKbDGUFRKIRCP9tCKiIGHyriz2oHEbPIbEtcSLSs4YjReZOIPQQWek4+6hjw62H9QShXHyaGivGiYVLeYFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0"
+      }
+    },
     "node_modules/has-bigints": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz",
@@ -4248,6 +4756,13 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/headers-polyfill": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/headers-polyfill/-/headers-polyfill-4.0.3.tgz",
+      "integrity": "sha512-IScLbePpkvO846sIwOtOTDjutRMWdXdJmXdMvk6gCBHxFO8d+QKOQedyZSxFTTFYRSmlgSTDtXqqq4pcenBXLQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/html-encoding-sniffer": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
@@ -4437,6 +4952,13 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-buffer": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+      "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/is-callable": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
@@ -4569,6 +5091,13 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-node-process": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/is-node-process/-/is-node-process-1.2.0.tgz",
+      "integrity": "sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/is-number": {
       "version": "7.0.0",
       "dev": true,
@@ -5311,6 +5840,18 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/md5": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/md5/-/md5-2.3.0.tgz",
+      "integrity": "sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "charenc": "0.0.2",
+        "crypt": "0.0.2",
+        "is-buffer": "~1.1.6"
+      }
+    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "dev": true,
@@ -5388,6 +5929,61 @@
       "version": "2.1.3",
       "license": "MIT"
     },
+    "node_modules/msw": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/msw/-/msw-2.7.0.tgz",
+      "integrity": "sha512-BIodwZ19RWfCbYTxWTUfTXc+sg4OwjCAgxU1ZsgmggX/7S3LdUifsbUPJs61j0rWb19CZRGY5if77duhc0uXzw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "dependencies": {
+        "@bundled-es-modules/cookie": "^2.0.1",
+        "@bundled-es-modules/statuses": "^1.0.1",
+        "@bundled-es-modules/tough-cookie": "^0.1.6",
+        "@inquirer/confirm": "^5.0.0",
+        "@mswjs/interceptors": "^0.37.0",
+        "@open-draft/deferred-promise": "^2.2.0",
+        "@open-draft/until": "^2.1.0",
+        "@types/cookie": "^0.6.0",
+        "@types/statuses": "^2.0.4",
+        "graphql": "^16.8.1",
+        "headers-polyfill": "^4.0.2",
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.3",
+        "path-to-regexp": "^6.3.0",
+        "picocolors": "^1.1.1",
+        "strict-event-emitter": "^0.5.1",
+        "type-fest": "^4.26.1",
+        "yargs": "^17.7.2"
+      },
+      "bin": {
+        "msw": "cli/index.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mswjs"
+      },
+      "peerDependencies": {
+        "typescript": ">= 4.8.x"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/mute-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-2.0.0.tgz",
+      "integrity": "sha512-WWdIxpyjEn+FhQJQQv9aQAYlHoNVdzIzUySNV1gHUPDSdZJ3yZn7pAAbQcV7B56Mvu881q9FZV+0Vx2xC44VWA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
     "node_modules/nanoid": {
       "version": "3.3.8",
       "funding": [
@@ -5535,6 +6131,13 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/outvariant": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/outvariant/-/outvariant-1.4.3.tgz",
+      "integrity": "sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/own-keys": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
@@ -5652,6 +6255,13 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/path-to-regexp": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.3.0.tgz",
+      "integrity": "sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/pathe": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
@@ -5684,6 +6294,16 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pluralize": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/pluralize/-/pluralize-8.0.0.tgz",
+      "integrity": "sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/possible-typed-array-names": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
@@ -5737,6 +6357,19 @@
         "react-is": "^16.13.1"
       }
     },
+    "node_modules/psl": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/psl/-/psl-1.15.0.tgz",
+      "integrity": "sha512-JZd3gMVBAVQkSs6HdNZo9Sdo0LNcQeMNP3CozBJb3JYC/QUYZTnKxP+f8oWRX4rHP5EurWxqAHTSwUCjlNKa1w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/lupomontero"
+      }
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "license": "MIT",
@@ -5744,6 +6377,13 @@
         "node": ">=6"
       }
     },
+    "node_modules/querystringify": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
+      "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/queue-microtask": {
       "version": "1.2.3",
       "dev": true,
@@ -6018,6 +6658,23 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/requires-port": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/resolve": {
       "version": "2.0.0-next.5",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.5.tgz",
@@ -6374,6 +7031,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/statuses": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz",
+      "integrity": "sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/std-env": {
       "version": "3.8.0",
       "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.8.0.tgz",
@@ -6381,6 +7048,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/strict-event-emitter": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/strict-event-emitter/-/strict-event-emitter-0.5.1.tgz",
+      "integrity": "sha512-vMgjE/GGEPEFnhFub6pa4FmJBRBVOLpIII2hvCZ8Kzb7K0hlHo7mQv6xYrBvCL2LtAIBwFUK8wvuJgTVSQ5MFQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/string-width": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
@@ -6845,6 +7519,19 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/type-fest": {
+      "version": "4.35.0",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.35.0.tgz",
+      "integrity": "sha512-2/AwEFQDFEy30iOLjrvHDIH7e4HEWH+f1Yl1bI5XMqzuoCUqwYCdxachgsgv0og/JdVZUhbfjcJAoHj5L1753A==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/typed-array-buffer": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
@@ -6977,6 +7664,16 @@
       "devOptional": true,
       "license": "MIT"
     },
+    "node_modules/universalify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
+      "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4.0.0"
+      }
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.1.2",
       "dev": true,
@@ -7013,6 +7710,17 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/url-parse": {
+      "version": "1.5.10",
+      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
+      "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "querystringify": "^2.1.1",
+        "requires-port": "^1.0.0"
+      }
+    },
     "node_modules/use-callback-ref": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.3.3.tgz",
@@ -7056,6 +7764,16 @@
         }
       }
     },
+    "node_modules/uuid": {
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/vaul": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vaul/-/vaul-1.1.2.tgz",
@@ -7568,11 +8286,95 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/yallist": {
       "version": "3.1.1",
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/yargs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
       "license": "MIT",
@@ -7582,6 +8384,19 @@
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
+    },
+    "node_modules/yoctocolors-cjs": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/yoctocolors-cjs/-/yoctocolors-cjs-2.1.2.tgz",
+      "integrity": "sha512-cYVsTjKl8b+FrnidjibDWskAv7UKOfcwaVZdp/it9n1s9fU3IkgDbhdIRKCW4JDsAlECJY0ytoVPT3sK6kideA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index 299d30c..ec6ac0e 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "@radix-ui/react-toggle": "^1.1.2",
     "@radix-ui/react-tooltip": "^1.1.8",
     "@tailwindcss/vite": "^4.0.7",
+    "@tanstack/react-query": "^5.66.8",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "eslint-plugin-react": "^7.37.4",
@@ -40,6 +41,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.19.0",
+    "@mswjs/data": "^0.16.2",
     "@testing-library/jest-dom": "^6.6.3",
     "@types/node": "^22.13.4",
     "@types/react": "^19.0.8",
@@ -51,9 +53,15 @@
     "eslint-plugin-react-refresh": "^0.4.18",
     "globals": "^15.14.0",
     "jsdom": "^26.0.0",
+    "msw": "^2.7.0",
     "typescript": "~5.7.2",
     "typescript-eslint": "^8.22.0",
     "vite": "^6.1.0",
     "vitest": "^3.0.6"
+  },
+  "msw": {
+    "workerDirectory": [
+      "public"
+    ]
   }
 }
diff --git a/public/mockServiceWorker.js b/public/mockServiceWorker.js
new file mode 100644
index 0000000..ec47a9a
--- /dev/null
+++ b/public/mockServiceWorker.js
@@ -0,0 +1,307 @@
+/* eslint-disable */
+/* tslint:disable */
+
+/**
+ * Mock Service Worker.
+ * @see https://github.com/mswjs/msw
+ * - Please do NOT modify this file.
+ * - Please do NOT serve this file on production.
+ */
+
+const PACKAGE_VERSION = '2.7.0'
+const INTEGRITY_CHECKSUM = '00729d72e3b82faf54ca8b9621dbb96f'
+const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
+const activeClientIds = new Set()
+
+self.addEventListener('install', function () {
+  self.skipWaiting()
+})
+
+self.addEventListener('activate', function (event) {
+  event.waitUntil(self.clients.claim())
+})
+
+self.addEventListener('message', async function (event) {
+  const clientId = event.source.id
+
+  if (!clientId || !self.clients) {
+    return
+  }
+
+  const client = await self.clients.get(clientId)
+
+  if (!client) {
+    return
+  }
+
+  const allClients = await self.clients.matchAll({
+    type: 'window',
+  })
+
+  switch (event.data) {
+    case 'KEEPALIVE_REQUEST': {
+      sendToClient(client, {
+        type: 'KEEPALIVE_RESPONSE',
+      })
+      break
+    }
+
+    case 'INTEGRITY_CHECK_REQUEST': {
+      sendToClient(client, {
+        type: 'INTEGRITY_CHECK_RESPONSE',
+        payload: {
+          packageVersion: PACKAGE_VERSION,
+          checksum: INTEGRITY_CHECKSUM,
+        },
+      })
+      break
+    }
+
+    case 'MOCK_ACTIVATE': {
+      activeClientIds.add(clientId)
+
+      sendToClient(client, {
+        type: 'MOCKING_ENABLED',
+        payload: {
+          client: {
+            id: client.id,
+            frameType: client.frameType,
+          },
+        },
+      })
+      break
+    }
+
+    case 'MOCK_DEACTIVATE': {
+      activeClientIds.delete(clientId)
+      break
+    }
+
+    case 'CLIENT_CLOSED': {
+      activeClientIds.delete(clientId)
+
+      const remainingClients = allClients.filter((client) => {
+        return client.id !== clientId
+      })
+
+      // Unregister itself when there are no more clients
+      if (remainingClients.length === 0) {
+        self.registration.unregister()
+      }
+
+      break
+    }
+  }
+})
+
+self.addEventListener('fetch', function (event) {
+  const { request } = event
+
+  // Bypass navigation requests.
+  if (request.mode === 'navigate') {
+    return
+  }
+
+  // Opening the DevTools triggers the "only-if-cached" request
+  // that cannot be handled by the worker. Bypass such requests.
+  if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') {
+    return
+  }
+
+  // Bypass all requests when there are no active clients.
+  // Prevents the self-unregistered worked from handling requests
+  // after it's been deleted (still remains active until the next reload).
+  if (activeClientIds.size === 0) {
+    return
+  }
+
+  // Generate unique request ID.
+  const requestId = crypto.randomUUID()
+  event.respondWith(handleRequest(event, requestId))
+})
+
+async function handleRequest(event, requestId) {
+  const client = await resolveMainClient(event)
+  const response = await getResponse(event, client, requestId)
+
+  // Send back the response clone for the "response:*" life-cycle events.
+  // Ensure MSW is active and ready to handle the message, otherwise
+  // this message will pend indefinitely.
+  if (client && activeClientIds.has(client.id)) {
+    ;(async function () {
+      const responseClone = response.clone()
+
+      sendToClient(
+        client,
+        {
+          type: 'RESPONSE',
+          payload: {
+            requestId,
+            isMockedResponse: IS_MOCKED_RESPONSE in response,
+            type: responseClone.type,
+            status: responseClone.status,
+            statusText: responseClone.statusText,
+            body: responseClone.body,
+            headers: Object.fromEntries(responseClone.headers.entries()),
+          },
+        },
+        [responseClone.body],
+      )
+    })()
+  }
+
+  return response
+}
+
+// Resolve the main client for the given event.
+// Client that issues a request doesn't necessarily equal the client
+// that registered the worker. It's with the latter the worker should
+// communicate with during the response resolving phase.
+async function resolveMainClient(event) {
+  const client = await self.clients.get(event.clientId)
+
+  if (activeClientIds.has(event.clientId)) {
+    return client
+  }
+
+  if (client?.frameType === 'top-level') {
+    return client
+  }
+
+  const allClients = await self.clients.matchAll({
+    type: 'window',
+  })
+
+  return allClients
+    .filter((client) => {
+      // Get only those clients that are currently visible.
+      return client.visibilityState === 'visible'
+    })
+    .find((client) => {
+      // Find the client ID that's recorded in the
+      // set of clients that have registered the worker.
+      return activeClientIds.has(client.id)
+    })
+}
+
+async function getResponse(event, client, requestId) {
+  const { request } = event
+
+  // Clone the request because it might've been already used
+  // (i.e. its body has been read and sent to the client).
+  const requestClone = request.clone()
+
+  function passthrough() {
+    // Cast the request headers to a new Headers instance
+    // so the headers can be manipulated with.
+    const headers = new Headers(requestClone.headers)
+
+    // Remove the "accept" header value that marked this request as passthrough.
+    // This prevents request alteration and also keeps it compliant with the
+    // user-defined CORS policies.
+    const acceptHeader = headers.get('accept')
+    if (acceptHeader) {
+      const values = acceptHeader.split(',').map((value) => value.trim())
+      const filteredValues = values.filter(
+        (value) => value !== 'msw/passthrough',
+      )
+
+      if (filteredValues.length > 0) {
+        headers.set('accept', filteredValues.join(', '))
+      } else {
+        headers.delete('accept')
+      }
+    }
+
+    return fetch(requestClone, { headers })
+  }
+
+  // Bypass mocking when the client is not active.
+  if (!client) {
+    return passthrough()
+  }
+
+  // Bypass initial page load requests (i.e. static assets).
+  // The absence of the immediate/parent client in the map of the active clients
+  // means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet
+  // and is not ready to handle requests.
+  if (!activeClientIds.has(client.id)) {
+    return passthrough()
+  }
+
+  // Notify the client that a request has been intercepted.
+  const requestBuffer = await request.arrayBuffer()
+  const clientMessage = await sendToClient(
+    client,
+    {
+      type: 'REQUEST',
+      payload: {
+        id: requestId,
+        url: request.url,
+        mode: request.mode,
+        method: request.method,
+        headers: Object.fromEntries(request.headers.entries()),
+        cache: request.cache,
+        credentials: request.credentials,
+        destination: request.destination,
+        integrity: request.integrity,
+        redirect: request.redirect,
+        referrer: request.referrer,
+        referrerPolicy: request.referrerPolicy,
+        body: requestBuffer,
+        keepalive: request.keepalive,
+      },
+    },
+    [requestBuffer],
+  )
+
+  switch (clientMessage.type) {
+    case 'MOCK_RESPONSE': {
+      return respondWithMock(clientMessage.data)
+    }
+
+    case 'PASSTHROUGH': {
+      return passthrough()
+    }
+  }
+
+  return passthrough()
+}
+
+function sendToClient(client, message, transferrables = []) {
+  return new Promise((resolve, reject) => {
+    const channel = new MessageChannel()
+
+    channel.port1.onmessage = (event) => {
+      if (event.data && event.data.error) {
+        return reject(event.data.error)
+      }
+
+      resolve(event.data)
+    }
+
+    client.postMessage(
+      message,
+      [channel.port2].concat(transferrables.filter(Boolean)),
+    )
+  })
+}
+
+async function respondWithMock(response) {
+  // Setting response status code to 0 is a no-op.
+  // However, when responding with a "Response.error()", the produced Response
+  // instance will have status code set to 0. Since it's not possible to create
+  // a Response instance with status code 0, handle that use-case separately.
+  if (response.status === 0) {
+    return Response.error()
+  }
+
+  const mockedResponse = new Response(response.body, response)
+
+  Reflect.defineProperty(mockedResponse, IS_MOCKED_RESPONSE, {
+    value: true,
+    enumerable: true,
+  })
+
+  return mockedResponse
+}
diff --git a/src/components/AppSidebar.tsx b/src/components/AppSidebar.tsx
index 1151995..62b1984 100644
--- a/src/components/AppSidebar.tsx
+++ b/src/components/AppSidebar.tsx
@@ -1,4 +1,4 @@
-import { Bitcoin, Home, Inbox, Settings } from "lucide-react"
+import { Bitcoin, Home, Inbox, Settings, InfoIcon } from "lucide-react"
 import { NavLink } from "react-router";
 
 import {
@@ -34,6 +34,11 @@ const items = [
     url: "/settings",
     icon: Settings,
   },
+  {
+    title: "Info",
+    url: "/info",
+    icon: InfoIcon,
+  },
 ]
 
 export function AppSidebar() {
diff --git a/src/components/H2.tsx b/src/components/Headings.tsx
similarity index 55%
rename from src/components/H2.tsx
rename to src/components/Headings.tsx
index 9b1a8d3..eed32ea 100644
--- a/src/components/H2.tsx
+++ b/src/components/Headings.tsx
@@ -7,3 +7,11 @@ export function H2({ children }: PropsWithChildren<unknown>) {
     </h2>
   )
 }
+
+export function H3({ children }: PropsWithChildren<unknown>) {
+  return (
+    <h3 className="scroll-m-20 text-3xl font-extrabold tracking-tight lg:text-4xl">
+      {children}
+    </h3>
+  )
+}
diff --git a/src/components/PageTitle.tsx b/src/components/PageTitle.tsx
index a5e74de..d43c93c 100644
--- a/src/components/PageTitle.tsx
+++ b/src/components/PageTitle.tsx
@@ -1,5 +1,5 @@
 import { PropsWithChildren } from "react";
-import { H2 } from "./H2";
+import { H2 } from "./Headings";
 
 export function PageTitle({ children }: PropsWithChildren<unknown>) {
   return (
diff --git a/src/constants/api.ts b/src/constants/api.ts
new file mode 100644
index 0000000..d6d95e1
--- /dev/null
+++ b/src/constants/api.ts
@@ -0,0 +1,3 @@
+import meta from "@/constants/meta";
+
+export const API_URL = meta.apiBaseUrl;
diff --git a/src/constants/endpoints.ts b/src/constants/endpoints.ts
new file mode 100644
index 0000000..1ee955e
--- /dev/null
+++ b/src/constants/endpoints.ts
@@ -0,0 +1,20 @@
+const INFO = "/v1/info"
+const BALANCES = "/v1/balances"
+
+const ADMIN_QUOTE_PENDING = "/v1/admin/credit/quote/pending"
+const ADMIN_QUOTE_ACCEPTED = "/v1/admin/credit/quote/accepted"
+const ADMIN_QUOTE_BY_ID = "/v1/admin/credit/quote/:id"
+
+const CREDIT_QUOTE = "/v1/credit/mint/quote"
+const CREDIT_QUOTES_BY_ID = "/v1/credit/mint/quote/:id"
+
+export {
+  INFO,
+  BALANCES,
+
+  ADMIN_QUOTE_PENDING,
+  ADMIN_QUOTE_ACCEPTED,
+  ADMIN_QUOTE_BY_ID,
+  CREDIT_QUOTE,
+  CREDIT_QUOTES_BY_ID,
+}
diff --git a/src/constants/meta.ts b/src/constants/meta.ts
new file mode 100644
index 0000000..0a6de4c
--- /dev/null
+++ b/src/constants/meta.ts
@@ -0,0 +1,7 @@
+
+export default {
+  devModeEnabled: import.meta.env.DEV,
+  apiBaseUrl: import.meta.env.VITE_API_BASE_URL as string,
+  apiMocksEnabled: import.meta.env.VITE_API_MOCKING_ENABLED === "true",
+  crowdinInContextToolingEnabled: import.meta.env.VITE_BITCR_DEV_INCLUDE_CROWDIN_IN_CONTEXT_TOOLING === "true"
+}
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
new file mode 100644
index 0000000..b9203c7
--- /dev/null
+++ b/src/constants/routes.ts
@@ -0,0 +1,9 @@
+const ROOT = "/"
+const HOME = "/"
+const BALANCES = "/balances"
+
+export default {
+  ROOT,
+  HOME,
+  BALANCES,
+}
diff --git a/src/lib/api.ts b/src/lib/api.ts
new file mode 100644
index 0000000..76976f1
--- /dev/null
+++ b/src/lib/api.ts
@@ -0,0 +1,80 @@
+import { ADMIN_QUOTE_ACCEPTED, ADMIN_QUOTE_BY_ID, ADMIN_QUOTE_PENDING, INFO } from "@/constants/endpoints";
+import { apiFetch } from "@/utils/api";
+
+export interface InfoResponse {
+  name?: string
+  pubkey?: string
+  version?: string
+  description?: string
+  description_long?: string
+  contact?: {
+    method?: string
+    info?: string
+  }[],
+  motd?: string
+  icon_url?: string
+  urls?: string[],
+  time?: number,
+  nuts?: Record<string, {
+      methods?: Record<string, unknown>[],
+      disabled?: boolean
+      supported?: boolean
+  }>
+}
+
+export async function fetchInfo(): Promise<InfoResponse> {
+  return apiFetch<InfoResponse>(INFO, {
+    headers: {
+      "Content-Type": "application/json",
+    },
+  })
+}
+
+
+interface QuotePending {
+  id: string
+  bill: string
+  endorser: string
+  submitted: number
+  suggested_expiration: number
+}
+interface QuoteAccepted {
+  id: string
+  bill: string
+  endorser: string
+  ttl: number
+  signatures: unknown[]
+}
+interface QuoteDeclined {
+  id: string
+  bill: string
+  endorser: string
+}
+
+export type QuoteInfoReply = QuotePending | QuoteAccepted | QuoteDeclined
+
+export interface QuoteListResponse {
+  quotes: string[]
+}
+
+export async function fetchAdminQuoteById(id: string): Promise<QuoteInfoReply> {
+  return apiFetch<QuoteInfoReply>(ADMIN_QUOTE_BY_ID.replace(":id", id), {
+    headers: {
+      "Content-Type": "application/json",
+    },
+  })
+}
+export async function fetchAdminQuotePending(): Promise<QuoteListResponse> {
+  return apiFetch<QuoteListResponse>(ADMIN_QUOTE_PENDING, {
+    headers: {
+      "Content-Type": "application/json",
+    },
+  })
+}
+export async function fetchAdminQuoteAccepted(): Promise<QuoteListResponse> {
+  return apiFetch<QuoteListResponse>(ADMIN_QUOTE_ACCEPTED, {
+    headers: {
+      "Content-Type": "application/json",
+    },
+  })
+}
diff --git a/src/main.tsx b/src/main.tsx
index 7eedeed..c714ec3 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -7,19 +7,35 @@ import HomePage from './pages/home/HomePage'
 import BalancesPage from './pages/balances/BalancesPage'
 import QuotesPage from './pages/quotes/QuotesPage';
 import SettingsPage from './pages/settings/SettingsPage';
+import meta from './constants/meta';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import InfoPage from './pages/info/InfoPage';
 
-createRoot(document.getElementById('root')!).render(
-  <StrictMode>
-    <BrowserRouter>
-      <Routes>
-        <Route  element={<Layout />}>
-          <Route index element={<HomePage />} />
-          <Route path="balances" element={<BalancesPage />} />
-          <Route path="quotes" element={<QuotesPage />} />
-          <Route path="settings" element={<SettingsPage />} />
-        </Route>
-      </Routes>
-    </BrowserRouter>
-  </StrictMode>,
+const queryClient = new QueryClient();
 
-)
+const prepare = async () => {
+  if (meta.apiMocksEnabled) {
+    const { worker } = await import("./mocks/browser")
+    await worker.start()
+  }
+}
+
+void prepare().then(() => {
+  createRoot(document.getElementById('root')!).render(
+    <StrictMode>
+      <QueryClientProvider client={queryClient}>
+        <BrowserRouter>
+          <Routes>
+            <Route  element={<Layout />}>
+              <Route index element={<HomePage />} />
+              <Route path="balances" element={<BalancesPage />} />
+              <Route path="quotes" element={<QuotesPage />} />
+              <Route path="settings" element={<SettingsPage />} />
+              <Route path="info" element={<InfoPage />} />
+            </Route>
+          </Routes>
+        </BrowserRouter>
+      </QueryClientProvider>
+    </StrictMode>,
+  )
+})
diff --git a/src/mocks/browser.ts b/src/mocks/browser.ts
new file mode 100644
index 0000000..98e7b57
--- /dev/null
+++ b/src/mocks/browser.ts
@@ -0,0 +1,11 @@
+import { setupWorker } from "msw/browser";
+import { handlers } from "./handlers";
+import { scenarios } from "./scenarios";
+
+const scenarioName = new URLSearchParams(window.location.search).get(
+  "scenario"
+) as unknown as keyof typeof scenarios;
+
+const runtimeScenarios = scenarios[scenarioName] || [];
+
+export const worker = setupWorker(...runtimeScenarios, ...handlers);
diff --git a/src/mocks/db.ts b/src/mocks/db.ts
new file mode 100644
index 0000000..c31bffc
--- /dev/null
+++ b/src/mocks/db.ts
@@ -0,0 +1,16 @@
+import { factory, nullable, primaryKey } from "@mswjs/data";
+
+export const db = factory({
+  info: {
+    id: primaryKey(String),
+    name: nullable(String),
+    pubkey: nullable(String),
+    version: nullable(String),
+  },
+})
+
+db.info.create({
+  "name": "Bob's Wildcat mint",
+  "pubkey": "0283bf290884eed3a7ca2663fc0260de2e2064d6b355ea13f98dec004b7a7ead99",
+  "version": "Nutshell/0.15.0",
+})
diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts
new file mode 100644
index 0000000..536850f
--- /dev/null
+++ b/src/mocks/handlers.ts
@@ -0,0 +1,7 @@
+import { fetchAdminQuotePending } from "./handlers/admin_quotes"
+import { fetchInfo } from "./handlers/info"
+
+export const handlers = [
+  fetchInfo,
+  fetchAdminQuotePending
+]
diff --git a/src/mocks/handlers/admin_quotes.ts b/src/mocks/handlers/admin_quotes.ts
new file mode 100644
index 0000000..1118ef5
--- /dev/null
+++ b/src/mocks/handlers/admin_quotes.ts
@@ -0,0 +1,21 @@
+import { http, delay, HttpResponse } from "msw"
+import { API_URL } from "@/constants/api"
+import type { QuoteListResponse } from "@/lib/api"
+import { ADMIN_QUOTE_PENDING } from "@/constants/endpoints"
+
+export const fetchAdminQuotePending = http.get<never, never, QuoteListResponse>(`${API_URL}${ADMIN_QUOTE_PENDING}`, async () => {
+  await delay(1000)
+
+  return HttpResponse.json({
+    quotes: [
+      "63777d15-ce53-4cca-94bf-7726c7930aab",
+      "cd3fc93c-4507-4154-b51b-215b6f360a53",
+      "d20ab61f-03c5-479f-930b-b6aca608b1e6",
+      "57330ad9-30b1-45a7-b900-a37be37005d3",
+      "62ea00be-66f2-4b04-b2c4-257d7409ce9f",
+      "597d3d44-4a65-4c87-8d50-628acda245f5",
+      "0e96e7cc-4327-41c6-87bf-8096fd880117",
+      "2f5bc589-9bca-4899-adbf-76c881a4e418"
+    ]
+  })
+})
diff --git a/src/mocks/handlers/info.ts b/src/mocks/handlers/info.ts
new file mode 100644
index 0000000..55ec966
--- /dev/null
+++ b/src/mocks/handlers/info.ts
@@ -0,0 +1,76 @@
+import { http, delay, HttpResponse } from "msw"
+import { API_URL } from "@/constants/api"
+import type { InfoResponse } from "@/lib/api"
+import { INFO } from "@/constants/endpoints"
+
+export const fetchInfo = http.get<never, never, InfoResponse>(`${API_URL}${INFO}`, async () => {
+  await delay(1_000)
+
+  return HttpResponse.json({
+    "name": "Bob's Wildcat mint",
+    "pubkey": "0283bf290884eed3a7ca2663fc0260de2e2064d6b355ea13f98dec004b7a7ead99",
+    "version": "Nutshell/0.15.0",
+    "description": "The short mint description",
+    "description_long": "A description that can be a long piece of text.",
+    "contact": [
+      {
+        "method": "email",
+        "info": "contact@me.com"
+      },
+      {
+        "method": "twitter",
+        "info": "@me"
+      },
+      {
+        "method": "nostr",
+        "info": "npub..."
+      }
+    ],
+    "motd": "Message to display to users.",
+    "icon_url": "https://mint.host/icon.jpg",
+    "urls": [
+      "https://mint.host",
+      "http://mint8gv0sq5ul602uxt2fe0t80e3c2bi9fy0cxedp69v1vat6ruj81wv.onion"
+    ],
+    "time": 1725304480,
+    "nuts": {
+      "4": {
+        "methods": [
+          {
+            "method": "bolt11",
+            "unit": "sat",
+            "min_amount": 0,
+            "max_amount": 10000
+          }
+        ],
+        "disabled": false
+      },
+      "5": {
+        "methods": [
+          {
+            "method": "bolt11",
+            "unit": "sat",
+            "min_amount": 100,
+            "max_amount": 10000
+          }
+        ],
+        "disabled": false
+      },
+      "7": {
+        "supported": true
+      },
+      "8": {
+        "supported": true
+      },
+      "9": {
+        "supported": true
+      },
+      "10": {
+        "supported": true
+      },
+      "12": {
+        "supported": true
+      }
+    }
+  })
+})
diff --git a/src/mocks/handlers/utils.ts b/src/mocks/handlers/utils.ts
new file mode 100644
index 0000000..6c81cb1
--- /dev/null
+++ b/src/mocks/handlers/utils.ts
@@ -0,0 +1,15 @@
+export const matchesSearchTerm = (it: Record<string, unknown>, search_term: string | undefined) => {
+  return !search_term ? true : Object.entries(it).some(([, value]) => {
+    if (value !== null && typeof value === "object") {
+      return Object.values(value).some(
+        (innerValue) =>
+          typeof innerValue === "string" &&
+          innerValue.toLowerCase().includes(search_term.toLowerCase())
+      );
+    }
+    return (
+      typeof value === "string" &&
+      value.toLowerCase().includes(search_term.toLowerCase())
+    );
+  });
+};
diff --git a/src/mocks/scenarios.ts b/src/mocks/scenarios.ts
new file mode 100644
index 0000000..14595c2
--- /dev/null
+++ b/src/mocks/scenarios.ts
@@ -0,0 +1,4 @@
+
+export const scenarios = {
+  empty: [],
+}
diff --git a/src/pages/home/HomePage.tsx b/src/pages/home/HomePage.tsx
index fb5e74a..03b34be 100644
--- a/src/pages/home/HomePage.tsx
+++ b/src/pages/home/HomePage.tsx
@@ -1,9 +1,42 @@
 import { PageTitle } from "@/components/PageTitle";
+import { Skeleton } from "@/components/ui/skeleton";
+import { fetchInfo } from "@/lib/api";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { Suspense } from "react";
+
+
+function Loader() {
+  return (
+    <div className="flex flex-col gap-1.5 py-2">
+      <Skeleton className="h-12 rounded-lg" />
+    </div>
+  )
+}
+
+function PageBody() {
+  const { data } = useSuspenseQuery({
+    queryKey: ["info"],
+    queryFn: fetchInfo,
+  });
+
+  return (
+    <>
+      <div className="flex flex-col gap-0.5 bg-accent text-accent-foreground rounded-lg p-2 my-2">
+        <span className="font-bold">{data.name}</span>
+        <span className="text-sm font-mono text-accent-foreground/50">{data.version}</span>
+        <span className="text-sm font-mono">{data.pubkey}</span>
+      </div>
+    </>
+  )
+}
 
 export default function HomePage() {
   return (
     <>
       <PageTitle>Home</PageTitle>
+      <Suspense fallback={<Loader />}>
+        <PageBody />
+      </Suspense>
     </>
   )
 }
diff --git a/src/pages/info/InfoPage.tsx b/src/pages/info/InfoPage.tsx
new file mode 100644
index 0000000..5cc889e
--- /dev/null
+++ b/src/pages/info/InfoPage.tsx
@@ -0,0 +1,42 @@
+import { Breadcrumbs } from "@/components/Breadcrumbs";
+import { PageTitle } from "@/components/PageTitle";
+import { Skeleton } from "@/components/ui/skeleton";
+import { fetchInfo } from "@/lib/api";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { Suspense } from "react";
+
+function Loader() {
+  return (
+    <div className="flex flex-col gap-1.5 py-2">
+      <Skeleton className="h-48 rounded-lg" />
+    </div>
+  )
+}
+
+function PageBody() {
+  const { data } = useSuspenseQuery({
+    queryKey: ["info"],
+    queryFn: fetchInfo,
+  });
+
+  return (
+    <>
+      <pre className="text-sm bg-accent text-accent-foreground rounded-lg p-2 my-2">
+        {JSON.stringify(data, null, 2)}
+      </pre>
+    </>
+  )
+}
+
+export default function InfoPage() {
+  return (
+    <>
+      <Breadcrumbs>Info</Breadcrumbs>
+      <PageTitle>Info</PageTitle>
+      <Suspense fallback={<Loader />}>
+        <PageBody />
+      </Suspense>
+    </>
+  )
+}
+
diff --git a/src/pages/quotes/QuotesPage.tsx b/src/pages/quotes/QuotesPage.tsx
index 6d4f983..86b0068 100644
--- a/src/pages/quotes/QuotesPage.tsx
+++ b/src/pages/quotes/QuotesPage.tsx
@@ -1,11 +1,77 @@
 import { Breadcrumbs } from "@/components/Breadcrumbs";
+import { H3 } from "@/components/Headings";
 import { PageTitle } from "@/components/PageTitle";
+import { Button } from "@/components/ui/button";
+import { Skeleton } from "@/components/ui/skeleton";
+import { fetchAdminQuotePending } from "@/lib/api";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { ViewIcon } from "lucide-react";
+import { Suspense } from "react";
+
+
+function Loader() {
+  return (
+    <div className="flex flex-col gap-1.5 py-2">
+      <Skeleton className="h-48 rounded-lg" />
+    </div>
+  )
+}
+
+function QuoteListPendingRaw() {
+  const { data } = useSuspenseQuery({
+    queryKey: ["quotes-pending"],
+    queryFn: fetchAdminQuotePending,
+  });
+
+  return (
+    <>
+      <pre className="text-sm bg-accent text-accent-foreground rounded-lg p-2 my-2">
+        {JSON.stringify(data, null, 2)}
+      </pre>
+    </>
+  )
+}
+
+function QuoteListPending() {
+  const { data } = useSuspenseQuery({
+    queryKey: ["quotes-pending"],
+    queryFn: fetchAdminQuotePending,
+  });
+
+  return (
+    <>
+      <div className="flex flex-col gap-1">
+        {data.quotes.map((it, index) => {
+          return (<div key={index} className="flex gap-1 items-center text-sm">
+            <span>{it}</span>
+            <Button size="sm">
+              <ViewIcon />
+            </Button>
+          </div>)
+        })}
+      </div>
+    </>
+  )
+}
+
+function PageBody() {
+  return (
+    <>
+      <H3>Pending</H3>
+      <Suspense fallback={<Loader />}>
+        <QuoteListPending />
+        <QuoteListPendingRaw />
+      </Suspense>
+    </>
+  )
+}
 
 export default function QuotesPage() {
   return (
     <>
       <Breadcrumbs>Quotes</Breadcrumbs>
       <PageTitle>Quotes</PageTitle>
+      <PageBody />
     </>
   )
 }
diff --git a/src/utils/api.ts b/src/utils/api.ts
new file mode 100644
index 0000000..36aad2f
--- /dev/null
+++ b/src/utils/api.ts
@@ -0,0 +1,32 @@
+import { API_URL } from "@/constants/api";
+
+export const apiFetch = async <T = unknown>(
+  endpoint: string,
+  options: RequestInit = {}
+): Promise<T> => {
+  const url = `${API_URL}${endpoint}`;
+
+  const response = await fetch(url, {
+    ...options,
+    /* headers: {
+      "Content-Type": "application/json",
+      ...(options.headers || {}),
+    }, */
+    headers: options.headers ?? [],
+  });
+
+  if (!response.ok) {
+    throw new Error(`HTTP error! status: ${response.statusText}`);
+  }
+
+  const contentLength = response.headers.get("Content-Length");
+
+  if (
+    contentLength === "0" ||
+    response.headers.get("Content-Type")?.includes("application/json") === false
+  ) {
+    return {} as T;
+  }
+
+  return response.json() as Promise<T>;
+};