Refactor: removed default exports.

docker/middleware.js

@@ -33,7 +33,7 @@ function customScriptName(req) {
   }
 }
 
-export default function middleware(req) {
+export function middleware(req) {
   const fns = [customCollectEndpoint, customScriptName];
 
   for (const fn of fns) {

package.json

@@ -75,7 +75,7 @@
     "@react-spring/web": "^9.7.3",
     "@tanstack/react-query": "^5.28.6",
     "@umami/prisma-client": "^0.14.0",
-    "@umami/react-zen": "^0.50.0",
+    "@umami/react-zen": "^0.51.0",
     "@umami/redis-client": "^0.26.0",
     "bcryptjs": "^2.4.3",
     "chalk": "^4.1.1",

src/app/(main)/App.tsx

@@ -2,9 +2,9 @@
 import { Grid, Loading } from '@umami/react-zen';
 import Script from 'next/script';
 import { usePathname } from 'next/navigation';
-import UpdateNotice from './UpdateNotice';
+import { UpdateNotice } from './UpdateNotice';
-import NavBar from '@/app/(main)/NavBar';
+import { NavBar } from '@/app/(main)/NavBar';
-import Page from '@/components/layout/Page';
+import { Page } from '@/components/layout/Page';
 import { useLogin, useConfig } from '@/components/hooks';
 
 export function App({ children }) {
@@ -41,5 +41,3 @@ export function App({ children }) {
     </Grid>
   );
 }
-
-export default App;

src/app/(main)/NavBar.tsx

@@ -1,10 +1,10 @@
 'use client';
 import { Icon, Text, ThemeButton, Row } from '@umami/react-zen';
 import Link from 'next/link';
-import LanguageButton from '@/components/input/LanguageButton';
+import { LanguageButton } from '@/components/input/LanguageButton';
-import ProfileButton from '@/components/input/ProfileButton';
+import { ProfileButton } from '@/components/input/ProfileButton';
-import TeamsButton from '@/components/input/TeamsButton';
+import { TeamsButton } from '@/components/input/TeamsButton';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { useMessages, useTeamUrl } from '@/components/hooks';
 
 export function NavBar() {
@@ -46,5 +46,3 @@ export function NavBar() {
     </Row>
   );
 }
-
-export default NavBar;

src/app/(main)/UpdateNotice.tsx

@@ -1,14 +1,14 @@
 import { useEffect, useCallback, useState } from 'react';
 import { Button, AlertBanner, Flexbox } from '@umami/react-zen';
 import { setItem } from '@/lib/storage';
-import useStore, { checkVersion } from '@/store/version';
+import { useVersion, checkVersion } from '@/store/version';
 import { REPO_URL, VERSION_CHECK } from '@/lib/constants';
 import { useMessages } from '@/components/hooks';
 import { usePathname } from 'next/navigation';
 
 export function UpdateNotice({ user, config }) {
   const { formatMessage, labels, messages } = useMessages();
-  const { latest, checked, hasUpdate, releaseUrl } = useStore();
+  const { latest, checked, hasUpdate, releaseUrl } = useVersion();
   const pathname = usePathname();
   const [dismissed, setDismissed] = useState(checked);
   const allowUpdate =
@@ -56,5 +56,3 @@ export function UpdateNotice({ user, config }) {
     </Flexbox>
   );
 }
-
-export default UpdateNotice;

src/app/(main)/boards/BoardsPage.tsx

@@ -1,3 +1,3 @@
-export default function BoardsPage() {
+export function BoardsPage() {
   return <h1>hi.</h1>;
 }

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

@@ -1,4 +1,4 @@
-import BoardsPage from './BoardsPage';
+import { BoardsPage } from './BoardsPage';
 import { Metadata } from 'next';
 
 export default function () {

src/app/(main)/console/ConsolePage.tsx

@@ -1,6 +1,6 @@
 'use client';
-import TestConsole from './TestConsole';
+import { TestConsole } from './TestConsole';
 
-export default function ConsolePage({ websiteId }) {
+export function ConsolePage({ websiteId }) {
   return <TestConsole websiteId={websiteId} />;
 }

src/app/(main)/console/TestConsole.tsx

@@ -1,11 +1,11 @@
 import { Button } from 'react-basics';
 import Link from 'next/link';
 import Script from 'next/script';
-import WebsiteSelect from '@/components/input/WebsiteSelect';
+import { WebsiteSelect } from '@/components/input/WebsiteSelect';
-import Page from '@/components/layout/Page';
+import { Page } from '@/components/layout/Page';
-import PageHeader from '@/components/layout/PageHeader';
+import { PageHeader } from '@/components/layout/PageHeader';
-import EventsChart from '@/components/metrics/EventsChart';
+import { EventsChart } from '@/components/metrics/EventsChart';
-import WebsiteChart from '../websites/[websiteId]/WebsiteChart';
+import { WebsiteChart } from '../websites/[websiteId]/WebsiteChart';
 import { useApi, useNavigation } from '@/components/hooks';
 import styles from './TestConsole.module.css';
 
@@ -216,5 +216,3 @@ export function TestConsole({ websiteId }: { websiteId: string }) {
     </Page>
   );
 }
-
-export default TestConsole;

src/app/(main)/dashboard/DashboardEdit.tsx

@@ -3,7 +3,7 @@ import { DragDropContext, Draggable, Droppable } from '@hello-pangea/dnd';
 import classNames from 'classnames';
 import { Button, Loading, Toggle, SearchField } from 'react-basics';
 import { firstBy } from 'thenby';
-import useDashboard, { saveDashboard } from '@/store/dashboard';
+import { useDashboard, saveDashboard } from '@/store/dashboard';
 import { useMessages, useWebsites } from '@/components/hooks';
 import styles from './DashboardEdit.module.css';
 
@@ -156,5 +156,3 @@ export function DashboardEdit({ teamId }: { teamId: string }) {
     </>
   );
 }
-
-export default DashboardEdit;

src/app/(main)/dashboard/DashboardPage.tsx

@@ -1,14 +1,14 @@
 'use client';
 import { Icon, Icons, Loading, Text } from 'react-basics';
-import PageHeader from '@/components/layout/PageHeader';
+import { PageHeader } from '@/components/layout/PageHeader';
-import Pager from '@/components/common/Pager';
+import { Pager } from '@/components/common/Pager';
-import WebsiteChartList from '../websites/[websiteId]/WebsiteChartList';
+import { WebsiteChartList } from '../websites/[websiteId]/WebsiteChartList';
-import DashboardSettingsButton from '@/app/(main)/dashboard/DashboardSettingsButton';
+import { DashboardSettingsButton } from '@/app/(main)/dashboard/DashboardSettingsButton';
-import DashboardEdit from '@/app/(main)/dashboard/DashboardEdit';
+import { DashboardEdit } from '@/app/(main)/dashboard/DashboardEdit';
-import EmptyPlaceholder from '@/components/common/EmptyPlaceholder';
+import { EmptyPlaceholder } from '@/components/common/EmptyPlaceholder';
 import { useMessages, useLocale, useTeamUrl, useWebsites } from '@/components/hooks';
-import useDashboard from '@/store/dashboard';
+import { useDashboard } from '@/store/dashboard';
-import LinkButton from '@/components/common/LinkButton';
+import { LinkButton } from '@/components/common/LinkButton';
 
 export function DashboardPage() {
   const { formatMessage, labels, messages } = useMessages();
@@ -67,5 +67,3 @@ export function DashboardPage() {
     </section>
   );
 }
-
-export default DashboardPage;

src/app/(main)/dashboard/DashboardSettingsButton.tsx

@@ -1,5 +1,5 @@
 import { TooltipPopup, Icon, Text, Flexbox, Button } from 'react-basics';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { saveDashboard } from '@/store/dashboard';
 import { useMessages } from '@/components/hooks';
 
@@ -32,5 +32,3 @@ export function DashboardSettingsButton() {
     </Flexbox>
   );
 }
-
-export default DashboardSettingsButton;

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

@@ -1,4 +1,4 @@
-import DashboardPage from './DashboardPage';
+import { DashboardPage } from './DashboardPage';
 import { Metadata } from 'next';
 
 export default function () {

src/app/(main)/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from 'next';
-import App from './App';
+import { App } from './App';
 
-export default async function ({ children }) {
+export default function ({ children }) {
   return <App>{children}</App>;
 }
 

src/app/(main)/profile/DateRangeSetting.tsx

@@ -1,4 +1,4 @@
-import DateFilter from '@/components/input/DateFilter';
+import { DateFilter } from '@/components/input/DateFilter';
 import { Button, Flexbox } from 'react-basics';
 import { useDateRange, useMessages } from '@/components/hooks';
 import { DEFAULT_DATE_RANGE } from '@/lib/constants';
@@ -26,5 +26,3 @@ export function DateRangeSetting() {
     </Flexbox>
   );
 }
-
-export default DateRangeSetting;

src/app/(main)/profile/LanguageSetting.tsx

@@ -39,5 +39,3 @@ export function LanguageSetting() {
     </Flexbox>
   );
 }
-
-export default LanguageSetting;

src/app/(main)/profile/PasswordChangeButton.tsx

@@ -1,6 +1,6 @@
 import { Button, Icon, Text, useToasts, ModalTrigger, Modal } from 'react-basics';
-import PasswordEditForm from '@/app/(main)/profile/PasswordEditForm';
+import { PasswordEditForm } from '@/app/(main)/profile/PasswordEditForm';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { useMessages } from '@/components/hooks';
 
 export function PasswordChangeButton() {
@@ -27,5 +27,3 @@ export function PasswordChangeButton() {
     </>
   );
 }
-
-export default PasswordChangeButton;

src/app/(main)/profile/PasswordEditForm.tsx

@@ -65,5 +65,3 @@ export function PasswordEditForm({ onSave, onClose }) {
     </Form>
   );
 }
-
-export default PasswordEditForm;

src/app/(main)/profile/ProfileHeader.tsx

@@ -1,4 +1,4 @@
-import PageHeader from '@/components/layout/PageHeader';
+import { PageHeader } from '@/components/layout/PageHeader';
 import { useMessages } from '@/components/hooks';
 
 export function ProfileHeader() {
@@ -6,5 +6,3 @@ export function ProfileHeader() {
 
   return <PageHeader title={formatMessage(labels.profile)}></PageHeader>;
 }
-
-export default ProfileHeader;

src/app/(main)/profile/ProfilePage.tsx

@@ -1,9 +1,9 @@
 'use client';
-import ProfileHeader from './ProfileHeader';
+import { ProfileHeader } from './ProfileHeader';
-import ProfileSettings from './ProfileSettings';
+import { ProfileSettings } from './ProfileSettings';
 import styles from './ProfilePage.module.css';
 
-export default function () {
+export function ProfilePage() {
   return (
     <div className={styles.container}>
       <ProfileHeader />

src/app/(main)/profile/ProfileSettings.tsx

@@ -1,9 +1,9 @@
 import { Form, FormRow } from 'react-basics';
-import TimezoneSetting from '@/app/(main)/profile/TimezoneSetting';
+import { TimezoneSetting } from '@/app/(main)/profile/TimezoneSetting';
-import DateRangeSetting from '@/app/(main)/profile/DateRangeSetting';
+import { DateRangeSetting } from '@/app/(main)/profile/DateRangeSetting';
-import LanguageSetting from '@/app/(main)/profile/LanguageSetting';
+import { LanguageSetting } from '@/app/(main)/profile/LanguageSetting';
-import ThemeSetting from '@/app/(main)/profile/ThemeSetting';
+import { ThemeSetting } from '@/app/(main)/profile/ThemeSetting';
-import PasswordChangeButton from './PasswordChangeButton';
+import { PasswordChangeButton } from './PasswordChangeButton';
 import { useLogin, useMessages } from '@/components/hooks';
 import { ROLES } from '@/lib/constants';
 
@@ -56,5 +56,3 @@ export function ProfileSettings() {
     </Form>
   );
 }
-
-export default ProfileSettings;

src/app/(main)/profile/ThemeSetting.tsx

@@ -29,5 +29,3 @@ export function ThemeSetting() {
     </div>
   );
 }
-
-export default ThemeSetting;

src/app/(main)/profile/TimezoneSetting.tsx

@@ -33,5 +33,3 @@ export function TimezoneSetting() {
     </Flexbox>
   );
 }
-
-export default TimezoneSetting;

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

@@ -1,5 +1,5 @@
 import { Metadata } from 'next';
-import ProfilePage from './ProfilePage';
+import { ProfilePage } from './ProfilePage';
 
 export default function () {
   return <ProfilePage />;

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

@@ -1,6 +1,6 @@
 import { Button, Icon, Icons, Modal, ModalTrigger, Text } from 'react-basics';
 import { useApi, useMessages, useModified } from '@/components/hooks';
-import ConfirmationForm from '@/components/common/ConfirmationForm';
+import { ConfirmationForm } from '@/components/common/ConfirmationForm';
 
 export function ReportDeleteButton({
   reportId,
@@ -51,5 +51,3 @@ export function ReportDeleteButton({
     </ModalTrigger>
   );
 }
-
-export default ReportDeleteButton;

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

@@ -1,9 +1,9 @@
 import { useReports } from '@/components/hooks';
-import ReportsTable from './ReportsTable';
+import { ReportsTable } from './ReportsTable';
-import DataTable from '@/components/common/DataTable';
+import { DataTable } from '@/components/common/DataTable';
 import { ReactNode } from 'react';
 
-export default function ReportsDataTable({
+export function ReportsDataTable({
   websiteId,
   teamId,
   children,

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

@@ -1,7 +1,7 @@
-import PageHeader from '@/components/layout/PageHeader';
+import { PageHeader } from '@/components/layout/PageHeader';
 import { Icon, Icons, Text } from 'react-basics';
 import { useLogin, useMessages, useTeamUrl } from '@/components/hooks';
-import LinkButton from '@/components/common/LinkButton';
+import { LinkButton } from '@/components/common/LinkButton';
 import { ROLES } from '@/lib/constants';
 
 export function ReportsHeader() {
@@ -23,5 +23,3 @@ export function ReportsHeader() {
     </PageHeader>
   );
 }
-
-export default ReportsHeader;

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

@@ -1,10 +1,10 @@
 'use client';
 import { Metadata } from 'next';
-import ReportsHeader from './ReportsHeader';
+import { ReportsHeader } from './ReportsHeader';
-import ReportsDataTable from './ReportsDataTable';
+import { ReportsDataTable } from './ReportsDataTable';
 import { useTeamUrl } from '@/components/hooks';
 
-export default function ReportsPage() {
+export function ReportsPage() {
   const { teamId } = useTeamUrl();
 
   return (

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

@@ -1,8 +1,8 @@
 import { GridColumn, GridTable, Icon, Icons, Text } from 'react-basics';
-import LinkButton from '@/components/common/LinkButton';
+import { LinkButton } from '@/components/common/LinkButton';
 import { useMessages, useLogin, useTeamUrl } from '@/components/hooks';
 import { REPORT_TYPES } from '@/lib/constants';
-import ReportDeleteButton from './ReportDeleteButton';
+import { ReportDeleteButton } from './ReportDeleteButton';
 
 export function ReportsTable({ data = [], showDomain }: { data: any[]; showDomain?: boolean }) {
   const { formatMessage, labels } = useMessages();
@@ -46,5 +46,3 @@ export function ReportsTable({ data = [], showDomain }: { data: any[]; showDomai
     </GridTable>
   );
 }
-
-export default ReportsTable;

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

@@ -1,8 +1,8 @@
 import { useContext } from 'react';
 import { FormRow } from 'react-basics';
 import { parseDateRange } from '@/lib/date';
-import DateFilter from '@/components/input/DateFilter';
+import { DateFilter } from '@/components/input/DateFilter';
-import WebsiteSelect from '@/components/input/WebsiteSelect';
+import { WebsiteSelect } from '@/components/input/WebsiteSelect';
 import { useMessages, useTeamUrl, useWebsite } from '@/components/hooks';
 import { ReportContext } from './Report';
 import styles from './BaseParameters.module.css';
@@ -63,5 +63,3 @@ export function BaseParameters({
     </>
   );
 }
-
-export default BaseParameters;

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

@@ -1,8 +1,8 @@
 import { useState } from 'react';
 import { createPortal } from 'react-dom';
 import { REPORT_PARAMETERS } from '@/lib/constants';
-import PopupForm from './PopupForm';
+import { PopupForm } from './PopupForm';
-import FieldSelectForm from './FieldSelectForm';
+import { FieldSelectForm } from './FieldSelectForm';
 
 export function FieldAddForm({
   fields = [],
@@ -45,5 +45,3 @@ export function FieldAddForm({
     document.body,
   );
 }
-
-export default FieldAddForm;

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

@@ -1,7 +1,7 @@
 import { Form, FormRow, Menu, Item } from 'react-basics';
 import { useMessages } from '@/components/hooks';
 
-export default function FieldAggregateForm({
+export function FieldAggregateForm({
   name,
   type,
   onSelect,

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

@@ -33,7 +33,7 @@ export interface FieldFilterFormProps {
   isNew?: boolean;
 }
 
-export default function FieldFilterEditForm({
+export function FieldFilterEditForm({
   websiteId,
   name,
   label,

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

@@ -1,5 +1,5 @@
 import { useFields, useMessages } from '@/components/hooks';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { useContext } from 'react';
 import { Button, FormRow, Icon, Popup, PopupTrigger } from 'react-basics';
 import FieldSelectForm from '../[reportId]/FieldSelectForm';
@@ -59,5 +59,3 @@ export function FieldParameters() {
     </FormRow>
   );
 }
-
-export default FieldParameters;

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

@@ -9,11 +9,7 @@ export interface FieldSelectFormProps {
   showType?: boolean;
 }
 
-export default function FieldSelectForm({
+export function FieldSelectForm({ fields = [], onSelect, showType = true }: FieldSelectFormProps) {
-  fields = [],
-  onSelect,
-  showType = true,
-}: FieldSelectFormProps) {
   const { formatMessage, labels } = useMessages();
 
   return (

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

@@ -1,6 +1,6 @@
 import { useContext } from 'react';
 import { useMessages, useFormat, useFilters, useFields } from '@/components/hooks';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { Button, FormRow, Icon, Popup, PopupTrigger } from 'react-basics';
 import FilterSelectForm from '../[reportId]/FilterSelectForm';
 import ParameterList from '../[reportId]/ParameterList';
@@ -134,5 +134,3 @@ const FilterParameter = ({
     </PopupTrigger>
   );
 };
-
-export default FilterParameters;

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

@@ -1,6 +1,6 @@
 import { useState } from 'react';
-import FieldSelectForm from './FieldSelectForm';
+import { FieldSelectForm } from './FieldSelectForm';
-import FieldFilterEditForm from './FieldFilterEditForm';
+import { FieldFilterEditForm } from './FieldFilterEditForm';
 
 export interface FilterSelectFormProps {
   websiteId?: string;
@@ -11,7 +11,7 @@ export interface FilterSelectFormProps {
   allowFilterSelect?: boolean;
 }
 
-export default function FilterSelectForm({
+export function FilterSelectForm({
   websiteId,
   fields,
   startDate,

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

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { Icon } from 'react-basics';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
-import Empty from '@/components/common/Empty';
+import { Empty } from '@/components/common/Empty';
 import { useMessages } from '@/components/hooks';
 import styles from './ParameterList.module.css';
 import classNames from 'classnames';
@@ -46,5 +46,3 @@ const Item = ({
 };
 
 ParameterList.Item = Item;
-
-export default ParameterList;

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

@@ -21,5 +21,3 @@ export function PopupForm({
     </div>
   );
 }
-
-export default PopupForm;

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

@@ -29,5 +29,3 @@ export function Report({
     </ReportContext.Provider>
   );
 }
-
-export default Report;

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

@@ -11,5 +11,3 @@ export function ReportBody({ children }) {
 
   return <div className={styles.body}>{children}</div>;
 }
-
-export default ReportBody;

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

@@ -4,7 +4,7 @@ import { useMessages, useApi, useNavigation, useTeamUrl } from '@/components/hoo
 import { ReportContext } from './Report';
 import styles from './ReportHeader.module.css';
 import { REPORT_TYPES } from '@/lib/constants';
-import Breadcrumb from '@/components/common/Breadcrumb';
+import { Breadcrumb } from '@/components/common/Breadcrumb';
 
 export function ReportHeader({ icon }) {
   const { report, updateReport } = useContext(ReportContext);
@@ -102,5 +102,3 @@ export function ReportHeader({ icon }) {
     </div>
   );
 }
-
-export default ReportHeader;

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

@@ -23,5 +23,3 @@ export function ReportMenu({ children }) {
     </div>
   );
 }
-
-export default ReportMenu;

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

@@ -20,7 +20,7 @@ const reports = {
   revenue: RevenueReport,
 };
 
-export default function ReportPage({ reportId }: { reportId: string }) {
+export function ReportPage({ reportId }: { reportId: string }) {
   const { report } = useReport(reportId);
 
   if (!report) {

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

@@ -1,5 +1,5 @@
 import { Metadata } from 'next';
-import ReportPage from './ReportPage';
+import { ReportPage } from './ReportPage';
 
 export default async function ({ params }: { params: { reportId: string } }) {
   const { reportId } = await params;

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

@@ -1,6 +1,6 @@
 'use client';
-import ReportTemplates from './ReportTemplates';
+import { ReportTemplates } from './ReportTemplates';
 
-export default function ReportCreatePage() {
+export function ReportCreatePage() {
   return <ReportTemplates />;
 }

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

@@ -6,7 +6,7 @@ import Path from '@/assets/path.svg';
 import Tag from '@/assets/tag.svg';
 import Target from '@/assets/target.svg';
 import { useMessages, useTeamUrl } from '@/components/hooks';
-import PageHeader from '@/components/layout/PageHeader';
+import { PageHeader } from '@/components/layout/PageHeader';
 import Link from 'next/link';
 import { Button, Icon, Icons, Text } from 'react-basics';
 import styles from './ReportTemplates.module.css';
@@ -97,5 +97,3 @@ function ReportItem({ title, description, url, icon }) {
     </div>
   );
 }
-
-export default ReportTemplates;

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

@@ -1,4 +1,4 @@
-import ReportCreatePage from './ReportCreatePage';
+import { ReportCreatePage } from './ReportCreatePage';
 import { Metadata } from 'next';
 
 export default function () {

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

@@ -1,7 +1,7 @@
 import { useContext } from 'react';
 import { Form, FormRow, FormButtons, SubmitButton, PopupTrigger, Icon, Popup } from 'react-basics';
-import Empty from '@/components/common/Empty';
+import { Empty } from '@/components/common/Empty';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { useApi, useMessages } from '@/components/hooks';
 import { DATA_TYPES, REPORT_PARAMETERS } from '@/lib/constants';
 import { ReportContext } from '../[reportId]/Report';
@@ -137,5 +137,3 @@ export function EventDataParameters() {
     </Form>
   );
 }
-
-export default EventDataParameters;

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

@@ -2,8 +2,8 @@ import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
 import ReportBody from '../[reportId]/ReportBody';
-import EventDataParameters from './EventDataParameters';
+import { EventDataParameters } from './EventDataParameters';
-import EventDataTable from './EventDataTable';
+import { EventDataTable } from './EventDataTable';
 import Nodes from '@/assets/nodes.svg';
 
 const defaultParameters = {
@@ -11,7 +11,7 @@ const defaultParameters = {
   parameters: { fields: [], filters: [] },
 };
 
-export default function EventDataReport({ reportId }: { reportId?: string }) {
+export function EventDataReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Nodes />} />

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

@@ -1,6 +1,6 @@
 'use client';
-import EventDataReport from './EventDataReport';
+import { EventDataReport } from './EventDataReport';
 
-export default function EventDataReportPage() {
+export function EventDataReportPage() {
   return <EventDataReport />;
 }

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

@@ -15,5 +15,3 @@ export function EventDataTable() {
     </GridTable>
   );
 }
-
-export default EventDataTable;

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

@@ -1,5 +1,5 @@
 import { Metadata } from 'next';
-import EventDataReportPage from './EventDataReportPage';
+import { EventDataReportPage } from './EventDataReportPage';
 
 export default function () {
   return <EventDataReportPage />;

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

@@ -52,5 +52,3 @@ export function FunnelChart({ className }: FunnelChartProps) {
     </div>
   );
 }
-
-export default FunnelChart;

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

@@ -12,8 +12,8 @@ import {
   TextField,
   Button,
 } from 'react-basics';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
-import FunnelStepAddForm from './FunnelStepAddForm';
+import { FunnelStepAddForm } from './FunnelStepAddForm';
 import { ReportContext } from '../[reportId]/Report';
 import BaseParameters from '../[reportId]/BaseParameters';
 import ParameterList from '../[reportId]/ParameterList';
@@ -124,5 +124,3 @@ export function FunnelParameters() {
     </Form>
   );
 }
-
-export default FunnelParameters;

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

@@ -1,5 +1,5 @@
-import FunnelChart from './FunnelChart';
+import { FunnelChart } from './FunnelChart';
-import FunnelParameters from './FunnelParameters';
+import { FunnelParameters } from './FunnelParameters';
 import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
@@ -12,7 +12,7 @@ const defaultParameters = {
   parameters: { window: 60, steps: [] },
 };
 
-export default function FunnelReport({ reportId }: { reportId?: string }) {
+export function FunnelReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Funnel />} />

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

@@ -1,6 +1,6 @@
 'use client';
-import FunnelReport from './FunnelReport';
+import { FunnelReport } from './FunnelReport';
 
-export default function FunnelReportPage() {
+export function FunnelReportPage() {
   return <FunnelReport />;
 }

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

@@ -76,5 +76,3 @@ export function FunnelStepAddForm({
     </Flexbox>
   );
 }
-
-export default FunnelStepAddForm;

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

@@ -1,4 +1,4 @@
-import FunnelReportPage from './FunnelReportPage';
+import { FunnelReportPage } from './FunnelReportPage';
 import { Metadata } from 'next';
 
 export default function () {

src/app/(main)/reports/goals/GoalsAddForm.tsx

@@ -139,5 +139,3 @@ export function GoalsAddForm({
     </Flexbox>
   );
 }
-
-export default GoalsAddForm;

src/app/(main)/reports/goals/GoalsChart.tsx

@@ -70,5 +70,3 @@ export function GoalsChart({ className }: { className?: string; isLoading?: bool
     </div>
   );
 }
-
-export default GoalsChart;

src/app/(main)/reports/goals/GoalsParameters.tsx

@@ -1,5 +1,5 @@
 import { useMessages } from '@/components/hooks';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { formatNumber } from '@/lib/format';
 import { useContext } from 'react';
 import {
@@ -17,7 +17,7 @@ import BaseParameters from '../[reportId]/BaseParameters';
 import ParameterList from '../[reportId]/ParameterList';
 import PopupForm from '../[reportId]/PopupForm';
 import { ReportContext } from '../[reportId]/Report';
-import GoalsAddForm from './GoalsAddForm';
+import { GoalsAddForm } from './GoalsAddForm';
 import styles from './GoalsParameters.module.css';
 
 export function GoalsParameters() {
@@ -137,5 +137,3 @@ export function GoalsParameters() {
     </Form>
   );
 }
-
-export default GoalsParameters;

src/app/(main)/reports/goals/GoalsReport.tsx

@@ -1,5 +1,5 @@
-import GoalsChart from './GoalsChart';
+import { GoalsChart } from './GoalsChart';
-import GoalsParameters from './GoalsParameters';
+import { GoalsParameters } from './GoalsParameters';
 import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
@@ -12,7 +12,7 @@ const defaultParameters = {
   parameters: { goals: [] },
 };
 
-export default function GoalsReport({ reportId }: { reportId?: string }) {
+export function GoalsReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Target />} />

src/app/(main)/reports/goals/GoalsReportPage.tsx

@@ -1,6 +1,6 @@
 'use client';
-import GoalReport from './GoalsReport';
+import { GoalReport } from './GoalsReport';
 
-export default function GoalReportPage() {
+export function GoalReportPage() {
   return <GoalReport />;
 }

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

@@ -1,4 +1,4 @@
-import GoalsReportPage from './GoalsReportPage';
+import { GoalsReportPage } from './GoalsReportPage';
 import { Metadata } from 'next';
 
 export default function () {

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

@@ -32,5 +32,3 @@ export function InsightsParameters() {
     </Form>
   );
 }
-
-export default InsightsParameters;

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

@@ -2,8 +2,8 @@ import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
 import ReportBody from '../[reportId]/ReportBody';
-import InsightsParameters from './InsightsParameters';
+import { InsightsParameters } from './InsightsParameters';
-import InsightsTable from './InsightsTable';
+import { InsightsTable } from './InsightsTable';
 import Lightbulb from '@/assets/lightbulb.svg';
 import { REPORT_TYPES } from '@/lib/constants';
 
@@ -12,7 +12,7 @@ const defaultParameters = {
   parameters: { fields: [], filters: [] },
 };
 
-export default function InsightsReport({ reportId }: { reportId?: string }) {
+export function InsightsReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Lightbulb />} />

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

@@ -1,6 +1,6 @@
 'use client';
-import InsightsReport from './InsightsReport';
+import { InsightsReport } from './InsightsReport';
 
-export default function InsightsReportPage() {
+export function InsightsReportPage() {
   return <InsightsReport />;
 }

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

@@ -2,7 +2,7 @@ import { useContext, useEffect, useState } from 'react';
 import { GridTable, GridColumn } from 'react-basics';
 import { useFormat, useMessages } from '@/components/hooks';
 import { ReportContext } from '../[reportId]/Report';
-import EmptyPlaceholder from '@/components/common/EmptyPlaceholder';
+import { EmptyPlaceholder } from '@/components/common/EmptyPlaceholder';
 import { formatShortTime } from '@/lib/format';
 
 export function InsightsTable() {
@@ -71,5 +71,3 @@ export function InsightsTable() {
     </GridTable>
   );
 }
-
-export default InsightsTable;

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

@@ -1,4 +1,4 @@
-import InsightsReportPage from './InsightsReportPage';
+import { InsightsReportPage } from './InsightsReportPage';
 import { Metadata } from 'next';
 
 export default function () {

src/app/(main)/reports/journey/JourneyParameters.tsx

@@ -59,5 +59,3 @@ export function JourneyParameters() {
     </Form>
   );
 }
-
-export default JourneyParameters;

src/app/(main)/reports/journey/JourneyReport.tsx

@@ -3,8 +3,8 @@ import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
 import ReportBody from '../[reportId]/ReportBody';
-import JourneyParameters from './JourneyParameters';
+import { JourneyParameters } from './JourneyParameters';
-import JourneyView from './JourneyView';
+import { JourneyView } from './JourneyView';
 import Path from '@/assets/path.svg';
 import { REPORT_TYPES } from '@/lib/constants';
 
@@ -13,7 +13,7 @@ const defaultParameters = {
   parameters: { steps: 5 },
 };
 
-export default function JourneyReport({ reportId }: { reportId?: string }) {
+export function JourneyReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Path />} />

src/app/(main)/reports/journey/JourneyReportPage.tsx

@@ -1,5 +1,5 @@
-import JourneyReport from './JourneyReport';
+import { JourneyReport } from './JourneyReport';
 
-export default function JourneyReportPage() {
+export function JourneyReportPage() {
   return <JourneyReport />;
 }

src/app/(main)/reports/journey/JourneyView.tsx

@@ -12,7 +12,7 @@ const NODE_HEIGHT = 60;
 const NODE_GAP = 10;
 const LINE_WIDTH = 3;
 
-export default function JourneyView() {
+export function JourneyView() {
   const [selectedNode, setSelectedNode] = useState(null);
   const [activeNode, setActiveNode] = useState(null);
   const { report } = useContext(ReportContext);

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

@@ -1,5 +1,5 @@
 import { Metadata } from 'next';
-import JourneyReportPage from './JourneyReportPage';
+import { JourneyReportPage } from './JourneyReportPage';
 
 export default function () {
   return <JourneyReportPage />;

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

@@ -1,4 +1,4 @@
-import ReportsPage from './ReportsPage';
+import { ReportsPage } from './ReportsPage';
 import { Metadata } from 'next';
 
 export default function () {

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

@@ -42,5 +42,3 @@ export function RetentionParameters() {
     </Form>
   );
 }
-
-export default RetentionParameters;

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

@@ -1,5 +1,5 @@
-import RetentionTable from './RetentionTable';
+import { RetentionTable } from './RetentionTable';
-import RetentionParameters from './RetentionParameters';
+import { RetentionParameters } from './RetentionParameters';
 import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
@@ -18,7 +18,7 @@ const defaultParameters = {
   },
 };
 
-export default function RetentionReport({ reportId }: { reportId?: string }) {
+export function RetentionReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Magnet />} />

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

@@ -1,8 +1,8 @@
 'use client';
 import { Metadata } from 'next';
-import RetentionReport from './RetentionReport';
+import { RetentionReport } from './RetentionReport';
 
-export default function RetentionReportPage() {
+export function RetentionReportPage() {
   return <RetentionReport />;
 }
 

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

@@ -1,7 +1,7 @@
 import { useContext } from 'react';
 import classNames from 'classnames';
 import { ReportContext } from '../[reportId]/Report';
-import EmptyPlaceholder from '@/components/common/EmptyPlaceholder';
+import { EmptyPlaceholder } from '@/components/common/EmptyPlaceholder';
 import { useMessages, useLocale } from '@/components/hooks';
 import { formatDate } from '@/lib/date';
 import styles from './RetentionTable.module.css';
@@ -75,5 +75,3 @@ export function RetentionTable({ days = DAYS }) {
     </>
   );
 }
-
-export default RetentionTable;

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

@@ -1,5 +1,5 @@
 import { Metadata } from 'next';
-import RetentionReportPage from './RetentionReportPage';
+import { RetentionReportPage } from './RetentionReportPage';
 
 export default function () {
   return <RetentionReportPage />;

src/app/(main)/reports/revenue/RevenueParameters.tsx

@@ -1,5 +1,5 @@
 import { useMessages } from '@/components/hooks';
-import useRevenueValues from '@/components/hooks/queries/useRevenueValues';
+import { useRevenueValues } from '@/components/hooks/queries/useRevenueValues';
 import { useContext } from 'react';
 import { Dropdown, Form, FormButtons, FormInput, FormRow, Item, SubmitButton } from 'react-basics';
 import BaseParameters from '../[reportId]/BaseParameters';
@@ -42,5 +42,3 @@ export function RevenueParameters() {
     </Form>
   );
 }
-
-export default RevenueParameters;

src/app/(main)/reports/revenue/RevenueReport.tsx

@@ -4,15 +4,15 @@ import Report from '../[reportId]/Report';
 import ReportBody from '../[reportId]/ReportBody';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
-import RevenueParameters from './RevenueParameters';
+import { RevenueParameters } from './RevenueParameters';
-import RevenueView from './RevenueView';
+import { RevenueView } from './RevenueView';
 
 const defaultParameters = {
   type: REPORT_TYPES.revenue,
   parameters: {},
 };
 
-export default function RevenueReport({ reportId }: { reportId?: string }) {
+export function RevenueReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Money />} />

src/app/(main)/reports/revenue/RevenueReportPage.tsx

@@ -1,6 +1,6 @@
 'use client';
-import RevenueReport from './RevenueReport';
+import { RevenueReport } from './RevenueReport';
 
-export default function RevenueReportPage() {
+export function RevenueReportPage() {
   return <RevenueReport />;
 }

src/app/(main)/reports/revenue/RevenueTable.tsx

@@ -1,4 +1,4 @@
-import EmptyPlaceholder from '@/components/common/EmptyPlaceholder';
+import { EmptyPlaceholder } from '@/components/common/EmptyPlaceholder';
 import { useMessages } from '@/components/hooks';
 import { useContext } from 'react';
 import { GridColumn, GridTable } from 'react-basics';
@@ -34,5 +34,3 @@ export function RevenueTable() {
     </GridTable>
   );
 }
-
-export default RevenueTable;

src/app/(main)/reports/revenue/RevenueView.tsx

@@ -1,19 +1,19 @@
 import classNames from 'classnames';
 import { colord } from 'colord';
-import BarChart from '@/components/charts/BarChart';
+import { BarChart } from '@/components/charts/BarChart';
-import PieChart from '@/components/charts/PieChart';
+import { PieChart } from '@/components/charts/PieChart';
-import TypeIcon from '@/components/common/TypeIcon';
+import { TypeIcon } from '@/components/common/TypeIcon';
 import { useCountryNames, useLocale, useMessages } from '@/components/hooks';
 import { GridRow } from '@/components/layout/Grid';
-import ListTable from '@/components/metrics/ListTable';
+import { ListTable } from '@/components/metrics/ListTable';
-import MetricCard from '@/components/metrics/MetricCard';
+import { MetricCard } from '@/components/metrics/MetricCard';
-import MetricsBar from '@/components/metrics/MetricsBar';
+import { MetricsBar } from '@/components/metrics/MetricsBar';
 import { renderDateLabels } from '@/lib/charts';
 import { CHART_COLORS } from '@/lib/constants';
 import { formatLongCurrency, formatLongNumber } from '@/lib/format';
 import { useCallback, useContext, useMemo } from 'react';
 import { ReportContext } from '../[reportId]/Report';
-import RevenueTable from './RevenueTable';
+import { RevenueTable } from './RevenueTable';
 import styles from './RevenueView.module.css';
 
 export interface RevenueViewProps {
@@ -152,5 +152,3 @@ export function RevenueView({ isLoading }: RevenueViewProps) {
     </>
   );
 }
-
-export default RevenueView;

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

@@ -1,4 +1,4 @@
-import RevenueReportPage from './RevenueReportPage';
+import { RevenueReportPage } from './RevenueReportPage';
 import { Metadata } from 'next';
 
 export default function () {

src/app/(main)/reports/utm/UTMParameters.tsx

@@ -32,5 +32,3 @@ export function UTMParameters() {
     </Form>
   );
 }
-
-export default UTMParameters;

src/app/(main)/reports/utm/UTMReport.tsx

@@ -3,8 +3,8 @@ import Report from '../[reportId]/Report';
 import ReportHeader from '../[reportId]/ReportHeader';
 import ReportMenu from '../[reportId]/ReportMenu';
 import ReportBody from '../[reportId]/ReportBody';
-import UTMParameters from './UTMParameters';
+import { UTMParameters } from './UTMParameters';
-import UTMView from './UTMView';
+import { UTMView } from './UTMView';
 import Tag from '@/assets/tag.svg';
 import { REPORT_TYPES } from '@/lib/constants';
 
@@ -13,7 +13,7 @@ const defaultParameters = {
   parameters: {},
 };
 
-export default function UTMReport({ reportId }: { reportId?: string }) {
+export function UTMReport({ reportId }: { reportId?: string }) {
   return (
     <Report reportId={reportId} defaultParameters={defaultParameters}>
       <ReportHeader icon={<Tag />} />

src/app/(main)/reports/utm/UTMReportPage.tsx

@@ -1,5 +1,5 @@
-import UTMReport from './UTMReport';
+import { UTMReport } from './UTMReport';
 
-export default function UTMReportPage() {
+export function UTMReportPage() {
   return <UTMReport />;
 }

src/app/(main)/reports/utm/UTMView.tsx

@@ -2,8 +2,8 @@ import { useContext } from 'react';
 import { firstBy } from 'thenby';
 import { ReportContext } from '../[reportId]/Report';
 import { CHART_COLORS, UTM_PARAMS } from '@/lib/constants';
-import PieChart from '@/components/charts/PieChart';
+import { PieChart } from '@/components/charts/PieChart';
-import ListTable from '@/components/metrics/ListTable';
+import { ListTable } from '@/components/metrics/ListTable';
 import styles from './UTMView.module.css';
 import { useMessages } from '@/components/hooks';
 
@@ -15,7 +15,7 @@ function toArray(data: { [key: string]: number } = {}) {
     .sort(firstBy('value', -1));
 }
 
-export default function UTMView() {
+export function UTMView() {
   const { formatMessage, labels } = useMessages();
   const { report } = useContext(ReportContext);
   const { data } = report || {};

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

@@ -1,5 +1,5 @@
 import { Metadata } from 'next';
-import UTMReportPage from './UTMReportPage';
+import { UTMReportPage } from './UTMReportPage';
 
 export default function () {
   return <UTMReportPage />;

src/app/(main)/settings/SettingsLayout.tsx

@@ -1,9 +1,9 @@
 'use client';
 import { ReactNode } from 'react';
 import { useLogin, useMessages } from '@/components/hooks';
-import MenuLayout from '@/components/layout/MenuLayout';
+import { MenuLayout } from '@/components/layout/MenuLayout';
 
-export default function SettingsLayout({ children }: { children: ReactNode }) {
+export function SettingsLayout({ children }: { children: ReactNode }) {
   const { user } = useLogin();
   const { formatMessage, labels } = useMessages();
 

src/app/(main)/settings/layout.tsx

@@ -1,4 +1,4 @@
-import SettingsLayout from './SettingsLayout';
+import { SettingsLayout } from './SettingsLayout';
 import { Metadata } from 'next';
 
 export default function ({ children }) {

src/app/(main)/settings/teams/TeamAddForm.tsx

@@ -43,5 +43,3 @@ export function TeamAddForm({ onSave, onClose }: { onSave: () => void; onClose:
     </Form>
   );
 }
-
-export default TeamAddForm;

src/app/(main)/settings/teams/TeamJoinForm.tsx

@@ -41,5 +41,3 @@ export function TeamJoinForm({ onSave, onClose }: { onSave: () => void; onClose:
     </Form>
   );
 }
-
-export default TeamJoinForm;

src/app/(main)/settings/teams/TeamLeaveButton.tsx

@@ -1,7 +1,7 @@
 import { useLocale, useLogin, useMessages, useModified } from '@/components/hooks';
 import { useRouter } from 'next/navigation';
 import { Button, Icon, Icons, Modal, ModalTrigger, Text } from 'react-basics';
-import TeamDeleteForm from './TeamLeaveForm';
+import { TeamLeaveForm } from './TeamLeaveForm';
 
 export function TeamLeaveButton({ teamId, teamName }: { teamId: string; teamName: string }) {
   const { formatMessage, labels } = useMessages();
@@ -25,7 +25,7 @@ export function TeamLeaveButton({ teamId, teamName }: { teamId: string; teamName
       </Button>
       <Modal title={formatMessage(labels.leaveTeam)}>
         {(close: () => void) => (
-          <TeamDeleteForm
+          <TeamLeaveForm
             teamId={teamId}
             userId={user.id}
             teamName={teamName}
@@ -37,5 +37,3 @@ export function TeamLeaveButton({ teamId, teamName }: { teamId: string; teamName
     </ModalTrigger>
   );
 }
-
-export default TeamLeaveButton;

src/app/(main)/settings/teams/TeamLeaveForm.tsx

@@ -1,5 +1,5 @@
 import { useApi, useMessages, useModified } from '@/components/hooks';
-import ConfirmationForm from '@/components/common/ConfirmationForm';
+import { ConfirmationForm } from '@/components/common/ConfirmationForm';
 
 export function TeamLeaveForm({
   teamId,
@@ -42,5 +42,3 @@ export function TeamLeaveForm({
     />
   );
 }
-
-export default TeamLeaveForm;

src/app/(main)/settings/teams/TeamsAddButton.tsx

@@ -1,7 +1,7 @@
 import { Button, Icon, Modal, ModalTrigger, Text, useToasts } from 'react-basics';
-import Icons from '@/components/icons';
+import { Icons } from '@/components/icons';
 import { useMessages, useModified } from '@/components/hooks';
-import TeamAddForm from './TeamAddForm';
+import { TeamAddForm } from './TeamAddForm';
 import { messages } from '@/components/messages';
 
 export function TeamsAddButton({ onSave }: { onSave?: () => void }) {
@@ -29,5 +29,3 @@ export function TeamsAddButton({ onSave }: { onSave?: () => void }) {
     </ModalTrigger>
   );
 }
-
-export default TeamsAddButton;

src/app/(main)/settings/teams/TeamsDataTable.tsx

@@ -1,5 +1,5 @@
-import DataTable from '@/components/common/DataTable';
+import { DataTable } from '@/components/common/DataTable';
-import TeamsTable from '@/app/(main)/settings/teams/TeamsTable';
+import { TeamsTable } from '@/app/(main)/settings/teams/TeamsTable';
 import { useLogin, useTeams } from '@/components/hooks';
 import { ReactNode } from 'react';
 
@@ -23,5 +23,3 @@ export function TeamsDataTable({
     </DataTable>
   );
 }
-
-export default TeamsDataTable;