diff --git a/packages/next/src/routes/index.ts b/packages/next/src/routes/index.ts
index f8edcc5dd..9f07ab0d5 100644
--- a/packages/next/src/routes/index.ts
+++ b/packages/next/src/routes/index.ts
@@ -22,12 +22,12 @@ interface Config<Schema> {
 }
 
 interface HandlerParams<
-  Body extends object,
+  Schema extends z.ZodType | undefined,
   RequireAuth extends boolean | undefined,
 > {
   request: NextRequest;
   user: RequireAuth extends false ? undefined : User;
-  body: Body;
+  body: Schema extends z.ZodType ? z.infer<Schema> : never;
 }
 
 /**
@@ -51,19 +51,17 @@ interface HandlerParams<
  *
  */
 export const enhanceRouteHandler = <
-  Body extends object,
-  Schema extends z.ZodType<Body, z.ZodTypeDef>,
-  Params extends Config<Schema> = Config<Schema>,
+  Body,
+  Params extends Config<z.ZodType<Body, z.ZodTypeDef>>,
 >(
   // Route handler function
   handler:
     | ((
-        params: HandlerParams<z.infer<Schema>, Params['auth']>,
+        params: HandlerParams<Params['schema'], Params['auth']>,
       ) => NextResponse | Response)
     | ((
-        params: HandlerParams<z.infer<Schema>, Params['auth']>,
+        params: HandlerParams<Params['schema'], Params['auth']>,
       ) => Promise<NextResponse | Response>),
-
   // Parameters object
   params?: Params,
 ) => {
diff --git a/packages/ui/src/makerkit/page.tsx b/packages/ui/src/makerkit/page.tsx
index b15b795d2..50c3a7e2b 100644
--- a/packages/ui/src/makerkit/page.tsx
+++ b/packages/ui/src/makerkit/page.tsx
@@ -64,7 +64,7 @@ function PageWithHeader(props: PageProps) {
   const { Navigation, Children, MobileNavigation } = getSlotsFromPage(props);
 
   return (
-    <div className={cn('flex flex-1 flex-col', props.className)}>
+    <div className={cn('flex h-screen flex-1 flex-col', props.className)}>
       <div
         className={
           props.contentContainerClassName ?? 'flex flex-1 flex-col space-y-4'
@@ -87,7 +87,11 @@ function PageWithHeader(props: PageProps) {
           {MobileNavigation}
         </div>
 
-        <div className={'flex flex-col space-y-8 px-4 py-4 lg:container'}>
+        <div
+          className={
+            'flex h-screen flex-1 flex-col space-y-8 px-4 py-4 lg:container'
+          }
+        >
           {Children}
         </div>
       </div>
diff --git a/packages/ui/src/makerkit/sidebar.tsx b/packages/ui/src/makerkit/sidebar.tsx
index 61a9fd064..bfcc0aa6b 100644
--- a/packages/ui/src/makerkit/sidebar.tsx
+++ b/packages/ui/src/makerkit/sidebar.tsx
@@ -26,6 +26,7 @@ export type SidebarConfig = z.infer<typeof NavigationConfigSchema>;
 
 export function Sidebar(props: {
   collapsed?: boolean;
+  className?: string;
   children:
     | React.ReactNode
     | ((props: {
@@ -35,7 +36,7 @@ export function Sidebar(props: {
 }) {
   const [collapsed, setCollapsed] = useState(props.collapsed ?? false);
 
-  const className = getClassNameBuilder()({
+  const className = getClassNameBuilder(props.className ?? '')({
     collapsed,
   });
 
@@ -191,9 +192,14 @@ export function SidebarItem({
   );
 }
 
-function getClassNameBuilder() {
+function getClassNameBuilder(className: string) {
   return cva(
-    ['flex box-content h-screen flex-col relative shadow-sm border-r'],
+    [
+      cn(
+        'flex box-content h-screen flex-col relative shadow-sm border-r',
+        className,
+      ),
+    ],
     {
       variants: {
         collapsed: {