Merge branch 'dev' into ajnart/feat-million-lint

apps/nextjs/package.json

@@ -39,11 +39,11 @@
     "@mantine/modals": "^7.12.1",
     "@mantine/tiptap": "^7.12.1",
     "@million/lint": "1.0.0-rc.84",
-    "@t3-oss/env-nextjs": "^0.11.0",
-    "@tanstack/react-query": "^5.52.1",
-    "@tanstack/react-query-devtools": "^5.52.1",
-    "@tanstack/react-query-next-experimental": "5.52.1",
-    "@tabler/icons-react": "^3.12.0",
+    "@t3-oss/env-nextjs": "^0.11.1",
+    "@tanstack/react-query": "^5.52.2",
+    "@tanstack/react-query-devtools": "^5.52.2",
+    "@tanstack/react-query-next-experimental": "5.52.2",
+    "@tabler/icons-react": "^3.14.0",
     "@trpc/client": "next",
     "@trpc/next": "next",
     "@trpc/react-query": "next",
@@ -59,7 +59,7 @@
     "glob": "^11.0.0",
     "jotai": "^2.9.3",
     "mantine-react-table": "2.0.0-beta.6",
-    "next": "^14.2.6",
+    "next": "^14.2.7",
     "postcss-preset-mantine": "^1.17.0",
     "prismjs": "^1.29.0",
     "react": "^18.3.1",
@@ -68,22 +68,24 @@
     "react-simple-code-editor": "^0.14.1",
     "sass": "^1.77.8",
     "superjson": "2.2.1",
+    "swagger-ui-react": "^5.17.14",
     "use-deep-compare-effect": "^1.8.1"
   },
   "devDependencies": {
     "@homarr/eslint-config": "workspace:^0.2.0",
     "@homarr/prettier-config": "workspace:^0.1.0",
     "@homarr/tsconfig": "workspace:^0.1.0",
     "@types/chroma-js": "2.4.4",
-    "@types/node": "^20.16.1",
+    "@types/node": "^20.16.2",
     "@types/prismjs": "^1.26.4",
     "@types/react": "^18.3.4",
     "@types/react-dom": "^18.3.0",
+    "@types/swagger-ui-react": "^4.18.3",
     "concurrently": "^8.2.2",
     "eslint": "^9.9.1",
     "node-loader": "^2.0.0",
     "prettier": "^3.3.3",
     "typescript": "^5.5.4"
   },
   "prettier": "@homarr/prettier-config"
-}
+}

apps/nextjs/src/app/[locale]/manage/layout.tsx

@@ -84,6 +84,11 @@ export default async function ManageLayout({ children }: PropsWithChildren) {
           icon: IconBrandDocker,
           href: "/manage/tools/docker",
         },
+        {
+          label: t("items.tools.items.api"),
+          icon: IconPlug,
+          href: "/manage/tools/api",
+        },
         {
           label: t("items.tools.items.logs"),
           icon: IconLogs,

apps/nextjs/src/app/[locale]/manage/tools/api/page.tsx

@@ -0,0 +1,28 @@
+import { getScopedI18n } from "@homarr/translation/server";
+
+// workaround for CSS that cannot be processed by next.js, https://github.com/swagger-api/swagger-ui/issues/10045
+import "./swagger-ui-dark.css";
+import "./swagger-ui-overrides.css";
+import "./swagger-ui.css";
+
+import { headers } from "next/headers";
+import SwaggerUI from "swagger-ui-react";
+
+import { openApiDocument } from "@homarr/api";
+import { extractBaseUrlFromHeaders } from "@homarr/common";
+
+import { createMetaTitle } from "~/metadata";
+
+export async function generateMetadata() {
+  const t = await getScopedI18n("management");
+
+  return {
+    title: createMetaTitle(t("metaTitle")),
+  };
+}
+
+export default function ApiPage() {
+  const document = openApiDocument(extractBaseUrlFromHeaders(headers()));
+
+  return <SwaggerUI spec={document} />;
+}