refactor: restrict swagger api by user access

components/dashboard/settings/profile/generate-token.tsx

@@ -10,6 +10,8 @@ import { api } from "@/utils/api";
 import { toast } from "sonner";
 import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Label } from "@/components/ui/label";
+import Link from "next/link";
+import { ExternalLinkIcon } from "lucide-react";
 
 export const GenerateToken = () => {
 	const { data, refetch } = api.auth.get.useQuery();
@@ -26,6 +28,19 @@ export const GenerateToken = () => {
 						Generate a token to access the API/CLI
 					</CardDescription>
 				</div>
+				<div className="flex flex-row gap-2 max-sm:flex-wrap items-end">
+					<span className="text-sm font-medium text-muted-foreground">
+						Swagger API:
+					</span>
+					<Link
+						href="/swagger"
+						target="_blank"
+						className="flex flex-row gap-2 items-center"
+					>
+						<span className="text-sm font-medium">View</span>
+						<ExternalLinkIcon className="size-4" />
+					</Link>
+				</div>
 			</CardHeader>
 			<CardContent className="space-y-2">
 				<div className="flex flex-row gap-2 max-sm:flex-wrap justify-end items-end">

pages/swagger.tsx

@@ -1,8 +1,11 @@
+import { appRouter } from "@/server/api/root";
 import { validateRequest } from "@/server/auth/auth";
 import { api } from "@/utils/api";
+import { createServerSideHelpers } from "@trpc/react-query/server";
 import type { GetServerSidePropsContext, NextPage } from "next";
 import dynamic from "next/dynamic";
 import "swagger-ui-react/swagger-ui.css";
+import superjson from "superjson";
 
 const SwaggerUI = dynamic(() => import("swagger-ui-react"), { ssr: false });
 
@@ -18,8 +21,8 @@ const Home: NextPage = () => {
 
 export default Home;
 export async function getServerSideProps(context: GetServerSidePropsContext) {
-	const { user } = await validateRequest(context.req, context.res);
-
+	const { req, res } = context;
+	const { user, session } = await validateRequest(context.req, context.res);
 	if (!user) {
 		return {
 			redirect: {
@@ -28,6 +31,33 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
 			},
 		};
 	}
+	// Fetch data from external API
+	const helpers = createServerSideHelpers({
+		router: appRouter,
+		ctx: {
+			req: req as any,
+			res: res as any,
+			db: null as any,
+			session: session,
+			user: user,
+		},
+		transformer: superjson,
+	});
+	if (user.rol === "user") {
+		const result = await helpers.user.byAuthId.fetch({
+			authId: user.id,
+		});
+
+		if (!result.canAccessToAPI) {
+			return {
+				redirect: {
+					permanent: true,
+					destination: "/",
+				},
+			};
+		}
+	}
+
 	return {
 		props: {},
 	};