diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index d70f9e3..c6be8ab 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -18,6 +18,7 @@
                 "@radix-ui/react-separator": "^1.0.3",
                 "@radix-ui/react-slot": "^1.0.2",
                 "@strapi/blocks-react-renderer": "^1.0.0",
+                "add": "^2.0.6",
                 "chart.js": "^4.4.1",
                 "chartjs-adapter-luxon": "^1.3.1",
                 "class-variance-authority": "^0.7.0",
@@ -32,6 +33,7 @@
                 "ol": "^8.2.0",
                 "ol-ext": "^4.0.14",
                 "ol-mapbox-style": "^12.2.0",
+                "pagination": "^0.4.6",
                 "qs": "^6.11.2",
                 "react": "^18.2.0",
                 "react-dom": "^18.2.0",
@@ -39,6 +41,7 @@
                 "react-markdown": "^9.0.1",
                 "react-plotly.js": "^2.6.0",
                 "satellite.js": "^5.0.0",
+                "shadcn-ui": "^0.8.0",
                 "tailwind-merge": "^2.2.0",
                 "tailwindcss-animate": "^1.0.7",
                 "three": "^0.161.0",
@@ -96,7 +99,6 @@
             "version": "2.2.1",
             "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz",
             "integrity": "sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==",
-            "dev": true,
             "dependencies": {
                 "@jridgewell/gen-mapping": "^0.3.0",
                 "@jridgewell/trace-mapping": "^0.3.9"
@@ -105,6 +107,20 @@
                 "node": ">=6.0.0"
             }
         },
+        "node_modules/@antfu/ni": {
+            "version": "0.21.12",
+            "resolved": "https://registry.npmjs.org/@antfu/ni/-/ni-0.21.12.tgz",
+            "integrity": "sha512-2aDL3WUv8hMJb2L3r/PIQWsTLyq7RQr3v9xD16fiz6O8ys1xEyLhhTOv8gxtZvJiTzjTF5pHoArvRdesGL1DMQ==",
+            "bin": {
+                "na": "bin/na.mjs",
+                "nci": "bin/nci.mjs",
+                "ni": "bin/ni.mjs",
+                "nlx": "bin/nlx.mjs",
+                "nr": "bin/nr.mjs",
+                "nu": "bin/nu.mjs",
+                "nun": "bin/nun.mjs"
+            }
+        },
         "node_modules/@apollo/client": {
             "version": "3.9.0-alpha.5",
             "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.9.0-alpha.5.tgz",
@@ -367,7 +383,6 @@
             "version": "7.23.5",
             "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz",
             "integrity": "sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==",
-            "dev": true,
             "dependencies": {
                 "@babel/highlight": "^7.23.4",
                 "chalk": "^2.4.2"
@@ -380,7 +395,6 @@
             "version": "3.2.1",
             "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
             "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-            "dev": true,
             "dependencies": {
                 "color-convert": "^1.9.0"
             },
@@ -392,7 +406,6 @@
             "version": "2.4.2",
             "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
             "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-            "dev": true,
             "dependencies": {
                 "ansi-styles": "^3.2.1",
                 "escape-string-regexp": "^1.0.5",
@@ -406,7 +419,6 @@
             "version": "1.9.3",
             "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
             "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-            "dev": true,
             "dependencies": {
                 "color-name": "1.1.3"
             }
@@ -414,14 +426,12 @@
         "node_modules/@babel/code-frame/node_modules/color-name": {
             "version": "1.1.3",
             "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-            "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-            "dev": true
+            "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
         },
         "node_modules/@babel/code-frame/node_modules/escape-string-regexp": {
             "version": "1.0.5",
             "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
             "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-            "dev": true,
             "engines": {
                 "node": ">=0.8.0"
             }
@@ -430,7 +440,6 @@
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
             "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-            "dev": true,
             "engines": {
                 "node": ">=4"
             }
@@ -439,7 +448,6 @@
             "version": "5.5.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
             "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-            "dev": true,
             "dependencies": {
                 "has-flag": "^3.0.0"
             },
@@ -451,7 +459,6 @@
             "version": "7.23.5",
             "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.5.tgz",
             "integrity": "sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw==",
-            "dev": true,
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -460,7 +467,6 @@
             "version": "7.23.9",
             "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.9.tgz",
             "integrity": "sha512-5q0175NOjddqpvvzU+kDiSOAk4PfdO6FvwCWoQ6RO7rTzEe8vlo+4HVfcnAREhD4npMs0e9uZypjTwzZPCf/cw==",
-            "dev": true,
             "dependencies": {
                 "@ampproject/remapping": "^2.2.0",
                 "@babel/code-frame": "^7.23.5",
@@ -490,7 +496,6 @@
             "version": "2.2.3",
             "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
             "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
-            "dev": true,
             "bin": {
                 "json5": "lib/cli.js"
             },
@@ -502,7 +507,6 @@
             "version": "6.3.1",
             "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
             "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-            "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
             }
@@ -511,7 +515,6 @@
             "version": "7.23.6",
             "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.6.tgz",
             "integrity": "sha512-qrSfCYxYQB5owCmGLbl8XRpX1ytXlpueOb0N0UmQwA073KZxejgQTzAmJezxvpwQD9uGtK2shHdi55QT+MbjIw==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.23.6",
                 "@jridgewell/gen-mapping": "^0.3.2",
@@ -526,7 +529,6 @@
             "version": "7.22.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.22.5.tgz",
             "integrity": "sha512-LvBTxu8bQSQkcyKOU+a1btnNFQ1dMAd0R6PyW3arXes06F6QLWLIrd681bxRPIXlrMGR3XYnW9JyML7dP3qgxg==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.5"
             },
@@ -538,7 +540,6 @@
             "version": "7.23.6",
             "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.23.6.tgz",
             "integrity": "sha512-9JB548GZoQVmzrFgp8o7KxdgkTGm6xs9DW0o/Pim72UDjzr5ObUQ6ZzYPqA+g9OTS2bBQoctLJrky0RDCAWRgQ==",
-            "dev": true,
             "dependencies": {
                 "@babel/compat-data": "^7.23.5",
                 "@babel/helper-validator-option": "^7.23.5",
@@ -554,7 +555,6 @@
             "version": "5.1.1",
             "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
             "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-            "dev": true,
             "dependencies": {
                 "yallist": "^3.0.2"
             }
@@ -563,7 +563,6 @@
             "version": "6.3.1",
             "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
             "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-            "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
             }
@@ -571,21 +570,19 @@
         "node_modules/@babel/helper-compilation-targets/node_modules/yallist": {
             "version": "3.1.1",
             "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
-            "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
-            "dev": true
+            "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
         },
         "node_modules/@babel/helper-create-class-features-plugin": {
-            "version": "7.23.9",
-            "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.23.9.tgz",
-            "integrity": "sha512-B2L9neXTIyPQoXDm+NtovPvG6VOLWnaXu3BIeVDWwdKFgG30oNa6CqVGiJPDWQwIAK49t9gnQI9c6K6RzabiKw==",
-            "dev": true,
+            "version": "7.24.1",
+            "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.24.1.tgz",
+            "integrity": "sha512-1yJa9dX9g//V6fDebXoEfEsxkZHk3Hcbm+zLhyu6qVgYFLvmTALTeV+jNU9e5RnYtioBrGEOdoI2joMSNQ/+aA==",
             "dependencies": {
                 "@babel/helper-annotate-as-pure": "^7.22.5",
                 "@babel/helper-environment-visitor": "^7.22.20",
                 "@babel/helper-function-name": "^7.23.0",
                 "@babel/helper-member-expression-to-functions": "^7.23.0",
                 "@babel/helper-optimise-call-expression": "^7.22.5",
-                "@babel/helper-replace-supers": "^7.22.20",
+                "@babel/helper-replace-supers": "^7.24.1",
                 "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
                 "@babel/helper-split-export-declaration": "^7.22.6",
                 "semver": "^6.3.1"
@@ -601,7 +598,6 @@
             "version": "6.3.1",
             "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
             "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-            "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
             }
@@ -610,7 +606,6 @@
             "version": "7.22.20",
             "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz",
             "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==",
-            "dev": true,
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -619,7 +614,6 @@
             "version": "7.23.0",
             "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz",
             "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==",
-            "dev": true,
             "dependencies": {
                 "@babel/template": "^7.22.15",
                 "@babel/types": "^7.23.0"
@@ -632,7 +626,6 @@
             "version": "7.22.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz",
             "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.5"
             },
@@ -644,7 +637,6 @@
             "version": "7.23.0",
             "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.23.0.tgz",
             "integrity": "sha512-6gfrPwh7OuT6gZyJZvd6WbTfrqAo7vm4xCzAXOusKqq/vWdKXphTpj5klHKNmRUU6/QRGlBsyU9mAIPaWHlqJA==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.23.0"
             },
@@ -656,7 +648,6 @@
             "version": "7.22.15",
             "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz",
             "integrity": "sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.15"
             },
@@ -668,7 +659,6 @@
             "version": "7.23.3",
             "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz",
             "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==",
-            "dev": true,
             "dependencies": {
                 "@babel/helper-environment-visitor": "^7.22.20",
                 "@babel/helper-module-imports": "^7.22.15",
@@ -687,7 +677,6 @@
             "version": "7.22.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.22.5.tgz",
             "integrity": "sha512-HBwaojN0xFRx4yIvpwGqxiV2tUfl7401jlok564NgB9EHS1y6QT17FmKWm4ztqjeVdXLuC4fSvHc5ePpQjoTbw==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.5"
             },
@@ -696,22 +685,20 @@
             }
         },
         "node_modules/@babel/helper-plugin-utils": {
-            "version": "7.22.5",
-            "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz",
-            "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==",
-            "dev": true,
+            "version": "7.24.0",
+            "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.0.tgz",
+            "integrity": "sha512-9cUznXMG0+FxRuJfvL82QlTqIzhVW9sL0KjMPHhAOOvpQGL8QtdxnBKILjBqxlHyliz0yCa1G903ZXI/FuHy2w==",
             "engines": {
                 "node": ">=6.9.0"
             }
         },
         "node_modules/@babel/helper-replace-supers": {
-            "version": "7.22.20",
-            "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.22.20.tgz",
-            "integrity": "sha512-qsW0In3dbwQUbK8kejJ4R7IHVGwHJlV6lpG6UA7a9hSa2YEiAib+N1T2kr6PEeUT+Fl7najmSOS6SmAwCHK6Tw==",
-            "dev": true,
+            "version": "7.24.1",
+            "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.24.1.tgz",
+            "integrity": "sha512-QCR1UqC9BzG5vZl8BMicmZ28RuUBnHhAMddD8yHFHDRH9lLTZ9uUPehX8ctVPT8l0TKblJidqcgUUKGVrePleQ==",
             "dependencies": {
                 "@babel/helper-environment-visitor": "^7.22.20",
-                "@babel/helper-member-expression-to-functions": "^7.22.15",
+                "@babel/helper-member-expression-to-functions": "^7.23.0",
                 "@babel/helper-optimise-call-expression": "^7.22.5"
             },
             "engines": {
@@ -725,7 +712,6 @@
             "version": "7.22.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz",
             "integrity": "sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.5"
             },
@@ -737,7 +723,6 @@
             "version": "7.22.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.22.5.tgz",
             "integrity": "sha512-tK14r66JZKiC43p8Ki33yLBVJKlQDFoA8GYN67lWCDCqoL6EMMSuM9b+Iff2jHaM/RRFYl7K+iiru7hbRqNx8Q==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.5"
             },
@@ -749,7 +734,6 @@
             "version": "7.22.6",
             "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz",
             "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==",
-            "dev": true,
             "dependencies": {
                 "@babel/types": "^7.22.5"
             },
@@ -761,7 +745,6 @@
             "version": "7.23.4",
             "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz",
             "integrity": "sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==",
-            "dev": true,
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -770,7 +753,6 @@
             "version": "7.22.20",
             "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz",
             "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==",
-            "dev": true,
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -779,7 +761,6 @@
             "version": "7.23.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.23.5.tgz",
             "integrity": "sha512-85ttAOMLsr53VgXkTbkx8oA6YTfT4q7/HzXSLEYmjcSTJPMPQtvq1BD79Byep5xMUYbGRzEpDsjUf3dyp54IKw==",
-            "dev": true,
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -788,7 +769,6 @@
             "version": "7.23.9",
             "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.9.tgz",
             "integrity": "sha512-87ICKgU5t5SzOT7sBMfCOZQ2rHjRU+Pcb9BoILMYz600W6DkVRLFBPwQ18gwUVvggqXivaUakpnxWQGbpywbBQ==",
-            "dev": true,
             "dependencies": {
                 "@babel/template": "^7.23.9",
                 "@babel/traverse": "^7.23.9",
@@ -802,7 +782,6 @@
             "version": "7.23.4",
             "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.23.4.tgz",
             "integrity": "sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==",
-            "dev": true,
             "dependencies": {
                 "@babel/helper-validator-identifier": "^7.22.20",
                 "chalk": "^2.4.2",
@@ -816,7 +795,6 @@
             "version": "3.2.1",
             "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
             "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-            "dev": true,
             "dependencies": {
                 "color-convert": "^1.9.0"
             },
@@ -828,7 +806,6 @@
             "version": "2.4.2",
             "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
             "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-            "dev": true,
             "dependencies": {
                 "ansi-styles": "^3.2.1",
                 "escape-string-regexp": "^1.0.5",
@@ -842,7 +819,6 @@
             "version": "1.9.3",
             "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
             "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-            "dev": true,
             "dependencies": {
                 "color-name": "1.1.3"
             }
@@ -850,14 +826,12 @@
         "node_modules/@babel/highlight/node_modules/color-name": {
             "version": "1.1.3",
             "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-            "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-            "dev": true
+            "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
         },
         "node_modules/@babel/highlight/node_modules/escape-string-regexp": {
             "version": "1.0.5",
             "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
             "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-            "dev": true,
             "engines": {
                 "node": ">=0.8.0"
             }
@@ -866,7 +840,6 @@
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
             "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-            "dev": true,
             "engines": {
                 "node": ">=4"
             }
@@ -875,7 +848,6 @@
             "version": "5.5.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
             "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-            "dev": true,
             "dependencies": {
                 "has-flag": "^3.0.0"
             },
@@ -887,7 +859,6 @@
             "version": "7.23.9",
             "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.9.tgz",
             "integrity": "sha512-9tcKgqKbs3xGJ+NtKF2ndOBBLVwPjl1SHxPQkd36r3Dlirw3xWUeGaTbqr7uGZcTaxkVNwc+03SVP7aCdWrTlA==",
-            "dev": true,
             "bin": {
                 "parser": "bin/babel-parser.js"
             },
@@ -1001,6 +972,20 @@
                 "@babel/core": "^7.0.0-0"
             }
         },
+        "node_modules/@babel/plugin-syntax-typescript": {
+            "version": "7.24.1",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.24.1.tgz",
+            "integrity": "sha512-Yhnmvy5HZEnHUty6i++gcfH1/l68AHnItFHnaCv6hn9dNh0hQvvQJsxpi4BMBFN5DLeHBuucT/0DgzXif/OyRw==",
+            "dependencies": {
+                "@babel/helper-plugin-utils": "^7.24.0"
+            },
+            "engines": {
+                "node": ">=6.9.0"
+            },
+            "peerDependencies": {
+                "@babel/core": "^7.0.0-0"
+            }
+        },
         "node_modules/@babel/plugin-transform-arrow-functions": {
             "version": "7.23.3",
             "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.23.3.tgz",
@@ -1330,6 +1315,23 @@
                 "@babel/core": "^7.0.0-0"
             }
         },
+        "node_modules/@babel/plugin-transform-typescript": {
+            "version": "7.24.1",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.24.1.tgz",
+            "integrity": "sha512-liYSESjX2fZ7JyBFkYG78nfvHlMKE6IpNdTVnxmlYUR+j5ZLsitFbaAE+eJSK2zPPkNWNw4mXL51rQ8WrvdK0w==",
+            "dependencies": {
+                "@babel/helper-annotate-as-pure": "^7.22.5",
+                "@babel/helper-create-class-features-plugin": "^7.24.1",
+                "@babel/helper-plugin-utils": "^7.24.0",
+                "@babel/plugin-syntax-typescript": "^7.24.1"
+            },
+            "engines": {
+                "node": ">=6.9.0"
+            },
+            "peerDependencies": {
+                "@babel/core": "^7.0.0-0"
+            }
+        },
         "node_modules/@babel/runtime": {
             "version": "7.23.8",
             "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.8.tgz",
@@ -1345,7 +1347,6 @@
             "version": "7.23.9",
             "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.23.9.tgz",
             "integrity": "sha512-+xrD2BWLpvHKNmX2QbpdpsBaWnRxahMwJjO+KZk2JOElj5nSmKezyS1B4u+QbHMTX69t4ukm6hh9lsYQ7GHCKA==",
-            "dev": true,
             "dependencies": {
                 "@babel/code-frame": "^7.23.5",
                 "@babel/parser": "^7.23.9",
@@ -1359,7 +1360,6 @@
             "version": "7.23.9",
             "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.9.tgz",
             "integrity": "sha512-I/4UJ9vs90OkBtY6iiiTORVMyIhJ4kAVmsKo9KFc8UOxMeUfi2hvtIBsET5u9GizXE6/GFSuKCTNfgCswuEjRg==",
-            "dev": true,
             "dependencies": {
                 "@babel/code-frame": "^7.23.5",
                 "@babel/generator": "^7.23.6",
@@ -1380,7 +1380,6 @@
             "version": "11.12.0",
             "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
             "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
-            "dev": true,
             "engines": {
                 "node": ">=4"
             }
@@ -1389,7 +1388,6 @@
             "version": "7.23.9",
             "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.9.tgz",
             "integrity": "sha512-dQjSq/7HaSjRM43FFGnv5keM2HsxpmyV1PfaSVm0nzzjwwTmjOe6J4bC8e3+pTEIgHaHj+1ZlLThRJ2auc/w1Q==",
-            "dev": true,
             "dependencies": {
                 "@babel/helper-string-parser": "^7.23.4",
                 "@babel/helper-validator-identifier": "^7.22.20",
@@ -6423,6 +6421,11 @@
                 "node": ">=0.4.0"
             }
         },
+        "node_modules/add": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/add/-/add-2.0.6.tgz",
+            "integrity": "sha512-j5QzrmsokwWWp6kUcJQySpbG+xfOBqqKnup3OIk1pz+kB/80SLorZ9V8zHFLO92Lcd+hbvq8bT+zOGoPkmBV0Q=="
+        },
         "node_modules/agent-base": {
             "version": "6.0.2",
             "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
@@ -6566,8 +6569,7 @@
         "node_modules/argparse": {
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
-            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
-            "dev": true
+            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q=="
         },
         "node_modules/aria-hidden": {
             "version": "1.2.3",
@@ -6995,7 +6997,6 @@
             "version": "1.5.1",
             "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
             "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
-            "dev": true,
             "funding": [
                 {
                     "type": "github",
@@ -7090,7 +7091,6 @@
             "version": "4.22.2",
             "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
             "integrity": "sha512-0UgcrvQmBDvZHFGdYUehrCNIazki7/lUP3kkoi/r3YB2amZbFM9J43ZRkJTXBUZK4gmx56+Sqk9+Vs9mwZx9+A==",
-            "dev": true,
             "funding": [
                 {
                     "type": "opencollective",
@@ -7217,7 +7217,6 @@
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
             "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
-            "dev": true,
             "engines": {
                 "node": ">=6"
             }
@@ -7544,7 +7543,6 @@
             "version": "2.9.2",
             "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-2.9.2.tgz",
             "integrity": "sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==",
-            "dev": true,
             "engines": {
                 "node": ">=6"
             },
@@ -7657,7 +7655,6 @@
             "version": "1.0.4",
             "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz",
             "integrity": "sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==",
-            "dev": true,
             "engines": {
                 "node": ">=0.8"
             }
@@ -7912,8 +7909,7 @@
         "node_modules/convert-source-map": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-            "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-            "dev": true
+            "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg=="
         },
         "node_modules/cookie": {
             "version": "0.5.0",
@@ -7960,7 +7956,6 @@
             "version": "8.3.6",
             "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz",
             "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==",
-            "dev": true,
             "dependencies": {
                 "import-fresh": "^3.3.0",
                 "js-yaml": "^4.1.0",
@@ -8457,7 +8452,6 @@
             "version": "1.0.4",
             "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz",
             "integrity": "sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==",
-            "dev": true,
             "dependencies": {
                 "clone": "^1.0.2"
             },
@@ -8803,8 +8797,7 @@
         "node_modules/electron-to-chromium": {
             "version": "1.4.640",
             "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.640.tgz",
-            "integrity": "sha512-z/6oZ/Muqk4BaE7P69bXhUhpJbUM9ZJeka43ZwxsDshKtePns4mhBlh8bU5+yrnOnz3fhG82XLzGUXazOmsWnA==",
-            "dev": true
+            "integrity": "sha512-z/6oZ/Muqk4BaE7P69bXhUhpJbUM9ZJeka43ZwxsDshKtePns4mhBlh8bU5+yrnOnz3fhG82XLzGUXazOmsWnA=="
         },
         "node_modules/element-size": {
             "version": "1.1.1",
@@ -8852,7 +8845,6 @@
             "version": "1.3.2",
             "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
             "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
-            "dev": true,
             "dependencies": {
                 "is-arrayish": "^0.2.1"
             }
@@ -9381,7 +9373,6 @@
             "version": "3.1.1",
             "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
             "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
-            "dev": true,
             "engines": {
                 "node": ">=6"
             }
@@ -9803,7 +9794,6 @@
             "version": "4.0.1",
             "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
             "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
-            "peer": true,
             "bin": {
                 "esparse": "bin/esparse.js",
                 "esvalidate": "bin/esvalidate.js"
@@ -10137,6 +10127,28 @@
                 "pend": "~1.2.0"
             }
         },
+        "node_modules/fetch-blob": {
+            "version": "3.2.0",
+            "resolved": "https://registry.npmjs.org/fetch-blob/-/fetch-blob-3.2.0.tgz",
+            "integrity": "sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==",
+            "funding": [
+                {
+                    "type": "github",
+                    "url": "https://github.com/sponsors/jimmywarting"
+                },
+                {
+                    "type": "paypal",
+                    "url": "https://paypal.me/jimmywarting"
+                }
+            ],
+            "dependencies": {
+                "node-domexception": "^1.0.0",
+                "web-streams-polyfill": "^3.0.3"
+            },
+            "engines": {
+                "node": "^12.20 || >= 14.13"
+            }
+        },
         "node_modules/fflate": {
             "version": "0.4.8",
             "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.4.8.tgz",
@@ -10284,6 +10296,17 @@
                 "url": "https://github.com/sponsors/isaacs"
             }
         },
+        "node_modules/formdata-polyfill": {
+            "version": "4.0.10",
+            "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
+            "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
+            "dependencies": {
+                "fetch-blob": "^3.1.2"
+            },
+            "engines": {
+                "node": ">=12.20.0"
+            }
+        },
         "node_modules/fraction.js": {
             "version": "4.3.7",
             "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
@@ -10512,7 +10535,6 @@
             "version": "1.0.0-beta.2",
             "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
             "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
-            "dev": true,
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -11531,7 +11553,6 @@
             "version": "3.3.0",
             "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
             "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==",
-            "dev": true,
             "dependencies": {
                 "parent-module": "^1.0.0",
                 "resolve-from": "^4.0.0"
@@ -11743,8 +11764,7 @@
         "node_modules/is-arrayish": {
             "version": "0.2.1",
             "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-            "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
-            "dev": true
+            "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg=="
         },
         "node_modules/is-async-function": {
             "version": "2.0.0",
@@ -12324,7 +12344,6 @@
             "version": "4.1.0",
             "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
             "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
-            "dev": true,
             "dependencies": {
                 "argparse": "^2.0.1"
             },
@@ -12336,7 +12355,6 @@
             "version": "2.5.2",
             "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
             "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
-            "dev": true,
             "bin": {
                 "jsesc": "bin/jsesc"
             },
@@ -12353,8 +12371,7 @@
         "node_modules/json-parse-even-better-errors": {
             "version": "2.3.1",
             "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-            "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
-            "dev": true
+            "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w=="
         },
         "node_modules/json-schema-to-ts": {
             "version": "1.6.4",
@@ -12505,6 +12522,14 @@
                 "json-buffer": "3.0.1"
             }
         },
+        "node_modules/kleur": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz",
+            "integrity": "sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
         "node_modules/language-subtag-registry": {
             "version": "0.3.22",
             "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.22.tgz",
@@ -12644,6 +12669,11 @@
             "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
             "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
         },
+        "node_modules/lodash._reinterpolate": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+            "integrity": "sha512-xYHt68QRoYGjeeM/XOE1uJtvXQAgvszfBhjV4yvsQH0u2i9I6cI6c6/eG4Hh3UAOVn0y/xAXwmTzEay49Q//HA=="
+        },
         "node_modules/lodash.castarray": {
             "version": "4.4.0",
             "resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
@@ -12667,6 +12697,23 @@
             "integrity": "sha512-HDWXG8isMntAyRF5vZ7xKuEvOhT4AhlRt/3czTSjvGUxjYCBVRQY48ViDHyfYz9VIoBkW4TMGQNapx+l3RUwdA==",
             "dev": true
         },
+        "node_modules/lodash.template": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-4.5.0.tgz",
+            "integrity": "sha512-84vYFxIkmidUiFxidA/KjjH9pAycqW+h980j7Fuz5qxRtO9pgB7MDFTdys1N7A5mcucRiDyEq4fusljItR1T/A==",
+            "dependencies": {
+                "lodash._reinterpolate": "^3.0.0",
+                "lodash.templatesettings": "^4.0.0"
+            }
+        },
+        "node_modules/lodash.templatesettings": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-4.2.0.tgz",
+            "integrity": "sha512-stgLz+i3Aa9mZgnjr/O+v9ruKZsPsndy7qPZOchbqk2cnTU1ZaldKK+v7m54WoKIyxiuMZTKT2H81F8BeAc3ZQ==",
+            "dependencies": {
+                "lodash._reinterpolate": "^3.0.0"
+            }
+        },
         "node_modules/log-symbols": {
             "version": "4.1.0",
             "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz",
@@ -13079,9 +13126,7 @@
         "node_modules/merge-stream": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
-            "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
-            "dev": true,
-            "peer": true
+            "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w=="
         },
         "node_modules/merge2": {
             "version": "1.4.1",
@@ -13939,6 +13984,24 @@
                 "tslib": "^2.0.3"
             }
         },
+        "node_modules/node-domexception": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
+            "integrity": "sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==",
+            "funding": [
+                {
+                    "type": "github",
+                    "url": "https://github.com/sponsors/jimmywarting"
+                },
+                {
+                    "type": "github",
+                    "url": "https://paypal.me/jimmywarting"
+                }
+            ],
+            "engines": {
+                "node": ">=10.5.0"
+            }
+        },
         "node_modules/node-fetch": {
             "version": "2.6.7",
             "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz",
@@ -13995,8 +14058,7 @@
         "node_modules/node-releases": {
             "version": "2.0.14",
             "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
-            "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
-            "dev": true
+            "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw=="
         },
         "node_modules/nopt": {
             "version": "5.0.0",
@@ -14420,6 +14482,11 @@
                 "shellac": "^0.8.0"
             }
         },
+        "node_modules/pagination": {
+            "version": "0.4.6",
+            "resolved": "https://registry.npmjs.org/pagination/-/pagination-0.4.6.tgz",
+            "integrity": "sha512-TnZ3l17uuC5H9Wlc9FMYuEi65JlUCSn1ZAbnLnvUGkR7RgaFknUNGQTEumhjq1Jy1ePkXSiYUFFbHH70LGb9dA=="
+        },
         "node_modules/pako": {
             "version": "2.1.0",
             "resolved": "https://registry.npmjs.org/pako/-/pako-2.1.0.tgz",
@@ -14439,7 +14506,6 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
             "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
-            "dev": true,
             "dependencies": {
                 "callsites": "^3.0.0"
             },
@@ -14500,7 +14566,6 @@
             "version": "5.2.0",
             "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
             "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
-            "dev": true,
             "dependencies": {
                 "@babel/code-frame": "^7.0.0",
                 "error-ex": "^1.3.1",
@@ -14558,9 +14623,7 @@
         "node_modules/path-browserify": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
-            "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
-            "dev": true,
-            "peer": true
+            "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g=="
         },
         "node_modules/path-case": {
             "version": "3.0.4",
@@ -14678,7 +14741,6 @@
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
             "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
-            "dev": true,
             "engines": {
                 "node": ">=8"
             }
@@ -15249,6 +15311,18 @@
             "dev": true,
             "peer": true
         },
+        "node_modules/prompts": {
+            "version": "2.4.2",
+            "resolved": "https://registry.npmjs.org/prompts/-/prompts-2.4.2.tgz",
+            "integrity": "sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==",
+            "dependencies": {
+                "kleur": "^3.0.3",
+                "sisteransi": "^1.0.5"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
         "node_modules/prop-types": {
             "version": "15.8.1",
             "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
@@ -15569,7 +15643,6 @@
             "version": "3.6.2",
             "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
             "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
-            "dev": true,
             "dependencies": {
                 "inherits": "^2.0.3",
                 "string_decoder": "^1.1.1",
@@ -15590,6 +15663,32 @@
                 "node": ">=8.10.0"
             }
         },
+        "node_modules/recast": {
+            "version": "0.23.6",
+            "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.6.tgz",
+            "integrity": "sha512-9FHoNjX1yjuesMwuthAmPKabxYQdOgihFYmT5ebXfYGBcnqXZf3WOVz+5foEZ8Y83P4ZY6yQD5GMmtV+pgCCAQ==",
+            "dependencies": {
+                "ast-types": "^0.16.1",
+                "esprima": "~4.0.0",
+                "source-map": "~0.6.1",
+                "tiny-invariant": "^1.3.3",
+                "tslib": "^2.0.1"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/recast/node_modules/ast-types": {
+            "version": "0.16.1",
+            "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz",
+            "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==",
+            "dependencies": {
+                "tslib": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
         "node_modules/reflect.getprototypeof": {
             "version": "1.0.4",
             "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz",
@@ -15862,7 +15961,6 @@
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
             "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
-            "dev": true,
             "engines": {
                 "node": ">=4"
             }
@@ -16106,7 +16204,6 @@
             "version": "5.2.1",
             "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
             "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-            "dev": true,
             "funding": [
                 {
                     "type": "github",
@@ -16274,71 +16371,546 @@
             "dev": true,
             "peer": true
         },
-        "node_modules/shallow-copy": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/shallow-copy/-/shallow-copy-0.0.1.tgz",
-            "integrity": "sha512-b6i4ZpVuUxB9h5gfCxPiusKYkqTMOjEbBs4wMaFbkfia4yFv92UKZ6Df8WXcKbn08JNL/abvg3FnMAOfakDvUw==",
-            "peer": true
+        "node_modules/shadcn-ui": {
+            "version": "0.8.0",
+            "resolved": "https://registry.npmjs.org/shadcn-ui/-/shadcn-ui-0.8.0.tgz",
+            "integrity": "sha512-avqRgjJ6PIQQXdfvoCAWQpyLTLk6oHhtU5DQKmLeYcgu1ZIsgMqA9MKWAkr0HpEdCAenCCZvFbvJ2C2m5ZXRiA==",
+            "dependencies": {
+                "@antfu/ni": "^0.21.4",
+                "@babel/core": "^7.22.1",
+                "@babel/parser": "^7.22.6",
+                "@babel/plugin-transform-typescript": "^7.22.5",
+                "chalk": "5.2.0",
+                "commander": "^10.0.0",
+                "cosmiconfig": "^8.1.3",
+                "diff": "^5.1.0",
+                "execa": "^7.0.0",
+                "fast-glob": "^3.3.2",
+                "fs-extra": "^11.1.0",
+                "https-proxy-agent": "^6.2.0",
+                "lodash.template": "^4.5.0",
+                "node-fetch": "^3.3.0",
+                "ora": "^6.1.2",
+                "prompts": "^2.4.2",
+                "recast": "^0.23.2",
+                "ts-morph": "^18.0.0",
+                "tsconfig-paths": "^4.2.0",
+                "zod": "^3.20.2"
+            },
+            "bin": {
+                "shadcn-ui": "dist/index.js"
+            }
         },
-        "node_modules/shebang-command": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
-            "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+        "node_modules/shadcn-ui/node_modules/@ts-morph/common": {
+            "version": "0.19.0",
+            "resolved": "https://registry.npmjs.org/@ts-morph/common/-/common-0.19.0.tgz",
+            "integrity": "sha512-Unz/WHmd4pGax91rdIKWi51wnVUW11QttMEPpBiBgIewnc9UQIX7UDLxr5vRlqeByXCwhkF6VabSsI0raWcyAQ==",
             "dependencies": {
-                "shebang-regex": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=8"
+                "fast-glob": "^3.2.12",
+                "minimatch": "^7.4.3",
+                "mkdirp": "^2.1.6",
+                "path-browserify": "^1.0.1"
             }
         },
-        "node_modules/shebang-regex": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
-            "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+        "node_modules/shadcn-ui/node_modules/agent-base": {
+            "version": "7.1.0",
+            "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
+            "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
+            "dependencies": {
+                "debug": "^4.3.4"
+            },
             "engines": {
-                "node": ">=8"
+                "node": ">= 14"
             }
         },
-        "node_modules/shell-quote": {
-            "version": "1.8.1",
-            "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz",
-            "integrity": "sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==",
-            "dev": true,
+        "node_modules/shadcn-ui/node_modules/ansi-regex": {
+            "version": "6.0.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
+            "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
+            "engines": {
+                "node": ">=12"
+            },
             "funding": {
-                "url": "https://github.com/sponsors/ljharb"
+                "url": "https://github.com/chalk/ansi-regex?sponsor=1"
             }
         },
-        "node_modules/shellac": {
-            "version": "0.8.0",
-            "resolved": "https://registry.npmjs.org/shellac/-/shellac-0.8.0.tgz",
-            "integrity": "sha512-M3F2vzYIM7frKOs0+kgs/ITMlXhGpgtqs9HxDPciz3bckzAqqfd4LrBn+CCmSbICyJS+Jz5UDkmkR1jE+m+g+Q==",
-            "dev": true,
+        "node_modules/shadcn-ui/node_modules/brace-expansion": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+            "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
             "dependencies": {
-                "reghex": "^1.0.2"
+                "balanced-match": "^1.0.0"
             }
         },
-        "node_modules/side-channel": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
-            "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
-            "dependencies": {
-                "call-bind": "^1.0.0",
-                "get-intrinsic": "^1.0.2",
-                "object-inspect": "^1.9.0"
+        "node_modules/shadcn-ui/node_modules/chalk": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.2.0.tgz",
+            "integrity": "sha512-ree3Gqw/nazQAPuJJEy+avdl7QfZMcUvmHIKgEZkGL+xOBzRvup5Hxo6LHuMceSxOabuJLJm5Yp/92R9eMmMvA==",
+            "engines": {
+                "node": "^12.17.0 || ^14.13 || >=16.0.0"
             },
             "funding": {
-                "url": "https://github.com/sponsors/ljharb"
+                "url": "https://github.com/chalk/chalk?sponsor=1"
             }
         },
-        "node_modules/signal-exit": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-            "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+        "node_modules/shadcn-ui/node_modules/cli-cursor": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-4.0.0.tgz",
+            "integrity": "sha512-VGtlMu3x/4DOtIUwEkRezxUZ2lBacNJCHash0N0WeZDBS+7Ux1dm3XWAgWYxLJFMMdOeXMHXorshEFhbMSGelg==",
+            "dependencies": {
+                "restore-cursor": "^4.0.0"
+            },
             "engines": {
-                "node": ">=14"
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
             },
             "funding": {
-                "url": "https://github.com/sponsors/isaacs"
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/code-block-writer": {
+            "version": "12.0.0",
+            "resolved": "https://registry.npmjs.org/code-block-writer/-/code-block-writer-12.0.0.tgz",
+            "integrity": "sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w=="
+        },
+        "node_modules/shadcn-ui/node_modules/commander": {
+            "version": "10.0.1",
+            "resolved": "https://registry.npmjs.org/commander/-/commander-10.0.1.tgz",
+            "integrity": "sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug==",
+            "engines": {
+                "node": ">=14"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/data-uri-to-buffer": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz",
+            "integrity": "sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==",
+            "engines": {
+                "node": ">= 12"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/diff": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/diff/-/diff-5.2.0.tgz",
+            "integrity": "sha512-uIFDxqpRZGZ6ThOk84hEfqWoHx2devRFvpTZcTHur85vImfaxUbTW9Ryh4CpCuDnToOP1CEtXKIgytHBPVff5A==",
+            "engines": {
+                "node": ">=0.3.1"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/execa": {
+            "version": "7.2.0",
+            "resolved": "https://registry.npmjs.org/execa/-/execa-7.2.0.tgz",
+            "integrity": "sha512-UduyVP7TLB5IcAQl+OzLyLcS/l32W/GLg+AhHJ+ow40FOk2U3SAllPwR44v4vmdFwIWqpdwxxpQbF1n5ta9seA==",
+            "dependencies": {
+                "cross-spawn": "^7.0.3",
+                "get-stream": "^6.0.1",
+                "human-signals": "^4.3.0",
+                "is-stream": "^3.0.0",
+                "merge-stream": "^2.0.0",
+                "npm-run-path": "^5.1.0",
+                "onetime": "^6.0.0",
+                "signal-exit": "^3.0.7",
+                "strip-final-newline": "^3.0.0"
+            },
+            "engines": {
+                "node": "^14.18.0 || ^16.14.0 || >=18.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sindresorhus/execa?sponsor=1"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/fs-extra": {
+            "version": "11.2.0",
+            "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz",
+            "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==",
+            "dependencies": {
+                "graceful-fs": "^4.2.0",
+                "jsonfile": "^6.0.1",
+                "universalify": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=14.14"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/get-stream": {
+            "version": "6.0.1",
+            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
+            "integrity": "sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==",
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/https-proxy-agent": {
+            "version": "6.2.1",
+            "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-6.2.1.tgz",
+            "integrity": "sha512-ONsE3+yfZF2caH5+bJlcddtWqNI3Gvs5A38+ngvljxaBiRXRswym2c7yf8UAeFpRFKjFNHIFEHqR/OLAWJzyiA==",
+            "dependencies": {
+                "agent-base": "^7.0.2",
+                "debug": "4"
+            },
+            "engines": {
+                "node": ">= 14"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/human-signals": {
+            "version": "4.3.1",
+            "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-4.3.1.tgz",
+            "integrity": "sha512-nZXjEF2nbo7lIw3mgYjItAfgQXog3OjJogSbKa2CQIIvSGWcKgeJnQlNXip6NglNzYH45nSRiEVimMvYL8DDqQ==",
+            "engines": {
+                "node": ">=14.18.0"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/is-interactive": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+            "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/is-stream": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-3.0.0.tgz",
+            "integrity": "sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==",
+            "engines": {
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/is-unicode-supported": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+            "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/json5": {
+            "version": "2.2.3",
+            "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+            "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
+            "bin": {
+                "json5": "lib/cli.js"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/jsonfile": {
+            "version": "6.1.0",
+            "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+            "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+            "dependencies": {
+                "universalify": "^2.0.0"
+            },
+            "optionalDependencies": {
+                "graceful-fs": "^4.1.6"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/log-symbols": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-5.1.0.tgz",
+            "integrity": "sha512-l0x2DvrW294C9uDCoQe1VSU4gf529FkSZ6leBl4TiqZH/e+0R7hSfHQBNut2mNygDgHwvYHfFLn6Oxb3VWj2rA==",
+            "dependencies": {
+                "chalk": "^5.0.0",
+                "is-unicode-supported": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/mimic-fn": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz",
+            "integrity": "sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==",
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/minimatch": {
+            "version": "7.4.6",
+            "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-7.4.6.tgz",
+            "integrity": "sha512-sBz8G/YjVniEz6lKPNpKxXwazJe4c19fEfV2GDMX6AjFz+MX9uDWIZW8XreVhkFW3fkIdTv/gxWr/Kks5FFAVw==",
+            "dependencies": {
+                "brace-expansion": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/isaacs"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/mkdirp": {
+            "version": "2.1.6",
+            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-2.1.6.tgz",
+            "integrity": "sha512-+hEnITedc8LAtIP9u3HJDFIdcLV2vXP33sqLLIzkv1Db1zO/1OxbvYf0Y1OC/S/Qo5dxHXepofhmxL02PsKe+A==",
+            "bin": {
+                "mkdirp": "dist/cjs/src/bin.js"
+            },
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/isaacs"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/node-fetch": {
+            "version": "3.3.2",
+            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-3.3.2.tgz",
+            "integrity": "sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==",
+            "dependencies": {
+                "data-uri-to-buffer": "^4.0.0",
+                "fetch-blob": "^3.1.4",
+                "formdata-polyfill": "^4.0.10"
+            },
+            "engines": {
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/node-fetch"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/npm-run-path": {
+            "version": "5.3.0",
+            "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.3.0.tgz",
+            "integrity": "sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==",
+            "dependencies": {
+                "path-key": "^4.0.0"
+            },
+            "engines": {
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/onetime": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/onetime/-/onetime-6.0.0.tgz",
+            "integrity": "sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==",
+            "dependencies": {
+                "mimic-fn": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/ora": {
+            "version": "6.3.1",
+            "resolved": "https://registry.npmjs.org/ora/-/ora-6.3.1.tgz",
+            "integrity": "sha512-ERAyNnZOfqM+Ao3RAvIXkYh5joP220yf59gVe2X/cI6SiCxIdi4c9HZKZD8R6q/RDXEje1THBju6iExiSsgJaQ==",
+            "dependencies": {
+                "chalk": "^5.0.0",
+                "cli-cursor": "^4.0.0",
+                "cli-spinners": "^2.6.1",
+                "is-interactive": "^2.0.0",
+                "is-unicode-supported": "^1.1.0",
+                "log-symbols": "^5.1.0",
+                "stdin-discarder": "^0.1.0",
+                "strip-ansi": "^7.0.1",
+                "wcwidth": "^1.0.1"
+            },
+            "engines": {
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/path-key": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/path-key/-/path-key-4.0.0.tgz",
+            "integrity": "sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==",
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/restore-cursor": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-4.0.0.tgz",
+            "integrity": "sha512-I9fPXU9geO9bHOt9pHHOhOkYerIMsmVaWB0rA2AI9ERh/+x/i7MV5HKBNrg+ljO5eoPVgCcnFuRjJ9uH6I/3eg==",
+            "dependencies": {
+                "onetime": "^5.1.0",
+                "signal-exit": "^3.0.2"
+            },
+            "engines": {
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/restore-cursor/node_modules/mimic-fn": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
+            "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/restore-cursor/node_modules/onetime": {
+            "version": "5.1.2",
+            "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
+            "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
+            "dependencies": {
+                "mimic-fn": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/signal-exit": {
+            "version": "3.0.7",
+            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
+            "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ=="
+        },
+        "node_modules/shadcn-ui/node_modules/strip-ansi": {
+            "version": "7.1.0",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+            "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+            "dependencies": {
+                "ansi-regex": "^6.0.1"
+            },
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/strip-final-newline": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-3.0.0.tgz",
+            "integrity": "sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==",
+            "engines": {
+                "node": ">=12"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/ts-morph": {
+            "version": "18.0.0",
+            "resolved": "https://registry.npmjs.org/ts-morph/-/ts-morph-18.0.0.tgz",
+            "integrity": "sha512-Kg5u0mk19PIIe4islUI/HWRvm9bC1lHejK4S0oh1zaZ77TMZAEmQC0sHQYiu2RgCQFZKXz1fMVi/7nOOeirznA==",
+            "dependencies": {
+                "@ts-morph/common": "~0.19.0",
+                "code-block-writer": "^12.0.0"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/tsconfig-paths": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-4.2.0.tgz",
+            "integrity": "sha512-NoZ4roiN7LnbKn9QqE1amc9DJfzvZXxF4xDavcOWt1BPkdx+m+0gJuPM+S0vCe7zTJMYUP0R8pO2XMr+Y8oLIg==",
+            "dependencies": {
+                "json5": "^2.2.2",
+                "minimist": "^1.2.6",
+                "strip-bom": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/shadcn-ui/node_modules/universalify": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
+            "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+            "engines": {
+                "node": ">= 10.0.0"
+            }
+        },
+        "node_modules/shallow-copy": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/shallow-copy/-/shallow-copy-0.0.1.tgz",
+            "integrity": "sha512-b6i4ZpVuUxB9h5gfCxPiusKYkqTMOjEbBs4wMaFbkfia4yFv92UKZ6Df8WXcKbn08JNL/abvg3FnMAOfakDvUw==",
+            "peer": true
+        },
+        "node_modules/shebang-command": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
+            "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+            "dependencies": {
+                "shebang-regex": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/shebang-regex": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
+            "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/shell-quote": {
+            "version": "1.8.1",
+            "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz",
+            "integrity": "sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==",
+            "dev": true,
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/shellac": {
+            "version": "0.8.0",
+            "resolved": "https://registry.npmjs.org/shellac/-/shellac-0.8.0.tgz",
+            "integrity": "sha512-M3F2vzYIM7frKOs0+kgs/ITMlXhGpgtqs9HxDPciz3bckzAqqfd4LrBn+CCmSbICyJS+Jz5UDkmkR1jE+m+g+Q==",
+            "dev": true,
+            "dependencies": {
+                "reghex": "^1.0.2"
+            }
+        },
+        "node_modules/side-channel": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
+            "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
+            "dependencies": {
+                "call-bind": "^1.0.0",
+                "get-intrinsic": "^1.0.2",
+                "object-inspect": "^1.9.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/signal-exit": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+            "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+            "engines": {
+                "node": ">=14"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/isaacs"
             }
         },
         "node_modules/signedsource": {
@@ -16358,6 +16930,11 @@
             "resolved": "https://registry.npmjs.org/simplesignal/-/simplesignal-2.1.7.tgz",
             "integrity": "sha512-PEo2qWpUke7IMhlqiBxrulIFvhJRLkl1ih52Rwa+bPjzhJepcd4GIjn2RiQmFSx3dQvsEAgF0/lXMwMN7vODaA=="
         },
+        "node_modules/sisteransi": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
+            "integrity": "sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg=="
+        },
         "node_modules/slash": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -16423,7 +17000,6 @@
             "version": "0.6.1",
             "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
             "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "devOptional": true,
             "engines": {
                 "node": ">=0.10.0"
             }
@@ -16517,6 +17093,53 @@
                 "node": ">= 0.6"
             }
         },
+        "node_modules/stdin-discarder": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/stdin-discarder/-/stdin-discarder-0.1.0.tgz",
+            "integrity": "sha512-xhV7w8S+bUwlPTb4bAOUQhv8/cSS5offJuX8GQGq32ONF0ZtDWKfkdomM3HMRA+LhX6um/FZ0COqlwsjD53LeQ==",
+            "dependencies": {
+                "bl": "^5.0.0"
+            },
+            "engines": {
+                "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
+        "node_modules/stdin-discarder/node_modules/bl": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/bl/-/bl-5.1.0.tgz",
+            "integrity": "sha512-tv1ZJHLfTDnXE6tMHv73YgSJaWR2AFuPwMntBe7XL/GBFHnT0CLnsHMogfk5+GzCDC5ZWarSCYaIGATZt9dNsQ==",
+            "dependencies": {
+                "buffer": "^6.0.3",
+                "inherits": "^2.0.4",
+                "readable-stream": "^3.4.0"
+            }
+        },
+        "node_modules/stdin-discarder/node_modules/buffer": {
+            "version": "6.0.3",
+            "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz",
+            "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
+            "funding": [
+                {
+                    "type": "github",
+                    "url": "https://github.com/sponsors/feross"
+                },
+                {
+                    "type": "patreon",
+                    "url": "https://www.patreon.com/feross"
+                },
+                {
+                    "type": "consulting",
+                    "url": "https://feross.org/support"
+                }
+            ],
+            "dependencies": {
+                "base64-js": "^1.3.1",
+                "ieee754": "^1.2.1"
+            }
+        },
         "node_modules/stoppable": {
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/stoppable/-/stoppable-1.1.0.tgz",
@@ -16611,7 +17234,6 @@
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
             "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
-            "dev": true,
             "dependencies": {
                 "safe-buffer": "~5.2.0"
             }
@@ -16796,7 +17418,6 @@
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
             "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
-            "dev": true,
             "engines": {
                 "node": ">=4"
             }
@@ -17301,6 +17922,11 @@
                 "url": "https://github.com/sponsors/sindresorhus"
             }
         },
+        "node_modules/tiny-invariant": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+            "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="
+        },
         "node_modules/tinycolor2": {
             "version": "1.6.0",
             "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz",
@@ -17337,7 +17963,6 @@
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
             "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==",
-            "dev": true,
             "engines": {
                 "node": ">=4"
             }
@@ -17896,7 +18521,6 @@
             "version": "1.0.13",
             "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
             "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==",
-            "dev": true,
             "funding": [
                 {
                     "type": "opencollective",
@@ -18198,7 +18822,6 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/wcwidth/-/wcwidth-1.0.1.tgz",
             "integrity": "sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==",
-            "dev": true,
             "dependencies": {
                 "defaults": "^1.0.3"
             }
@@ -18213,7 +18836,6 @@
             "version": "3.3.2",
             "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.3.2.tgz",
             "integrity": "sha512-3pRGuxRF5gpuZc0W+EpwQRmCD7gRqcDOMt688KmdlDAgAyaB1XlN0zq2njfDNm44XVdIouE7pZ6GzbdyH47uIQ==",
-            "dev": true,
             "engines": {
                 "node": ">= 8"
             }
@@ -18889,7 +19511,6 @@
             "version": "3.22.4",
             "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.4.tgz",
             "integrity": "sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==",
-            "dev": true,
             "funding": {
                 "url": "https://github.com/sponsors/colinhacks"
             }
diff --git a/frontend/package.json b/frontend/package.json
index 71124ec..37b4d8e 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -23,6 +23,7 @@
         "@radix-ui/react-separator": "^1.0.3",
         "@radix-ui/react-slot": "^1.0.2",
         "@strapi/blocks-react-renderer": "^1.0.0",
+        "add": "^2.0.6",
         "chart.js": "^4.4.1",
         "chartjs-adapter-luxon": "^1.3.1",
         "class-variance-authority": "^0.7.0",
@@ -37,6 +38,7 @@
         "ol": "^8.2.0",
         "ol-ext": "^4.0.14",
         "ol-mapbox-style": "^12.2.0",
+        "pagination": "^0.4.6",
         "qs": "^6.11.2",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
@@ -44,6 +46,7 @@
         "react-markdown": "^9.0.1",
         "react-plotly.js": "^2.6.0",
         "satellite.js": "^5.0.0",
+        "shadcn-ui": "^0.8.0",
         "tailwind-merge": "^2.2.0",
         "tailwindcss-animate": "^1.0.7",
         "three": "^0.161.0",
diff --git a/frontend/src/__generated__/gql.ts b/frontend/src/__generated__/gql.ts
index aa31062..3d27c28 100644
--- a/frontend/src/__generated__/gql.ts
+++ b/frontend/src/__generated__/gql.ts
@@ -14,13 +14,13 @@ import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/
  */
 const documents = {
     "query ArticleWithSlug($articlesFilters: ArticleFiltersInput) {\n    articles(filters: $articlesFilters) {\n      data {\n        attributes {\n          author {\n            data {\n              attributes {\n                name\n                avatar {\n                  data {\n                    attributes {\n                      url\n                    }\n                  }\n                }\n              }\n            }\n          }\n          body\n          coverImage {\n            data {\n              attributes {\n                url\n              }\n            }\n          }\n          datePublished\n          subtitle\n          title\n        }\n      }\n    }\n  }\n  \n  ": types.ArticleWithSlugDocument,
-    "\nquery GET_ARTICLES {\n    articles(sort: [\"datePublished:desc\"]) {\n        data {\n            id\n            attributes {\n                author {\n                    data {\n                        attributes {\n                            name\n                            avatar {\n                                data {\n                                    attributes {\n                                        url\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n                title\n                datePublished\n                body\n                coverImage {\n                    data {\n                        attributes {\n                            url\n                        }\n                    }\n                }\n                createdAt\n                publishedAt\n                slug\n                subtitle\n                Tag\n            }\n        }\n    }\n}\n": types.Get_ArticlesDocument,
     "\nquery MostRecentImages {\n    mostRecentImages(sort: [\"publishedAt:desc\"]) {\n      data {\n        attributes {\n          mostRecentImage {\n            data {\n                attributes {\n                    url\n                }\n            }\n          }\n          satellite {\n            data {\n              attributes {\n                catalogNumberNORAD\n                }\n              }\n            }\n            createdAt\n            updatedAt\n            publishedAt\n          }\n        }\n    }\n}\n\n": types.MostRecentImagesDocument,
     "\nquery Projects($projectFilters: ProjectFiltersInput) {\n  projects(filters: $projectFilters) {\n    data {\n      attributes {\n        title\n        description\n        article\n        satellites {\n          data {\n            id\n            attributes {\n              name\n              previewImage {\n                data {\n                  attributes {\n                    url\n                  }\n                }\n              }\n            }\n          }\n        }\n        slug\n        coverImage {\n          data {\n            id\n            attributes {\n              url\n            }\n          }\n        }\n      }\n    }\n  }\n}": types.ProjectsDocument,
     "\n query GET_PROJECTS {\n    projects(sort: [\"publishedAt:desc\"]) {\n        data {\n          id\n          attributes {\n            title\n            article\n            satellites {\n              data {\n                attributes {\n                  catalogNumberNORAD\n                }\n              }\n            }\n            slug\n            coverImage {\n              data {\n                attributes {\n                  url\n                }\n              }\n            }\n            updatedAt\n            publishedAt\n            createdAt\n            description\n          }\n        }\n      }\n  }": types.Get_ProjectsDocument,
     "query GET_SATELLITE_INFO($filters: SatelliteFiltersInput) {\n        satellites(filters: $filters) {\n          data {\n              id\n              attributes {\n                  celestrakURL\n                  catalogNumberNORAD\n                  content\n                  name\n                projects {\n                  data {\n                    attributes {\n                      title\n                      coverImage {\n                        data {\n                          attributes {\n                            url\n                          }\n                        }\n                      }\n                      slug\n                    }\n                    id\n                  }\n                }\n              }\n          }\n        }\n      }\n  ": types.Get_Satellite_InfoDocument,
     "\nquery GET_SATELLITES {\n    satellites {\n      data {\n        id\n        attributes {\n          celestrakURL\n          catalogNumberNORAD\n          name\n          previewImage {\n            data {\n              attributes {\n                url\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n": types.Get_SatellitesDocument,
     "query Satellites($filters: SatelliteFiltersInput) {\n    satellites(filters: $filters) {\n      data {\n        attributes {\n          celestrakURL\n          catalogNumberNORAD\n        }\n      }\n    }\n  }\n  ": types.SatellitesDocument,
+    "\nquery GET_ARTICLES($pagination: PaginationArg) {\n    articles(sort: [\"datePublished:desc\"], pagination: $pagination) {\n        data {\n            id\n            attributes {\n                author {\n                    data {\n                        attributes {\n                            name\n                            avatar {\n                                data {\n                                    attributes {\n                                        url\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n                title\n                datePublished\n                body\n                coverImage {\n                    data {\n                        attributes {\n                            url\n                        }\n                    }\n                }\n                createdAt\n                publishedAt\n                slug\n                subtitle\n                Tag\n            }\n        }\n    }\n}\n": types.Get_ArticlesDocument,
 };
 
 /**
@@ -41,10 +41,6 @@ export function gql(source: string): unknown;
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(source: "query ArticleWithSlug($articlesFilters: ArticleFiltersInput) {\n    articles(filters: $articlesFilters) {\n      data {\n        attributes {\n          author {\n            data {\n              attributes {\n                name\n                avatar {\n                  data {\n                    attributes {\n                      url\n                    }\n                  }\n                }\n              }\n            }\n          }\n          body\n          coverImage {\n            data {\n              attributes {\n                url\n              }\n            }\n          }\n          datePublished\n          subtitle\n          title\n        }\n      }\n    }\n  }\n  \n  "): (typeof documents)["query ArticleWithSlug($articlesFilters: ArticleFiltersInput) {\n    articles(filters: $articlesFilters) {\n      data {\n        attributes {\n          author {\n            data {\n              attributes {\n                name\n                avatar {\n                  data {\n                    attributes {\n                      url\n                    }\n                  }\n                }\n              }\n            }\n          }\n          body\n          coverImage {\n            data {\n              attributes {\n                url\n              }\n            }\n          }\n          datePublished\n          subtitle\n          title\n        }\n      }\n    }\n  }\n  \n  "];
-/**
- * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
- */
-export function gql(source: "\nquery GET_ARTICLES {\n    articles(sort: [\"datePublished:desc\"]) {\n        data {\n            id\n            attributes {\n                author {\n                    data {\n                        attributes {\n                            name\n                            avatar {\n                                data {\n                                    attributes {\n                                        url\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n                title\n                datePublished\n                body\n                coverImage {\n                    data {\n                        attributes {\n                            url\n                        }\n                    }\n                }\n                createdAt\n                publishedAt\n                slug\n                subtitle\n                Tag\n            }\n        }\n    }\n}\n"): (typeof documents)["\nquery GET_ARTICLES {\n    articles(sort: [\"datePublished:desc\"]) {\n        data {\n            id\n            attributes {\n                author {\n                    data {\n                        attributes {\n                            name\n                            avatar {\n                                data {\n                                    attributes {\n                                        url\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n                title\n                datePublished\n                body\n                coverImage {\n                    data {\n                        attributes {\n                            url\n                        }\n                    }\n                }\n                createdAt\n                publishedAt\n                slug\n                subtitle\n                Tag\n            }\n        }\n    }\n}\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
@@ -69,6 +65,10 @@ export function gql(source: "\nquery GET_SATELLITES {\n    satellites {\n      d
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(source: "query Satellites($filters: SatelliteFiltersInput) {\n    satellites(filters: $filters) {\n      data {\n        attributes {\n          celestrakURL\n          catalogNumberNORAD\n        }\n      }\n    }\n  }\n  "): (typeof documents)["query Satellites($filters: SatelliteFiltersInput) {\n    satellites(filters: $filters) {\n      data {\n        attributes {\n          celestrakURL\n          catalogNumberNORAD\n        }\n      }\n    }\n  }\n  "];
+/**
+ * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
+ */
+export function gql(source: "\nquery GET_ARTICLES($pagination: PaginationArg) {\n    articles(sort: [\"datePublished:desc\"], pagination: $pagination) {\n        data {\n            id\n            attributes {\n                author {\n                    data {\n                        attributes {\n                            name\n                            avatar {\n                                data {\n                                    attributes {\n                                        url\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n                title\n                datePublished\n                body\n                coverImage {\n                    data {\n                        attributes {\n                            url\n                        }\n                    }\n                }\n                createdAt\n                publishedAt\n                slug\n                subtitle\n                Tag\n            }\n        }\n    }\n}\n"): (typeof documents)["\nquery GET_ARTICLES($pagination: PaginationArg) {\n    articles(sort: [\"datePublished:desc\"], pagination: $pagination) {\n        data {\n            id\n            attributes {\n                author {\n                    data {\n                        attributes {\n                            name\n                            avatar {\n                                data {\n                                    attributes {\n                                        url\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n                title\n                datePublished\n                body\n                coverImage {\n                    data {\n                        attributes {\n                            url\n                        }\n                    }\n                }\n                createdAt\n                publishedAt\n                slug\n                subtitle\n                Tag\n            }\n        }\n    }\n}\n"];
 
 export function gql(source: string) {
   return (documents as any)[source] ?? {};
diff --git a/frontend/src/__generated__/graphql.ts b/frontend/src/__generated__/graphql.ts
index 7ae870b..0680e98 100644
--- a/frontend/src/__generated__/graphql.ts
+++ b/frontend/src/__generated__/graphql.ts
@@ -1402,11 +1402,6 @@ export type ArticleWithSlugQueryVariables = Exact<{
 
 export type ArticleWithSlugQuery = { __typename?: 'Query', articles?: { __typename?: 'ArticleEntityResponseCollection', data: Array<{ __typename?: 'ArticleEntity', attributes?: { __typename?: 'Article', body: any, datePublished: any, subtitle?: string | null, title: string, author?: { __typename?: 'AuthorEntityResponse', data?: { __typename?: 'AuthorEntity', attributes?: { __typename?: 'Author', name: string, avatar?: { __typename?: 'UploadFileEntityResponse', data?: { __typename?: 'UploadFileEntity', attributes?: { __typename?: 'UploadFile', url: string } | null } | null } | null } | null } | null } | null, coverImage?: { __typename?: 'UploadFileEntityResponse', data?: { __typename?: 'UploadFileEntity', attributes?: { __typename?: 'UploadFile', url: string } | null } | null } | null } | null }> } | null };
 
-export type Get_ArticlesQueryVariables = Exact<{ [key: string]: never; }>;
-
-
-export type Get_ArticlesQuery = { __typename?: 'Query', articles?: { __typename?: 'ArticleEntityResponseCollection', data: Array<{ __typename?: 'ArticleEntity', id?: string | null, attributes?: { __typename?: 'Article', title: string, datePublished: any, body: any, createdAt?: any | null, publishedAt?: any | null, slug: string, subtitle?: string | null, Tag?: Enum_Article_Tag | null, author?: { __typename?: 'AuthorEntityResponse', data?: { __typename?: 'AuthorEntity', attributes?: { __typename?: 'Author', name: string, avatar?: { __typename?: 'UploadFileEntityResponse', data?: { __typename?: 'UploadFileEntity', attributes?: { __typename?: 'UploadFile', url: string } | null } | null } | null } | null } | null } | null, coverImage?: { __typename?: 'UploadFileEntityResponse', data?: { __typename?: 'UploadFileEntity', attributes?: { __typename?: 'UploadFile', url: string } | null } | null } | null } | null }> } | null };
-
 export type MostRecentImagesQueryVariables = Exact<{ [key: string]: never; }>;
 
 
@@ -1443,12 +1438,19 @@ export type SatellitesQueryVariables = Exact<{
 
 export type SatellitesQuery = { __typename?: 'Query', satellites?: { __typename?: 'SatelliteEntityResponseCollection', data: Array<{ __typename?: 'SatelliteEntity', attributes?: { __typename?: 'Satellite', celestrakURL?: string | null, catalogNumberNORAD?: string | null } | null }> } | null };
 
+export type Get_ArticlesQueryVariables = Exact<{
+  pagination?: InputMaybe<PaginationArg>;
+}>;
+
+
+export type Get_ArticlesQuery = { __typename?: 'Query', articles?: { __typename?: 'ArticleEntityResponseCollection', data: Array<{ __typename?: 'ArticleEntity', id?: string | null, attributes?: { __typename?: 'Article', title: string, datePublished: any, body: any, createdAt?: any | null, publishedAt?: any | null, slug: string, subtitle?: string | null, Tag?: Enum_Article_Tag | null, author?: { __typename?: 'AuthorEntityResponse', data?: { __typename?: 'AuthorEntity', attributes?: { __typename?: 'Author', name: string, avatar?: { __typename?: 'UploadFileEntityResponse', data?: { __typename?: 'UploadFileEntity', attributes?: { __typename?: 'UploadFile', url: string } | null } | null } | null } | null } | null } | null, coverImage?: { __typename?: 'UploadFileEntityResponse', data?: { __typename?: 'UploadFileEntity', attributes?: { __typename?: 'UploadFile', url: string } | null } | null } | null } | null }> } | null };
+
 
 export const ArticleWithSlugDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ArticleWithSlug"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"articlesFilters"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"ArticleFiltersInput"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"articles"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"filters"},"value":{"kind":"Variable","name":{"kind":"Name","value":"articlesFilters"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"author"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"avatar"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"body"}},{"kind":"Field","name":{"kind":"Name","value":"coverImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"datePublished"}},{"kind":"Field","name":{"kind":"Name","value":"subtitle"}},{"kind":"Field","name":{"kind":"Name","value":"title"}}]}}]}}]}}]}}]} as unknown as DocumentNode<ArticleWithSlugQuery, ArticleWithSlugQueryVariables>;
-export const Get_ArticlesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GET_ARTICLES"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"articles"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"sort"},"value":{"kind":"ListValue","values":[{"kind":"StringValue","value":"datePublished:desc","block":false}]}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"author"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"avatar"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"datePublished"}},{"kind":"Field","name":{"kind":"Name","value":"body"}},{"kind":"Field","name":{"kind":"Name","value":"coverImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"publishedAt"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"subtitle"}},{"kind":"Field","name":{"kind":"Name","value":"Tag"}}]}}]}}]}}]}}]} as unknown as DocumentNode<Get_ArticlesQuery, Get_ArticlesQueryVariables>;
 export const MostRecentImagesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"MostRecentImages"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"mostRecentImages"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"sort"},"value":{"kind":"ListValue","values":[{"kind":"StringValue","value":"publishedAt:desc","block":false}]}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"mostRecentImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"satellite"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"catalogNumberNORAD"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}},{"kind":"Field","name":{"kind":"Name","value":"publishedAt"}}]}}]}}]}}]}}]} as unknown as DocumentNode<MostRecentImagesQuery, MostRecentImagesQueryVariables>;
 export const ProjectsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Projects"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"projectFilters"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"ProjectFiltersInput"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"projects"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"filters"},"value":{"kind":"Variable","name":{"kind":"Name","value":"projectFilters"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"article"}},{"kind":"Field","name":{"kind":"Name","value":"satellites"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"previewImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"coverImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}}]}}]}}]}}]}}]} as unknown as DocumentNode<ProjectsQuery, ProjectsQueryVariables>;
 export const Get_ProjectsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GET_PROJECTS"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"projects"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"sort"},"value":{"kind":"ListValue","values":[{"kind":"StringValue","value":"publishedAt:desc","block":false}]}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"article"}},{"kind":"Field","name":{"kind":"Name","value":"satellites"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"catalogNumberNORAD"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"coverImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}},{"kind":"Field","name":{"kind":"Name","value":"publishedAt"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"description"}}]}}]}}]}}]}}]} as unknown as DocumentNode<Get_ProjectsQuery, Get_ProjectsQueryVariables>;
 export const Get_Satellite_InfoDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GET_SATELLITE_INFO"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"filters"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"SatelliteFiltersInput"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"satellites"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"filters"},"value":{"kind":"Variable","name":{"kind":"Name","value":"filters"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"celestrakURL"}},{"kind":"Field","name":{"kind":"Name","value":"catalogNumberNORAD"}},{"kind":"Field","name":{"kind":"Name","value":"content"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"projects"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"coverImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"Field","name":{"kind":"Name","value":"id"}}]}}]}}]}}]}}]}}]}}]} as unknown as DocumentNode<Get_Satellite_InfoQuery, Get_Satellite_InfoQueryVariables>;
 export const Get_SatellitesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GET_SATELLITES"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"satellites"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"celestrakURL"}},{"kind":"Field","name":{"kind":"Name","value":"catalogNumberNORAD"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"previewImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}}]}}]}}]}}]}}]} as unknown as DocumentNode<Get_SatellitesQuery, Get_SatellitesQueryVariables>;
