mirror of
https://github.com/umami-software/umami.git
synced 2026-02-10 15:47:13 +01:00
New settings layouts. Segment management screen.
This commit is contained in:
parent
2dbcf63eeb
commit
eb7b6978d3
70 changed files with 762 additions and 499 deletions
|
|
@ -1,9 +1,10 @@
|
|||
'use client';
|
||||
import { UsersDataTable } from './UsersDataTable';
|
||||
import { Column } from '@umami/react-zen';
|
||||
import { SectionHeader } from '@/components/common/SectionHeader';
|
||||
import { useMessages } from '@/components/hooks';
|
||||
import { UserAddButton } from './UserAddButton';
|
||||
import { PageHeader } from '@/components/common/PageHeader';
|
||||
import { Panel } from '@/components/common/Panel';
|
||||
|
||||
export function UsersPage() {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
|
|
@ -11,11 +12,13 @@ export function UsersPage() {
|
|||
const handleSave = () => {};
|
||||
|
||||
return (
|
||||
<Column gap>
|
||||
<SectionHeader title={formatMessage(labels.users)}>
|
||||
<Column gap="6">
|
||||
<PageHeader title={formatMessage(labels.users)}>
|
||||
<UserAddButton onSave={handleSave} />
|
||||
</SectionHeader>
|
||||
<UsersDataTable />
|
||||
</PageHeader>
|
||||
<Panel>
|
||||
<UsersDataTable />
|
||||
</Panel>
|
||||
</Column>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
10
src/app/(main)/admin/users/[userId]/UserHeader.tsx
Normal file
10
src/app/(main)/admin/users/[userId]/UserHeader.tsx
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
import { useContext } from 'react';
|
||||
import { User } from '@/components/icons';
|
||||
import { PageHeader } from '@/components/common/PageHeader';
|
||||
import { UserContext } from '@/app/(main)/admin/users/[userId]/UserProvider';
|
||||
|
||||
export function UserHeader() {
|
||||
const user = useContext(UserContext);
|
||||
|
||||
return <PageHeader title={user?.username} icon={<User />} />;
|
||||
}
|
||||
|
|
@ -1,11 +1,19 @@
|
|||
'use client';
|
||||
import { Column } from '@umami/react-zen';
|
||||
import { UserSettings } from './UserSettings';
|
||||
import { UserProvider } from './UserProvider';
|
||||
import { UserHeader } from '@/app/(main)/admin/users/[userId]/UserHeader';
|
||||
import { Panel } from '@/components/common/Panel';
|
||||
|
||||
export function UserPage({ userId }: { userId: string }) {
|
||||
return (
|
||||
<UserProvider userId={userId}>
|
||||
<UserSettings userId={userId} />
|
||||
<Column gap="6">
|
||||
<UserHeader />
|
||||
<Panel>
|
||||
<UserSettings userId={userId} />
|
||||
</Panel>
|
||||
</Column>
|
||||
</UserProvider>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,19 +1,13 @@
|
|||
import { useContext } from 'react';
|
||||
import { Tabs, Tab, TabList, TabPanel } from '@umami/react-zen';
|
||||
import { User } from '@/components/icons';
|
||||
import { Column, Tabs, Tab, TabList, TabPanel } from '@umami/react-zen';
|
||||
import { UserEditForm } from './UserEditForm';
|
||||
import { SectionHeader } from '@/components/common/SectionHeader';
|
||||
import { useMessages } from '@/components/hooks';
|
||||
import { UserWebsites } from './UserWebsites';
|
||||
import { UserContext } from './UserProvider';
|
||||
|
||||
export function UserSettings({ userId }: { userId: string }) {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const user = useContext(UserContext);
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title={user?.username} icon={<User />} />
|
||||
<Column gap="6">
|
||||
<Tabs>
|
||||
<TabList>
|
||||
<Tab id="details">{formatMessage(labels.details)}</Tab>
|
||||
|
|
@ -26,6 +20,6 @@ export function UserSettings({ userId }: { userId: string }) {
|
|||
<UserWebsites userId={userId} />
|
||||
</TabPanel>
|
||||
</Tabs>
|
||||
</>
|
||||
</Column>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue