Update UI layout and update request handler types

The UI layout has been updated to fix full screen display issues and enable class names in Sidebar. Separately, request handler function types have been improved in next route handlers for better flexibility and type safety.

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: {