-export const SatellitesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Satellites"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"filters"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"SatelliteFiltersInput"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"satellites"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"filters"},"value":{"kind":"Variable","name":{"kind":"Name","value":"filters"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"celestrakURL"}},{"kind":"Field","name":{"kind":"Name","value":"catalogNumberNORAD"}}]}}]}}]}}]}}]} as unknown as DocumentNode<SatellitesQuery, SatellitesQueryVariables>;
\ No newline at end of file
+export const SatellitesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Satellites"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"filters"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"SatelliteFiltersInput"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"satellites"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"filters"},"value":{"kind":"Variable","name":{"kind":"Name","value":"filters"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"celestrakURL"}},{"kind":"Field","name":{"kind":"Name","value":"catalogNumberNORAD"}}]}}]}}]}}]}}]} as unknown as DocumentNode<SatellitesQuery, SatellitesQueryVariables>;
+export const Get_ArticlesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GET_ARTICLES"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"pagination"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"PaginationArg"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"articles"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"sort"},"value":{"kind":"ListValue","values":[{"kind":"StringValue","value":"datePublished:desc","block":false}]}},{"kind":"Argument","name":{"kind":"Name","value":"pagination"},"value":{"kind":"Variable","name":{"kind":"Name","value":"pagination"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"author"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"avatar"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"datePublished"}},{"kind":"Field","name":{"kind":"Name","value":"body"}},{"kind":"Field","name":{"kind":"Name","value":"coverImage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"url"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"publishedAt"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"subtitle"}},{"kind":"Field","name":{"kind":"Name","value":"Tag"}}]}}]}}]}}]}}]} as unknown as DocumentNode<Get_ArticlesQuery, Get_ArticlesQueryVariables>;
\ No newline at end of file
diff --git a/frontend/src/app/blog/blogDataCards.tsx b/frontend/src/app/blog/blogDataCards.tsx
new file mode 100644
index 0000000..7c260b8
--- /dev/null
+++ b/frontend/src/app/blog/blogDataCards.tsx
@@ -0,0 +1,50 @@
+export const runtime = "edge";
+import FullBlogCard from "@/components/fullBlogCard";
+import BlogpageButtons from "@/components/BlogpageButtons";
+import { BlogPost } from "./page";
+
+export default async function BlogDataCards({
+    articles,
+}: {
+    articles: BlogPost[] | null;
+}) {
+    if (articles === null || articles === undefined) {
+        return (
+            <div>
+                <h1>There are no articles to display</h1>
+            </div>
+        );
+    }
+
+    return (
+        <div className="flex w-3/4 flex-row flex-wrap items-center justify-center self-center">
+            {articles.map((article: any) => {
+                return (
+                    <div
+                        key={article.id}
+                        className={
+                            article.firstArticle
+                                ? "flex w-full flex-col items-center justify-center"
+                                : "flex w-1/3 flex-col items-center justify-center"
+                        }
+                    >
+                        <FullBlogCard
+                            key={article.id} // A unique ID for each blog post
+                            firstArticle={article.firstArticle}
+                            content={article.content}
+                            coverImage={article.coverImage}
+                            datePublished={article.datePublished}
+                            tag={article.tag}
+                            HOST_URL={article.HOST_URL}
+                            authorName={article.authorName}
+                            avatarURL={article.avatarURL}
+                            slug={article.slug}
+                            title={article.title}
+                        />{" "}
+                        {article.firstArticle ? <BlogpageButtons /> : null}
+                    </div>
+                );
+            })}
+        </div>
+    );
+}
diff --git a/frontend/src/app/blog/page.tsx b/frontend/src/app/blog/page.tsx
index 06275cc..a1d0a95 100644
--- a/frontend/src/app/blog/page.tsx
+++ b/frontend/src/app/blog/page.tsx
@@ -1,148 +1,41 @@
-export const runtime = "edge";
+import BlogPaginator from "@/components/BlogPaginator";
+import BlogDataCards from "./blogDataCards";
 import { BlocksContent } from "@strapi/blocks-react-renderer";
