chore: bump version to 3.0.3 in package.json and update dependencies in pnpm-lock.yaml and pnpm-workspace.yaml (#467)

apps/dev-tool/app/components/components/docs-content.tsx

@@ -21,7 +21,7 @@ export function DocsContent({ selectedComponent }: DocsContentProps) {
   return (
     <div className="flex-1 overflow-y-auto">
       <Suspense fallback={<LoadingFallback />}>
-        <div className="p-4">
+        <div>
           <component.component />
         </div>
       </Suspense>

apps/dev-tool/app/components/components/dropdown-menu-story.tsx

@@ -11,7 +11,6 @@ import {
   Edit,
   FileText,
   Folder,
-  Github,
   Image,
   Keyboard,
   LogOut,
@@ -114,7 +113,8 @@ const examples = [
                 <AvatarFallback>JD</AvatarFallback>
               </Avatar>
             </DropdownMenuTrigger>
-            <DropdownMenuContent className="w-56" align="end" forceMount>
+
+            <DropdownMenuContent className="w-56" align="end">
               <DropdownMenuLabel className="font-normal">
                 <div className="flex flex-col space-y-1">
                   <p className="text-sm leading-none font-medium">John Doe</p>
@@ -123,6 +123,7 @@ const examples = [
                   </p>
                 </div>
               </DropdownMenuLabel>
+
               <DropdownMenuSeparator />
 
               <DropdownMenuGroup>
@@ -365,7 +366,6 @@ const examples = [
               <DropdownMenuSeparator />
 
               <DropdownMenuItem>
-                <Github className="mr-2 h-4 w-4" />
                 <span>Import from GitHub</span>
               </DropdownMenuItem>
             </DropdownMenuContent>

apps/dev-tool/app/database/_components/database-tools-interface.tsx

@@ -44,7 +44,7 @@ export function DatabaseToolsInterface({
   const [searchTerm, setSearchTerm] = useState(initialSearchTerm);
 
   return (
-    <div className="space-y-6 p-4">
+    <div className="space-y-6 px-4 py-4">
       {/* Header */}
       <div className="flex items-center justify-between">
         <div>
@@ -52,6 +52,7 @@ export function DatabaseToolsInterface({
             <DatabaseIcon className="h-6 w-6" />
             <h1 className="text-2xl font-bold">Database Tools</h1>
           </div>
+
           <p className="text-muted-foreground">
             Explore database schemas, tables, functions, and enums
           </p>

apps/dev-tool/app/emails/[id]/page.tsx

@@ -54,15 +54,14 @@ export default async function EmailPage(props: EmailPageProps) {
 
   return (
     <Page style={'custom'}>
-      <PageHeader
-        displaySidebarTrigger={false}
-        title={values[id] ?? id}
-        description={<AppBreadcrumbs values={values} />}
-      >
-        <EnvModeSelector mode={mode} />
-      </PageHeader>
-
       <PageBody className={'flex flex-1 flex-col gap-y-4'}>
+        <PageHeader
+          title={values[id] ?? id}
+          description={<AppBreadcrumbs values={values} />}
+        >
+          <EnvModeSelector mode={mode} />
+        </PageHeader>
+
         <p className={'text-muted-foreground py-1 text-xs'}>
           Remember that the below is an approximation of the email. Always test
           it in your inbox.{' '}

apps/dev-tool/app/emails/page.tsx

@@ -29,13 +29,12 @@ export default async function EmailsPage() {
 
   return (
     <Page style={'custom'}>
-      <PageHeader
-        displaySidebarTrigger={false}
-        title="Emails"
-        description={'Manage your application Email templates'}
-      />
-
       <PageBody className={'gap-y-8'}>
+        <PageHeader
+          title="Emails"
+          description={'Manage your application Email templates'}
+        />
+
         {categories.map((category) => {
           const categoryTemplates = templates.filter(
             (t) => t.category === category,

apps/dev-tool/app/page.tsx

@@ -36,12 +36,12 @@ export default async function DashboardPage() {
 
   return (
     <Page style={'custom'}>
-      <PageHeader
-        title={'Dev Tool'}
-        description={'Kit MCP status for this workspace'}
-      />
+      <PageBody className={'space-y-4'}>
+        <PageHeader
+          title={'Dev Tool'}
+          description={'Kit MCP status for this workspace'}
+        />
 
-      <PageBody className={'space-y-8 py-2'}>
         <div className="grid grid-cols-1 gap-4 md:grid-cols-4">
           <ServiceCard
             name={'Variant'}

apps/dev-tool/app/prds/[filename]/_components/prd-detail-view.tsx

@@ -18,7 +18,7 @@ interface PRDDetailViewProps {
 
 export function PRDDetailView({ filename, prd }: PRDDetailViewProps) {
   return (
-    <div className="space-y-6 p-4">
+    <div className="space-y-6">
       {/* Header */}
       <div className="flex items-center gap-4">
         <div>

apps/dev-tool/app/translations/page.tsx

@@ -15,15 +15,14 @@ export default async function TranslationsPage() {
 
   return (
     <Page style={'custom'}>
-      <PageHeader
-        displaySidebarTrigger={false}
-        title={'Translations'}
-        description={
-          'Compare translations across different languages. Ensure consistency and accuracy in your translations.'
-        }
-      />
+      <PageBody>
+        <PageHeader
+          title={'Translations'}
+          description={
+            'Compare translations across different languages. Ensure consistency and accuracy in your translations.'
+          }
+        />
 
-      <PageBody className={'py-4'}>
         <TranslationsComparison translations={translations} />
       </PageBody>
     </Page>

apps/dev-tool/app/variables/page.tsx

@@ -26,15 +26,14 @@ export default function VariablesPage({ searchParams }: VariablesPageProps) {
   return (
     <Page style={'custom'}>
       <div className={'flex h-screen flex-col overflow-hidden'}>
-        <PageHeader
-          displaySidebarTrigger={false}
-          title={'Environment Variables'}
-          description={
-            'Manage environment variables for your applications. Validate and set them up easily.'
-          }
-        />
-
         <PageBody className={'overflow-hidden'}>
+          <PageHeader
+            title={'Environment Variables'}
+            description={
+              'Manage environment variables for your applications. Validate and set them up easily.'
+            }
+          />
+
           <div className={'flex h-full flex-1 flex-col space-y-4'}>
             {apps.map((app) => (
               <AppEnvironmentVariablesManager key={app.appName} state={app} />