Merge branch 'main' into B2B-30

packages/ui/src/makerkit/navigation-config.schema.ts

@@ -29,7 +29,7 @@ const RouteChild = z.object({
 });
 
 const RouteGroup = z.object({
-  label: z.string(),
+  label: z.string().optional(),
   collapsible: z.boolean().optional(),
   collapsed: z.boolean().optional(),
   children: z.array(RouteChild),
@@ -37,12 +37,8 @@ const RouteGroup = z.object({
 });
 
 export const NavigationConfigSchema = z.object({
-  style: z.enum(['custom', 'sidebar', 'header']).default('sidebar'),
-  sidebarCollapsed: z
-    .enum(['false', 'true'])
-    .default('true')
-    .optional()
-    .transform((value) => value === `true`),
+  style: z.enum(['custom', 'sidebar', 'header']).default('custom'),
+  sidebarCollapsed: z.boolean().optional(),
   sidebarCollapsedStyle: z.enum(['offcanvas', 'icon', 'none']).default('icon'),
   routes: z.array(z.union([RouteGroup, Divider])),
 });

packages/ui/src/makerkit/page.tsx

@@ -14,10 +14,6 @@ type PageProps = React.PropsWithChildren<{
   sticky?: boolean;
 }>;
 
-const ENABLE_SIDEBAR_TRIGGER = process.env.NEXT_PUBLIC_ENABLE_SIDEBAR_TRIGGER
-  ? process.env.NEXT_PUBLIC_ENABLE_SIDEBAR_TRIGGER === 'true'
-  : true;
-
 export function Page(props: PageProps) {
   switch (props.style) {
     case 'header':
@@ -79,7 +75,7 @@ function PageWithHeader(props: PageProps) {
   const { Navigation, Children, MobileNavigation } = getSlotsFromPage(props);
 
   return (
-    <div className={cn('flex h-screen flex-1 flex-col', props.className)}>
+    <div className={cn('flex h-screen flex-1 flex-col z-1000', props.className)}>
       <div
         className={
           props.contentContainerClassName ?? 'flex flex-1 flex-col space-y-4'
@@ -87,9 +83,9 @@ function PageWithHeader(props: PageProps) {
       >
         <div
           className={cn(
-            'bg-bg-background border-1 light:border-border dark:border-border dark:shadow-primary/10 flex h-15 items-center justify-between px-4 py-1 lg:justify-start lg:shadow-xs',
+            'bg-bg-background border-1 light:border-border dark:border-border dark:shadow-primary/10 flex h-15 items-center justify-between px-4 py-1 lg:justify-start lg:shadow-xs border-b',
             {
-              'sticky top-0 z-10 backdrop-blur-md': props.sticky ?? true,
+              'sticky top-0 z-1000 backdrop-blur-md': props.sticky ?? true,
             },
           )}
         >
@@ -113,7 +109,10 @@ export function PageBody(
     className?: string;
   }>,
 ) {
-  const className = cn('flex w-full flex-1 flex-col lg:px-4', props.className);
+  const className = cn(
+    'flex w-full flex-1 flex-col space-y-6 lg:px-4',
+    props.className,
+  );
 
   return <div className={className}>{props.children}</div>;
 }
@@ -125,7 +124,7 @@ export function PageNavigation(props: React.PropsWithChildren) {
 export function PageDescription(props: React.PropsWithChildren) {
   return (
     <div className={'flex h-6 items-center'}>
-      <div className={'text-muted-foreground text-xs leading-none font-normal'}>
+      <div className={'text-muted-foreground text-sm leading-none font-normal'}>
         {props.children}
       </div>
     </div>
@@ -153,7 +152,7 @@ export function PageHeader({
   title,
   description,
   className,
-  displaySidebarTrigger = ENABLE_SIDEBAR_TRIGGER,
+  displaySidebarTrigger = false,
 }: React.PropsWithChildren<{
   className?: string;
   title?: string | React.ReactNode;

packages/ui/src/makerkit/version-updater.tsx

@@ -70,7 +70,7 @@ export function VersionUpdater(props: { intervalTimeInSecond?: number }) {
               setDismissed(true);
             }}
           >
-            <Trans i18nKey="common:back" />
+            <Trans i18nKey="common:goBack" />
           </Button>
 
           <Button onClick={() => window.location.reload()}>