-import { getClient } from "@/lib/ApolloClient";
-import { gql } from "@/__generated__/gql";
-import FullBlogCard from "@/components/fullBlogCard";
-import BlogpageButtons from "@/components/BlogpageButtons";
-import { JSX } from "react";
-
-const HOST_URL = process.env.HOST_URL;
-
-const GET_ARTICLES = gql(`
-query GET_ARTICLES {
-    articles(sort: ["datePublished:desc"]) {
-        data {
-            id
-            attributes {
-                author {
-                    data {
-                        attributes {
-                            name
-                            avatar {
-                                data {
-                                    attributes {
-                                        url
-                                    }
-                                }
-                            }
-                        }
-                    }
-                }
-                title
-                datePublished
-                body
-                coverImage {
-                    data {
-                        attributes {
-                            url
-                        }
-                    }
-                }
-                createdAt
-                publishedAt
-                slug
-                subtitle
-                Tag
-            }
-        }
-    }
+import { Enum_Article_Tag } from "@/__generated__/graphql";
+import fetchArticlePages from "@/lib/data/fetchArticleInfo";
+
+export interface BlogPost {
+    key: string | null | undefined;
+    firstArticle?: boolean | null | undefined;
+    title: string | undefined;
+    content: BlocksContent; // Or a more appropriate type if your content is structured
+    coverImage?: string; // Optional cover image
+    datePublished: any;
+    tag?: Enum_Article_Tag | null | undefined; // Optional tag
+    HOST_URL?: string; // It's common to keep the host URL separate from post data
+    authorName?: string;
+    avatarURL?: string; // Optional avatar URL
+    slug: string | undefined;
 }
-`);
 
