New settings layouts. Segment management screen.

src/app/(main)/admin/users/UsersPage.tsx

@@ -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>
   );
 }