Converted user and website settings.

src/app/(main)/websites/[websiteId]/WebsiteExpandedView.tsx

@@ -1,7 +1,7 @@
 import { Dropdown, Icon, Icons, Item, Text } from 'react-basics';
 import { LinkButton } from '@/components/common/LinkButton';
 import { useLocale, useMessages, useNavigation } from '@/components/hooks';
-import { SideNav } from '@/components/layout/SideNav';
+import { MenuNav } from '@/components/layout/MenuNav';
 import { BrowsersTable } from '@/components/metrics/BrowsersTable';
 import { CitiesTable } from '@/components/metrics/CitiesTable';
 import { CountriesTable } from '@/components/metrics/CountriesTable';
@@ -156,7 +156,7 @@ export function WebsiteExpandedView({
           </Icon>
           <Text>{formatMessage(labels.back)}</Text>
         </LinkButton>
-        <SideNav className={styles.nav} items={items} selectedKey={view} shallow={true} />
+        <MenuNav className={styles.nav} items={items} selectedKey={view} shallow={true} />
         <Dropdown
           className={styles.dropdown}
           items={items}

src/app/(main)/websites/[websiteId]/compare/WebsiteCompareTables.tsx

@@ -1,6 +1,6 @@
 import { useDateRange, useMessages, useNavigation } from '@/components/hooks';
 import { Grid, GridRow } from '@/components/layout/Grid';
-import { SideNav } from '@/components/layout/SideNav';
+import { MenuNav } from '@/components/layout/MenuNav';
 import { BrowsersTable } from '@/components/metrics/BrowsersTable';
 import { ChangeLabel } from '@/components/metrics/ChangeLabel';
 import { CitiesTable } from '@/components/metrics/CitiesTable';
@@ -145,7 +145,7 @@ export function WebsiteCompareTables({ websiteId }: { websiteId: string }) {
   return (
     <Grid className={styles.container}>
       <GridRow columns="compare">
-        <SideNav className={styles.nav} items={items} selectedKey={view} shallow={true} />
+        <MenuNav className={styles.nav} items={items} selectedKey={view} shallow={true} />
         <div>
           <div className={styles.title}>{formatMessage(labels.previous)}</div>
           <Component

src/app/(main)/websites/[websiteId]/compare/page.tsx

@@ -1,7 +1,7 @@
 import { WebsiteComparePage } from './WebsiteComparePage';
 import { Metadata } from 'next';
 
-export default async function ({ params }: { params: { websiteId: string } }) {
+export default async function ({ params }: { params: Promise<{ websiteId: string }> }) {
   const { websiteId } = await params;
 
   return <WebsiteComparePage websiteId={websiteId} />;

src/app/(main)/websites/[websiteId]/events/EventsDataTable.tsx

@@ -1,6 +1,6 @@
 import { useWebsiteEvents } from '@/components/hooks';
 import { EventsTable } from './EventsTable';
-import { DataTable } from '@/components/common/DataTable';
+import { DataGrid } from '@/components/common/DataGrid';
 import { ReactNode } from 'react';
 
 export function EventsDataTable({
@@ -13,8 +13,8 @@ export function EventsDataTable({
   const queryResult = useWebsiteEvents(websiteId);
 
   return (
-    <DataTable queryResult={queryResult} allowSearch={true} autoFocus={false}>
+    <DataGrid queryResult={queryResult} allowSearch={true} autoFocus={false}>
       {({ data }) => <EventsTable data={data} />}
-    </DataTable>
+    </DataGrid>
   );
 }

src/app/(main)/websites/[websiteId]/events/page.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from 'next';
 import { EventsPage } from './EventsPage';
 
-export default async function ({ params }: { params: { websiteId: string } }) {
+export default async function ({ params }: { params: Promise<{ websiteId: string }> }) {
   const { websiteId } = await params;
 
   return <EventsPage websiteId={websiteId} />;

src/app/(main)/websites/[websiteId]/realtime/page.tsx

@@ -1,7 +1,7 @@
 import { WebsiteRealtimePage } from './WebsiteRealtimePage';
 import { Metadata } from 'next';
 
-export default async function ({ params }: { params: { websiteId: string } }) {
+export default async function ({ params }: { params: Promise<{ websiteId: string }> }) {
   const { websiteId } = await params;
 
   return <WebsiteRealtimePage websiteId={websiteId} />;

src/app/(main)/websites/[websiteId]/reports/page.tsx

@@ -1,7 +1,7 @@
 import { WebsiteReportsPage } from './WebsiteReportsPage';
 import { Metadata } from 'next';
 
-export default async function ({ params }: { params: { websiteId: string } }) {
+export default async function ({ params }: { params: Promise<{ websiteId: string }> }) {
   const { websiteId } = await params;
 
   return <WebsiteReportsPage websiteId={websiteId} />;

src/app/(main)/websites/[websiteId]/sessions/SessionsDataTable.tsx

@@ -1,6 +1,6 @@
 import { useWebsiteSessions } from '@/components/hooks';
 import { SessionsTable } from './SessionsTable';
-import { DataTable } from '@/components/common/DataTable';
+import { DataGrid } from '@/components/common/DataGrid';
 import { ReactNode } from 'react';
 
 export function SessionsDataTable({
@@ -14,8 +14,8 @@ export function SessionsDataTable({
   const queryResult = useWebsiteSessions(websiteId);
 
   return (
-    <DataTable queryResult={queryResult} allowSearch={false} renderEmpty={() => children}>
+    <DataGrid queryResult={queryResult} allowSearch={false} renderEmpty={() => children}>
       {({ data }) => <SessionsTable data={data} showDomain={!websiteId} />}
-    </DataTable>
+    </DataGrid>
   );
 }

src/app/(main)/websites/[websiteId]/sessions/[sessionId]/page.tsx

@@ -4,7 +4,7 @@ import { Metadata } from 'next';
 export default async function WebsitePage({
   params,
 }: {
-  params: { websiteId: string; sessionId: string };
+  params: Promise<{ websiteId: string; sessionId: string }>;
 }) {
   const { websiteId, sessionId } = await params;
 

src/app/(main)/websites/[websiteId]/sessions/page.tsx

@@ -1,7 +1,7 @@
 import { SessionsPage } from './SessionsPage';
 import { Metadata } from 'next';
 
-export default async function ({ params }: { params: { websiteId: string } }) {
+export default async function ({ params }: { params: Promise<{ websiteId: string }> }) {
   const { websiteId } = await params;
 
   return <SessionsPage websiteId={websiteId} />;