-export default async function BlogPage() {
-    const graphqlData = await getClient().query({
-        query: GET_ARTICLES,
-    });
+export default async function BlogPage({
+    searchParams,
+}: {
+    searchParams?: { [key: string]: string | undefined };
+}) {
+    const page = searchParams?.page;
+    const currentPage = parseInt(page ?? "1", 10);
 
-    if (
-        graphqlData.data === null ||
-        graphqlData.data === undefined ||
-        graphqlData.data.articles === undefined ||
-        graphqlData.data.articles === null
-    ) {
-        return <div>There are no articles to show.</div>;
-    }
-
-    let firstArticle = true;
-    let articleList: JSX.Element[] = [];
+    const articles = (await fetchArticlePages({
+        currentPage: currentPage,
+        pageSize: 7,
+    })) as BlogPost[];
 
     return (
-        <div className="flex flex-col items-center justify-center">
-            {graphqlData.data.articles.data.map((article) => {
-                let avatarURL =
-                    article?.attributes?.author?.data?.attributes?.avatar?.data
-                        ?.attributes?.url;
-
-                if (HOST_URL && avatarURL != undefined) {
-                    avatarURL = HOST_URL + avatarURL;
-                }
-
-                const authorName =
-                    article?.attributes?.author?.data?.attributes?.name;
-                const tag = article?.attributes?.Tag;
-                const datePublished = article?.attributes?.datePublished;
-                let coverImage =
-                    article?.attributes?.coverImage?.data?.attributes?.url;
-                if (HOST_URL && coverImage != undefined) {
-                    coverImage = HOST_URL + coverImage;
-                }
-                let content: BlocksContent = article?.attributes?.body ?? [];
-
-                const title = article?.attributes?.title;
-
-                for (const block of content) {
-                    if (block.type === "paragraph") {
-                        content = [block];
-                        break;
-                    }
-                }
-
-                if (firstArticle) {
-                    firstArticle = false;
-                    return (
-                        <div
-                            key={article.id}
-                            className="flex w-3/4 flex-col items-center justify-center"
-                        >
-                            <FullBlogCard
-                                key={article.id} // A unique ID for each blog post
-                                firstArticle={true}
-                                content={content}
-                                coverImage={coverImage}
-                                datePublished={datePublished}
-                                tag={tag}
-                                HOST_URL={HOST_URL}
-                                authorName={authorName}
-                                avatarURL={avatarURL}
-                                slug={article?.attributes?.slug}
-                                title={title}
-                            />
-                            {<BlogpageButtons />}
-                        </div>
-                    );
-                } else {
-                    articleList.push(
-                        <FullBlogCard
-                            key={article.id} // A unique ID for each blog post
-                            firstArticle={false}
-                            content={content}
-                            coverImage={coverImage}
-                            datePublished={datePublished}
-                            tag={tag}
-                            HOST_URL={HOST_URL}
-                            authorName={authorName}
-                            avatarURL={avatarURL}
-                            slug={article?.attributes?.slug}
-                            title={title}
-                        />,
-                    );
-                }
-            })}
-            <div className="flex w-4/5 flex-row flex-wrap items-center justify-center">
-                {articleList.map((article) => {
-                    return article;
-                })}
-            </div>
+        <div className="just flex flex-col content-center justify-center">
+            {/* <BlogDataCards articles={articleCache[currentPage]} /> */}
+            <BlogDataCards articles={articles} />
+            <BlogPaginator />
         </div>
     );
 }
diff --git a/frontend/src/components/BlogPaginator.tsx b/frontend/src/components/BlogPaginator.tsx
new file mode 100644
index 0000000..10d5c6b
--- /dev/null
+++ b/frontend/src/components/BlogPaginator.tsx
@@ -0,0 +1,57 @@
+"use client";
+
+import {
+    Pagination,
+    PaginationContent,
+    PaginationEllipsis,
+    PaginationItem,
+    PaginationLink,
+    PaginationNext,
+    PaginationPrevious,
+} from "./ui/pagination";
+import { useSearchParams } from "next/navigation";
+
+export default function BlogPaginator() {
+    const searchParams = useSearchParams();
+
+    const page = searchParams.get("page");
+    let currentPage = parseInt(page ?? "1", 10);
+    currentPage = currentPage > 1 ? currentPage : 1;
+
+    return (
+        <Pagination className="my-4">
+            <PaginationContent>
+                <PaginationItem>
+                    <PaginationPrevious
+                        href={
+                            "?page=" + (currentPage > 1 ? currentPage - 1 : 1)
+                        }
+                    />
+                </PaginationItem>
+                {currentPage > 1 ? (
+                    <PaginationItem>
+                        <PaginationLink href={"?page=" + (currentPage - 1)}>
+                            {currentPage - 1}
+                        </PaginationLink>
+                    </PaginationItem>
+                ) : null}
+                <PaginationItem>
+                    <PaginationLink href={"?page=" + currentPage} isActive>
+                        {currentPage}
+                    </PaginationLink>
+                </PaginationItem>
+                <PaginationItem>
+                    <PaginationLink href={"?page=" + (currentPage + 1)}>
+                        {currentPage + 1}
+                    </PaginationLink>
+                </PaginationItem>
+                <PaginationItem>
+                    <PaginationEllipsis />
+                </PaginationItem>
+                <PaginationItem>
+                    <PaginationNext href={"?page=" + (currentPage + 1)} />
+                </PaginationItem>
+            </PaginationContent>
+        </Pagination>
+    );
+}
diff --git a/frontend/src/components/BlogpageButtons.tsx b/frontend/src/components/BlogpageButtons.tsx
index 8b7cd40..a403165 100644
--- a/frontend/src/components/BlogpageButtons.tsx
+++ b/frontend/src/components/BlogpageButtons.tsx
@@ -8,19 +8,19 @@ export default function BlogpageButtons() {
     return (
         <div className="m-10 flex w-1/3 flex-row items-center justify-center gap-4">
             <Button
-                className={`hover:bg-ntnuBlue w-1/4 min-w-20 border border-white ${activeButton === "All Posts" ? "bg-ntnuBlue" : "bg-transparent"}`}
+                className={`w-1/4 min-w-20 border border-white hover:bg-primary ${activeButton === "All Posts" ? "bg-ntnuBlue" : "bg-transparent"}`}
                 onClick={() => setActiveButton("All Posts")}
             >
                 All Posts
             </Button>
             <Button
-                className={`hover:bg-ntnuBlue w-1/4 min-w-20 border border-white ${activeButton === "Updates" ? "bg-ntnuBlue" : "bg-transparent"}`}
+                className={`w-1/4 min-w-20 border border-white hover:bg-primary ${activeButton === "Updates" ? "bg-ntnuBlue" : "bg-transparent"}`}
                 onClick={() => setActiveButton("Updates")}
             >
                 Updates
             </Button>
             <Button
-                className={`hover:bg-ntnuBlue w-1/4 min-w-20 border border-white ${activeButton === "News" ? "bg-ntnuBlue" : "bg-transparent"}`}
+                className={`w-1/4 min-w-20 border border-white hover:bg-primary ${activeButton === "News" ? "bg-ntnuBlue" : "bg-transparent"}`}
                 onClick={() => setActiveButton("News")}
             >
                 News
diff --git a/frontend/src/components/fullBlogCard.tsx b/frontend/src/components/fullBlogCard.tsx
index f614833..20a0aef 100644
--- a/frontend/src/components/fullBlogCard.tsx
+++ b/frontend/src/components/fullBlogCard.tsx
@@ -55,7 +55,7 @@ export default function FullBlogCard(article: BlogPost) {
                     )}
                     <div className="m-5">
                         <div className="flex">
-                            <p className="bg-ntnuBlue w-fit rounded-md p-2 text-center text-xs text-white">
+                            <p className="ww-fit rounded-md bg-primary p-2 text-center text-xs text-white">
                                 {article.tag ? article.tag : "General"}
                             </p>
                             <p className="w-fit p-2 text-center text-xs text-white">
@@ -74,7 +74,7 @@ export default function FullBlogCard(article: BlogPost) {
                     </div>
                 </BlogCardContent>
             </BlogCardHeader>
-            <Link href={"/blog/" + article.slug} className="text-ntnuBlue m-5">
+            <Link href={"/blog/" + article.slug} className="m-5 text-primary">
                 Read more →
             </Link>
         </BlogCard>
diff --git a/frontend/src/components/ui/pagination.tsx b/frontend/src/components/ui/pagination.tsx
new file mode 100644
index 0000000..02ec9f4
--- /dev/null
+++ b/frontend/src/components/ui/pagination.tsx
@@ -0,0 +1,117 @@
+import * as React from "react";
+import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
+
+import { cn } from "@/lib/utils";
+import { ButtonProps, buttonVariants } from "@/components/ui/button";
+
+const Pagination = ({ className, ...props }: React.ComponentProps<"nav">) => (
+    <nav
+        role="navigation"
+        aria-label="pagination"
+        className={cn("mx-auto flex w-full justify-center", className)}
+        {...props}
+    />
+);
+Pagination.displayName = "Pagination";
+
+const PaginationContent = React.forwardRef<
+    HTMLUListElement,
+    React.ComponentProps<"ul">
+>(({ className, ...props }, ref) => (
+    <ul
+        ref={ref}
+        className={cn("flex flex-row items-center gap-1", className)}
+        {...props}
+    />
+));
+PaginationContent.displayName = "PaginationContent";
+
+const PaginationItem = React.forwardRef<
+    HTMLLIElement,
+    React.ComponentProps<"li">
+>(({ className, ...props }, ref) => (
+    <li ref={ref} className={cn("", className)} {...props} />
+));
+PaginationItem.displayName = "PaginationItem";
+
+type PaginationLinkProps = {
+    isActive?: boolean;
+} & Pick<ButtonProps, "size"> &
+    React.ComponentProps<"a">;
+
+const PaginationLink = ({
+    className,
+    isActive,
+    size = "icon",
+    ...props
+}: PaginationLinkProps) => (
+    <a
+        aria-current={isActive ? "page" : undefined}
+        className={cn(
+            buttonVariants({
+                variant: isActive ? "outline" : "ghost",
+                size,
+            }),
+            className,
+        )}
+        {...props}
+    />
+);
+PaginationLink.displayName = "PaginationLink";
+
+const PaginationPrevious = ({
+    className,
+    ...props
+}: React.ComponentProps<typeof PaginationLink>) => (
+    <PaginationLink
+        aria-label="Go to previous page"
+        size="default"
+        className={cn("gap-1 pl-2.5", className)}
+        {...props}
+    >
+        <ChevronLeft className="h-4 w-4" />
+        <span>Previous</span>
+    </PaginationLink>
+);
+PaginationPrevious.displayName = "PaginationPrevious";
+
+const PaginationNext = ({
+    className,
+    ...props
+}: React.ComponentProps<typeof PaginationLink>) => (
+    <PaginationLink
+        aria-label="Go to next page"
+        size="default"
+        className={cn("gap-1 pr-2.5", className)}
+        {...props}
+    >
+        <span>Next</span>
+        <ChevronRight className="h-4 w-4" />
+    </PaginationLink>
+);
+PaginationNext.displayName = "PaginationNext";
+
+const PaginationEllipsis = ({
+    className,
+    ...props
+}: React.ComponentProps<"span">) => (
+    <span
+        aria-hidden
+        className={cn("flex h-9 w-9 items-center justify-center", className)}
+        {...props}
+    >
+        <MoreHorizontal className="h-4 w-4" />
+        <span className="sr-only">More pages</span>
+    </span>
+);
+PaginationEllipsis.displayName = "PaginationEllipsis";
+
+export {
+    Pagination,
+    PaginationContent,
+    PaginationEllipsis,
+    PaginationItem,
+    PaginationLink,
+    PaginationNext,
+    PaginationPrevious,
+};
diff --git a/frontend/src/lib/data/fetchArticleInfo.tsx b/frontend/src/lib/data/fetchArticleInfo.tsx
new file mode 100644
index 0000000..9f2d196
--- /dev/null
+++ b/frontend/src/lib/data/fetchArticleInfo.tsx
@@ -0,0 +1,127 @@
+import { gql } from "@/__generated__/gql";
+import { getClient } from "../ApolloClient";
+import { BlocksContent } from "@strapi/blocks-react-renderer";
+import { Enum_Article_Tag } from "@/__generated__/graphql";
+import { BlogPost } from "@/app/blog/page";
+
+const HOST_URL = process.env.HOST_URL;
+
+const GET_ARTICLES = gql(`
+query GET_ARTICLES($pagination: PaginationArg) {
+    articles(sort: ["datePublished:desc"], pagination: $pagination) {
+        data {
+            id
+            attributes {
+                author {
+                    data {
+                        attributes {
+                            name
+                            avatar {
+                                data {
+                                    attributes {
+                                        url
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+                title
+                datePublished
+                body
+                coverImage {
+                    data {
+                        attributes {
+                            url
+                        }
+                    }
+                }
+                createdAt
+                publishedAt
+                slug
+                subtitle
+                Tag
+            }
+        }
+    }
+}
+`);
+
+export default async function fetchArticlePages({
+    currentPage,
+    pageSize,
+}: {
+    currentPage: number;
+    pageSize: number;
+}) {
+    let firstArticle = true;
+
+    const graphqlData = await getClient().query({
+        query: GET_ARTICLES,
+        variables: {
+            pagination: {
+                pageSize: pageSize,
+                page: currentPage,
+            },
+        },
+    });
+
+    if (
+        graphqlData.data === null ||
+        graphqlData.data === undefined ||
+        graphqlData.data.articles === undefined ||
+        graphqlData.data.articles === null
+    ) {
+        return null;
+    }
+    let articleList: BlogPost[] = [];
+
+    graphqlData.data.articles.data.forEach((article: any) => {
+        let avatarURL: string | undefined =
+            article?.attributes?.author?.data?.attributes?.avatar?.data
+                ?.attributes?.url;
+
+        if (HOST_URL && avatarURL != undefined) {
+            avatarURL = HOST_URL + avatarURL;
+        }
+
+        const authorName: string | undefined =
+            article?.attributes?.author?.data?.attributes?.name;
+        const tag: Enum_Article_Tag | null | undefined =
+            article?.attributes?.Tag;
+        const datePublished: any = article?.attributes?.datePublished;
+        let coverImage: string | undefined =
+            article?.attributes?.coverImage?.data?.attributes?.url;
+        if (HOST_URL && coverImage != undefined) {
+            coverImage = HOST_URL + coverImage;
+        }
+        let content: BlocksContent = article?.attributes?.body ?? [];
+
+        const title: string | undefined = article?.attributes?.title;
+
+        for (const block of content) {
+            if (block.type === "paragraph") {
+                content = [block];
+                break;
+            }
+        }
+
+        articleList.push({
+            key: article.id,
+            firstArticle: firstArticle,
+            title,
+            content,
+            coverImage,
+            datePublished,
+            tag,
+            HOST_URL,
+            authorName,
+            avatarURL,
+            slug: article.attributes.slug,
+        });
+
+        firstArticle = false;
+    });
+
+    return articleList;
+}