Reworked settings screens.

This commit is contained in:
Mike Cao 2025-05-03 00:31:37 -07:00
parent c1d301ffdc
commit 0a16ab38e4
58 changed files with 362 additions and 365 deletions

View file

@ -1,6 +1,6 @@
import { useMessages, useNavigation } from '@/components/hooks';
import { PageHeader } from '@/components/common/PageHeader';
import { WebsiteAddButton } from './WebsiteAddButton';
import { PageHeader } from '@/components/common/PageHeader';
export interface WebsitesHeaderProps {
allowCreate?: boolean;

View file

@ -1,17 +1,22 @@
'use client';
import { useLoginQuery } from '@/components/hooks';
import { useLoginQuery, useMessages } from '@/components/hooks';
import { WebsitesDataTable } from './WebsitesDataTable';
import { WebsitesHeader } from './WebsitesHeader';
import { ROLES } from '@/lib/constants';
import { WebsiteAddButton } from '@/app/(main)/settings/websites/WebsiteAddButton';
import { SectionHeader } from '@/components/common/SectionHeader';
import { Column } from '@umami/react-zen';
export function WebsitesSettingsPage({ teamId }: { teamId: string }) {
const { user } = useLoginQuery();
const canCreate = user.role !== ROLES.viewOnly;
const { formatMessage, labels } = useMessages();
return (
<>
<WebsitesHeader allowCreate={canCreate} />
<Column gap>
<SectionHeader title={formatMessage(labels.websites)}>
{canCreate && <WebsiteAddButton teamId={teamId} />}
</SectionHeader>
<WebsitesDataTable teamId={teamId} />
</>
</Column>
);
}

View file

@ -1,14 +1,14 @@
import { useContext } from 'react';
import { Button, Icon, Tabs, TabList, Tab, TabPanel, Text } from '@umami/react-zen';
import Link from 'next/link';
import { Icon, Tabs, TabList, Tab, TabPanel, Text } from '@umami/react-zen';
import { WebsiteContext } from '@/app/(main)/websites/[websiteId]/WebsiteProvider';
import { useMessages } from '@/components/hooks';
import { Icons } from '@/components/icons';
import { PageHeader } from '@/components/common/PageHeader';
import { SectionHeader } from '@/components/common/SectionHeader';
import { ShareUrl } from './ShareUrl';
import { TrackingCode } from './TrackingCode';
import { WebsiteData } from './WebsiteData';
import { WebsiteEditForm } from './WebsiteEditForm';
import { LinkButton } from '@/components/common/LinkButton';
export function WebsiteSettings({
websiteId,
@ -22,16 +22,18 @@ export function WebsiteSettings({
return (
<>
<PageHeader title={website?.name} icon={<Icons.Globe />}>
<Link href={`/websites/${websiteId}`} target={openExternal ? '_blank' : null}>
<Button variant="primary">
<Icon>
<Icons.Arrow />
</Icon>
<Text>{formatMessage(labels.view)}</Text>
</Button>
</Link>
</PageHeader>
<SectionHeader title={website?.name} icon={<Icons.Globe />}>
<LinkButton
variant="primary"
href={`/websites/${websiteId}`}
target={openExternal ? '_blank' : null}
>
<Icon>
<Icons.Arrow />
</Icon>
<Text>{formatMessage(labels.view)}</Text>
</LinkButton>
</SectionHeader>
<Tabs>
<TabList>
<Tab id="details">{formatMessage(labels.details)}</Tab>