diff --git a/packages/lib/server/apiRouteMiddleware.ts b/apps/web/app/api/apiRouteMiddleware.ts
similarity index 76%
rename from packages/lib/server/apiRouteMiddleware.ts
rename to apps/web/app/api/apiRouteMiddleware.ts
index 295e4230c8..d4f33fa528 100644
--- a/packages/lib/server/apiRouteMiddleware.ts
+++ b/apps/web/app/api/apiRouteMiddleware.ts
@@ -1,15 +1,16 @@
 import { captureException } from "@sentry/nextjs";
+import type { Params } from "app/_types";
 import { ApiError } from "next/dist/server/api-utils";
 import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
 
-import { getServerErrorFromUnknown } from "./getServerErrorFromUnknown";
+import { getServerErrorFromUnknown } from "@calcom/lib/server";
 
 export const apiRouteMiddleware =
-  (handler: (req: NextRequest, res?: NextResponse) => Promise<NextResponse>) =>
-  async (req: NextRequest, res: NextResponse) => {
+  (handler: (req: NextRequest, { params }: { params: Params }) => Promise<NextResponse>) =>
+  async (req: NextRequest, { params }: { params: Params }) => {
     try {
-      return await handler(req, res);
+      return await handler(req, { params });
     } catch (error) {
       if (error instanceof ApiError) {
         return NextResponse.json({ message: error.message }, { status: error.statusCode });
diff --git a/apps/web/pages/api/avatar/[uuid].ts b/apps/web/app/api/avatar/[uuid]/route.ts
similarity index 50%
rename from apps/web/pages/api/avatar/[uuid].ts
rename to apps/web/app/api/avatar/[uuid]/route.ts
index 85ef09648e..9b39da2233 100644
--- a/apps/web/pages/api/avatar/[uuid].ts
+++ b/apps/web/app/api/avatar/[uuid]/route.ts
@@ -1,4 +1,7 @@
-import type { NextApiRequest, NextApiResponse } from "next";
+import type { Params } from "app/_types";
+import { apiRouteMiddleware } from "app/api/apiRouteMiddleware";
+import type { NextRequest } from "next/server";
+import { NextResponse } from "next/server";
 import { z } from "zod";
 
 import { AVATAR_FALLBACK } from "@calcom/lib/constants";
@@ -8,22 +11,25 @@ const querySchema = z.object({
   uuid: z.string().transform((objectKey) => objectKey.split(".")[0]),
 });
 
-const handleValidationError = (res: NextApiResponse, error: z.ZodError): void => {
+const handleValidationError = (error: z.ZodError): NextResponse => {
   const errors = error.errors.map((err) => ({
     path: err.path.join("."),
     errorCode: `error.validation.${err.code}`,
   }));
 
-  res.status(400).json({
-    message: "VALIDATION_ERROR",
-    errors,
-  });
+  return NextResponse.json(
+    {
+      message: "VALIDATION_ERROR",
+      errors,
+    },
+    { status: 400 }
+  );
 };
 
-export default async function handler(req: NextApiRequest, res: NextApiResponse) {
-  const result = querySchema.safeParse(req.query);
+async function handler(req: NextRequest, { params }: { params: Params }) {
+  const result = querySchema.safeParse(params);
   if (!result.success) {
-    return handleValidationError(res, result.error);
+    return handleValidationError(result.error);
   }
 
   const { uuid: objectKey } = result.data;
@@ -41,22 +47,22 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     img = data;
   } catch (e) {
     // If anything goes wrong or avatar is not found, use default avatar
-    res.writeHead(302, {
-      Location: AVATAR_FALLBACK,
-    });
-
-    res.end();
-    return;
+    return NextResponse.redirect(AVATAR_FALLBACK, 302);
   }
 
   const decoded = img.toString().replace("data:image/png;base64,", "").replace("data:image/jpeg;base64,", "");
   const imageResp = Buffer.from(decoded, "base64");
 
-  res.writeHead(200, {
-    "Content-Type": "image/png",
-    "Content-Length": imageResp.length,
-    "Cache-Control": "max-age=86400",
+  return new NextResponse(imageResp, {
+    headers: {
+      "Content-Type": "image/png",
+      "Content-Length": imageResp.length.toString(),
+      "Cache-Control": "max-age=86400",
+    },
+    status: 200,
   });
-
-  res.end(imageResp);
 }
+
+const getHandler = apiRouteMiddleware(handler);
+
+export { getHandler as GET };
diff --git a/apps/web/app/api/cancel/route.ts b/apps/web/app/api/cancel/route.ts
index ed7555c564..cb210a3380 100644
--- a/apps/web/app/api/cancel/route.ts
+++ b/apps/web/app/api/cancel/route.ts
@@ -1,10 +1,10 @@
+import { apiRouteMiddleware } from "app/api/apiRouteMiddleware";
 import { cookies, headers } from "next/headers";
 import { NextResponse } from "next/server";
 import type { NextRequest } from "next/server";
 
 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 import handleCancelBooking from "@calcom/features/bookings/lib/handleCancelBooking";
-import { apiRouteMiddleware } from "@calcom/lib/server/apiRouteMiddleware";
 
 import { buildLegacyRequest } from "@lib/buildLegacyCtx";
 
diff --git a/apps/web/app/api/customer-card/route.ts b/apps/web/app/api/customer-card/route.ts
index 9da78df6d7..824fe1adce 100644
--- a/apps/web/app/api/customer-card/route.ts
+++ b/apps/web/app/api/customer-card/route.ts
@@ -1,11 +1,11 @@
 import { cardExamples } from "@pages/api/plain/example-cards";
+import { apiRouteMiddleware } from "app/api/apiRouteMiddleware";
 import { createHmac } from "crypto";
 import { headers } from "next/headers";
 import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
 import { z } from "zod";
 
-import { apiRouteMiddleware } from "@calcom/lib/server/apiRouteMiddleware";
 import { UserRepository } from "@calcom/lib/server/repository/user";
 import { userMetadata } from "@calcom/prisma/zod-utils";
 
diff --git a/apps/web/app/api/plain-hash/route.ts b/apps/web/app/api/plain-hash/route.ts
index ef8f30c33f..9ddb6cfda0 100644
--- a/apps/web/app/api/plain-hash/route.ts
+++ b/apps/web/app/api/plain-hash/route.ts
@@ -1,10 +1,10 @@
+import { apiRouteMiddleware } from "app/api/apiRouteMiddleware";
 import { createHmac } from "crypto";
 import { cookies, headers } from "next/headers";
 import { NextResponse } from "next/server";
 import { z } from "zod";
 
 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
-import { apiRouteMiddleware } from "@calcom/lib/server/apiRouteMiddleware";
 
 import { buildLegacyRequest } from "@lib/buildLegacyCtx";