build ok,

002_source/cms/src/app/dashboard/settings/security/page.tsx

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import type { Metadata } from 'next';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+import { config } from '@/config';
+import { dayjs } from '@/lib/dayjs';
+import { LoginHistory } from '@/components/dashboard/settings/login-history';
+import { MultiFactor } from '@/components/dashboard/settings/multi-factor';
+import { PasswordForm } from '@/components/dashboard/settings/password-form';
+
+export const metadata = { title: `Security | Settings | Dashboard | ${config.site.name}` } satisfies Metadata;
+
+export default function Page(): React.JSX.Element {
+  return (
+    <Stack spacing={4}>
+      <div>
+        <Typography variant="h4">Security</Typography>
+      </div>
+      <Stack spacing={4}>
+        <PasswordForm />
+        <MultiFactor />
+        <LoginHistory
+          events={[
+            {
+              id: 'EV-002',
+              type: 'Credential login',
+              ip: '95.130.17.84',
+              userAgent: 'Chrome, Mac OS 10.15.7',
+              createdAt: dayjs().subtract(1, 'day').subtract(1, 'hour').subtract(5, 'minute').toDate(),
+            },
+            {
+              id: 'EV-001',
+              type: 'Credential login',
+              ip: '95.130.17.84',
+              userAgent: 'Chrome, Mac OS 10.15.7',
+              createdAt: dayjs().subtract(1, 'day').subtract(1, 'hour').subtract(25, 'minute').toDate(),
+            },
+          ]}
+        />
+      </Stack>
+    </Stack>
+  );
+}