Next.js 15 Update (#26)

* Update Next.js and React versions in all packages
* Replace onRedirect function with next/link in BillingSessionStatus, since it's no longer cached by default
* Remove unused revalidatePath import in billing return page, since it's no longer cached by default
* Add Turbopack module aliases to improve development server speed
* Converted new Dynamic APIs to be Promise-based
* Adjust mobile layout
* Use ENABLE_REACT_COMPILER to enable the React Compiler in Next.js 15
* Report Errors using the new onRequestError hook

apps/web/app/admin/_components/admin-sidebar.tsx

@@ -1,5 +1,3 @@
-import { User } from '@supabase/supabase-js';
-
 import { Home, Users } from 'lucide-react';
 
 import {
@@ -12,7 +10,7 @@ import {
 import { AppLogo } from '~/components/app-logo';
 import { ProfileAccountDropdownContainer } from '~/components/personal-account-dropdown-container';
 
-export function AdminSidebar(props: { user: User }) {
+export function AdminSidebar() {
   return (
     <Sidebar>
       <SidebarContent className={'py-4'}>
@@ -35,7 +33,7 @@ export function AdminSidebar(props: { user: User }) {
       </SidebarContent>
 
       <SidebarContent className={'absolute bottom-4'}>
-        <ProfileAccountDropdownContainer user={props.user} />
+        <ProfileAccountDropdownContainer />
       </SidebarContent>
     </Sidebar>
   );

apps/web/app/admin/accounts/[id]/page.tsx

@@ -6,12 +6,13 @@ import { getSupabaseServerAdminClient } from '@kit/supabase/server-admin-client'
 import { PageBody } from '@kit/ui/page';
 
 interface Params {
-  params: {
+  params: Promise<{
     id: string;
-  };
+  }>;
 }
 
-export const generateMetadata = async ({ params }: Params) => {
+export const generateMetadata = async (props: Params) => {
+  const params = await props.params;
   const account = await loadAccount(params.id);
 
   return {
@@ -19,7 +20,8 @@ export const generateMetadata = async ({ params }: Params) => {
   };
 };
 
-async function AccountPage({ params }: Params) {
+async function AccountPage(props: Params) {
+  const params = await props.params;
   const account = await loadAccount(params.id);
 
   return (

apps/web/app/admin/accounts/page.tsx

@@ -11,12 +11,17 @@ interface SearchParams {
   query?: string;
 }
 
+interface AdminAccountsPageProps {
+  searchParams: Promise<SearchParams>;
+}
+
 export const metadata = {
   title: `Accounts`,
 };
 
-function AccountsPage({ searchParams }: { searchParams: SearchParams }) {
+async function AccountsPage(props: AdminAccountsPageProps) {
   const client = getSupabaseServerAdminClient();
+  const searchParams = await props.searchParams;
 
   const page = searchParams.page ? parseInt(searchParams.page) : 1;
   const filters = getFilters(searchParams);

apps/web/app/admin/layout.tsx

@@ -2,19 +2,16 @@ import { Page, PageMobileNavigation, PageNavigation } from '@kit/ui/page';
 
 import { AdminSidebar } from '~/admin/_components/admin-sidebar';
 import { AdminMobileNavigation } from '~/admin/_components/mobile-navigation';
-import { requireUserInServerComponent } from '~/lib/server/require-user-in-server-component';
 
 export const metadata = {
   title: `Super Admin`,
 };
 
-export default async function AdminLayout(props: React.PropsWithChildren) {
-  const user = await requireUserInServerComponent();
-
+export default function AdminLayout(props: React.PropsWithChildren) {
   return (
     <Page style={'sidebar'}>
       <PageNavigation>
-        <AdminSidebar user={user} />
+        <AdminSidebar />
       </PageNavigation>
 
       <PageMobileNavigation>