refactor: Relocate PrivacyProvider to the dashboard layout and update tsconfig jsx compiler option.

app/(dashboard)/layout.tsx

@@ -1,3 +1,4 @@
+import { PrivacyProvider } from "@/components/privacy-provider";
 import { SiteHeader } from "@/components/header-dashboard";
 import { AppSidebar } from "@/components/sidebar/app-sidebar";
 import { SidebarInset, SidebarProvider } from "@/components/ui/sidebar";
@@ -7,7 +8,7 @@ import { fetchPagadoresWithAccess } from "@/lib/pagadores/access";
 import { PAGADOR_ROLE_ADMIN } from "@/lib/pagadores/constants";
 import { parsePeriodParam } from "@/lib/utils/period";
 
-export default async function layout({
+export default async function DashboardLayout({
   children,
   searchParams,
 }: Readonly<{
@@ -40,28 +41,30 @@ export default async function layout({
   );
 
   return (
-    <SidebarProvider>
-      <AppSidebar
-        user={{ ...session.user, image: session.user.image ?? null }}
-        pagadorAvatarUrl={adminPagador?.avatarUrl ?? null}
-        pagadores={pagadoresList.map((item) => ({
-          id: item.id,
-          name: item.name,
-          avatarUrl: item.avatarUrl,
-          canEdit: item.canEdit,
-        }))}
-        variant="inset"
-      />
-      <SidebarInset>
-        <SiteHeader notificationsSnapshot={notificationsSnapshot} />
-        <div className="flex flex-1 flex-col">
-          <div className="@container/main flex flex-1 flex-col gap-2">
-            <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
-              {children}
+    <PrivacyProvider>
+      <SidebarProvider>
+        <AppSidebar
+          user={{ ...session.user, image: session.user.image ?? null }}
+          pagadorAvatarUrl={adminPagador?.avatarUrl ?? null}
+          pagadores={pagadoresList.map((item) => ({
+            id: item.id,
+            name: item.name,
+            avatarUrl: item.avatarUrl,
+            canEdit: item.canEdit,
+          }))}
+          variant="inset"
+        />
+        <SidebarInset>
+          <SiteHeader notificationsSnapshot={notificationsSnapshot} />
+          <div className="flex flex-1 flex-col">
+            <div className="@container/main flex flex-1 flex-col gap-2">
+              <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
+                {children}
+              </div>
             </div>
           </div>
-        </div>
-      </SidebarInset>
-    </SidebarProvider>
+        </SidebarInset>
+      </SidebarProvider>
+    </PrivacyProvider>
   );
 }

app/layout.tsx

@@ -1,4 +1,3 @@
-import { PrivacyProvider } from "@/components/privacy-provider";
 import { ThemeProvider } from "@/components/theme-provider";
 import { Toaster } from "@/components/ui/sonner";
 import { main_font } from "@/public/fonts/font_index";
@@ -23,10 +22,8 @@ export default function RootLayout({
         suppressHydrationWarning
       >
         <ThemeProvider attribute="class" defaultTheme="light">
-          <PrivacyProvider>
-            {children}
-            <Toaster position="top-right" />
-          </PrivacyProvider>
+          {children}
+          <Toaster position="top-right" />
         </ThemeProvider>
         <Analytics />
       </body>

tsconfig.json

@@ -1,7 +1,11 @@
 {
   "compilerOptions": {
     "target": "ES2017",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -11,7 +15,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react-jsx",
     "incremental": true,
     "plugins": [
       {
@@ -19,7 +23,9 @@
       }
     ],
     "paths": {
-      "@/*": ["./*"]
+      "@/*": [
+        "./*"
+      ]
     }
   },
   "include": [
@@ -29,5 +35,7 @@
     ".next/types/**/*.ts",
     ".next/dev/types/**/*.ts"
   ],
-  "exclude": ["node_modules"]
+  "exclude": [
+    "node_modules"
+  ]
 }