Teams context settings.

src/app/(main)/reports/ReportsHeader.tsx

@@ -1,12 +1,12 @@
 'use client';
 import PageHeader from 'components/layout/PageHeader';
 import { Icon, Icons, Text } from 'react-basics';
-import { useMessages, useNavigation } from 'components/hooks';
+import { useMessages, useTeamContext } from 'components/hooks';
 import LinkButton from 'components/common/LinkButton';
 
 export function ReportsHeader() {
   const { formatMessage, labels } = useMessages();
-  const { renderTeamUrl } = useNavigation();
+  const { renderTeamUrl } = useTeamContext();
 
   return (
     <PageHeader title={formatMessage(labels.reports)}>

src/app/(main)/reports/ReportsTable.tsx

@@ -1,6 +1,6 @@
 import { GridColumn, GridTable, Icon, Icons, Text, useBreakpoint } from 'react-basics';
 import LinkButton from 'components/common/LinkButton';
-import { useMessages, useLogin, useNavigation } from 'components/hooks';
+import { useMessages, useLogin, useTeamContext } from 'components/hooks';
 import { REPORT_TYPES } from 'lib/constants';
 import ReportDeleteButton from './ReportDeleteButton';
 
@@ -8,7 +8,7 @@ export function ReportsTable({ data = [], showDomain }: { data: any[]; showDomai
   const { formatMessage, labels } = useMessages();
   const { user } = useLogin();
   const breakpoint = useBreakpoint();
-  const { renderTeamUrl } = useNavigation();
+  const { renderTeamUrl } = useTeamContext();
 
   return (
     <GridTable data={data} cardMode={['xs', 'sm', 'md'].includes(breakpoint)}>

src/app/(main)/reports/[reportId]/BaseParameters.tsx

@@ -3,7 +3,7 @@ import { FormRow } from 'react-basics';
 import { parseDateRange } from 'lib/date';
 import DateFilter from 'components/input/DateFilter';
 import WebsiteSelect from 'components/input/WebsiteSelect';
-import { useMessages } from 'components/hooks';
+import { useLogin, useMessages, useTeamContext } from 'components/hooks';
 import { ReportContext } from './Report';
 
 export interface BaseParametersProps {
@@ -21,6 +21,8 @@ export function BaseParameters({
 }: BaseParametersProps) {
   const { report, updateReport } = useContext(ReportContext);
   const { formatMessage, labels } = useMessages();
+  const { user } = useLogin();
+  const { teamId } = useTeamContext();
 
   const { parameters } = report || {};
   const { websiteId, dateRange } = parameters || {};
@@ -39,7 +41,12 @@ export function BaseParameters({
       {showWebsiteSelect && (
         <FormRow label={formatMessage(labels.website)}>
           {allowWebsiteSelect && (
-            <WebsiteSelect websiteId={websiteId} onSelect={handleWebsiteSelect} />
+            <WebsiteSelect
+              userId={user.id}
+              teamId={teamId}
+              websiteId={websiteId}
+              onSelect={handleWebsiteSelect}
+            />
           )}
         </FormRow>
       )}

src/app/(main)/reports/[reportId]/ReportHeader.tsx

@@ -1,7 +1,6 @@
 import { useContext } from 'react';
-import { useRouter } from 'next/navigation';
 import { Icon, LoadingButton, InlineEditField, useToasts } from 'react-basics';
-import { useMessages, useApi } from 'components/hooks';
+import { useMessages, useApi, useNavigation, useTeamContext } from 'components/hooks';
 import { ReportContext } from './Report';
 import styles from './ReportHeader.module.css';
 import { REPORT_TYPES } from 'lib/constants';
@@ -10,8 +9,10 @@ export function ReportHeader({ icon }) {
   const { report, updateReport } = useContext(ReportContext);
   const { formatMessage, labels, messages } = useMessages();
   const { showToast } = useToasts();
+  const { router } = useNavigation();
+  const { renderTeamUrl } = useTeamContext();
+
   const { post, useMutation } = useApi();
-  const router = useRouter();
   const { mutate: create, isPending: isCreating } = useMutation({
     mutationFn: (data: any) => post(`/reports`, data),
   });
@@ -28,7 +29,7 @@ export function ReportHeader({ icon }) {
       create(report, {
         onSuccess: async ({ id }) => {
           showToast({ message: formatMessage(messages.saved), variant: 'success' });
-          router.push(`/reports/${id}`);
+          router.push(renderTeamUrl(`/reports/${id}`));
         },
       });
     } else {

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

@@ -10,5 +10,5 @@ export default function ReportDetailsPage({ params: { reportId } }) {
 }
 
 export const metadata: Metadata = {
-  title: 'Reports | umami',
+  title: 'Reports | Umami',
 };

src/app/(main)/reports/create/ReportTemplates.tsx

@@ -6,7 +6,7 @@ import Funnel from 'assets/funnel.svg';
 import Lightbulb from 'assets/lightbulb.svg';
 import Magnet from 'assets/magnet.svg';
 import styles from './ReportTemplates.module.css';
-import { useMessages, useNavigation } from 'components/hooks';
+import { useMessages, useTeamContext } from 'components/hooks';
 
 function ReportItem({ title, description, url, icon }) {
   const { formatMessage, labels } = useMessages();
@@ -34,7 +34,7 @@ function ReportItem({ title, description, url, icon }) {
 
 export function ReportTemplates({ showHeader = true }: { showHeader?: boolean }) {
   const { formatMessage, labels } = useMessages();
-  const { renderTeamUrl } = useNavigation();
+  const { renderTeamUrl } = useTeamContext();
 
   const reports = [
     {

src/app/(main)/reports/create/page.tsx

@@ -6,5 +6,5 @@ export default function ReportsCreatePage() {
 }
 
 export const metadata: Metadata = {
-  title: 'Create Report | umami',
+  title: 'Create Report | Umami',
 };

src/app/(main)/reports/event-data/EventDataReport.tsx

@@ -11,7 +11,7 @@ const defaultParameters = {
   parameters: { fields: [], filters: [] },
 };
 
-export default function EventDataReport({ reportId }: { reportId: string }) {
+export default function EventDataReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Nodes />} />

src/app/(main)/reports/event-data/page.tsx

@@ -0,0 +1,10 @@
+import EventDataReport from './EventDataReport';
+import { Metadata } from 'next';
+
+export default function FunnelReportPage() {
+  return <EventDataReport />;
+}
+
+export const metadata: Metadata = {
+  title: 'Funnel Report | Umami',
+};

src/app/(main)/reports/funnel/FunnelReport.tsx

@@ -14,7 +14,7 @@ const defaultParameters = {
   parameters: { window: 60, urls: [] },
 };
 
-export default function FunnelReport({ reportId }) {
+export default function FunnelReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Funnel />} />

src/app/(main)/reports/funnel/page.tsx

@@ -2,9 +2,9 @@ import FunnelReport from './FunnelReport';
 import { Metadata } from 'next';
 
 export default function FunnelReportPage() {
-  return <FunnelReport reportId={null} />;
+  return <FunnelReport />;
 }
 
 export const metadata: Metadata = {
-  title: 'Funnel Report | umami',
+  title: 'Funnel Report | Umami',
 };

src/app/(main)/reports/insights/InsightsReport.tsx

@@ -13,7 +13,7 @@ const defaultParameters = {
   parameters: { fields: [], filters: [] },
 };
 
-export default function InsightsReport({ reportId }: { reportId: string }) {
+export default function InsightsReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Lightbulb />} />

src/app/(main)/reports/insights/page.tsx

@@ -2,9 +2,9 @@ import InsightsReport from './InsightsReport';
 import { Metadata } from 'next';
 
 export default function InsightsReportPage() {
-  return <InsightsReport reportId={null} />;
+  return <InsightsReport />;
 }
 
 export const metadata: Metadata = {
-  title: 'Insights Report | umami',
+  title: 'Insights Report | Umami',
 };

src/app/(main)/reports/page.tsx

@@ -1,14 +1,14 @@
 import ReportsHeader from './ReportsHeader';
 import ReportsDataTable from './ReportsDataTable';
 
-export default function () {
+export default function ({ params: { teamId } }: { params: { teamId: string } }) {
   return (
     <>
       <ReportsHeader />
-      <ReportsDataTable />
+      <ReportsDataTable teamId={teamId} />
     </>
   );
 }
 export const metadata = {
-  title: 'Reports | umami',
+  title: 'Reports | Umami',
 };

src/app/(main)/reports/retention/RetentionReport.tsx

@@ -19,7 +19,7 @@ const defaultParameters = {
   },
 };
 
-export default function RetentionReport({ reportId }: { reportId: string }) {
+export default function RetentionReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Magnet />} />

src/app/(main)/reports/retention/page.tsx

@@ -2,9 +2,9 @@ import { Metadata } from 'next';
 import RetentionReport from './RetentionReport';
 
 export default function RetentionReportPage() {
-  return <RetentionReport reportId={null} />;
+  return <RetentionReport />;
 }
 
 export const metadata: Metadata = {
-  title: 'Create Report | umami',
+  title: 'Create Report | Umami',
 };