github/umami
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Zen components conversion.

Browse Source
This commit is contained in:
Mike Cao
2025-03-07 03:11:58 -08:00
parent aac1a12e51
commit 5999bf6256
142 changed files with 1235 additions and 1454 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/(main)/profile/DateRangeSetting.tsx
View File

@@ -1,5 +1,5 @@
import { DateFilter } from '@/components/input/DateFilter';
import { Button, Flexbox } from 'react-basics';
import { Button, Flexbox } from '@umami/react-zen';
import { useDateRange, useMessages } from '@/components/hooks';
import { DEFAULT_DATE_RANGE } from '@/lib/constants';
import { DateRange } from '@/lib/types';

2
src/app/(main)/profile/LanguageSetting.tsx
View File

@@ -1,5 +1,5 @@
import { useState } from 'react';
import { Button, Dropdown, Item, Flexbox } from 'react-basics';
import { Button, Dropdown, Item, Flexbox } from '@umami/react-zen';
import { useLocale, useMessages } from '@/components/hooks';
import { DEFAULT_LOCALE } from '@/lib/constants';
import { languages } from '@/lib/lang';

32
src/app/(main)/profile/PasswordChangeButton.tsx
View File

@@ -1,29 +1,29 @@
import { Button, Icon, Text, useToasts, ModalTrigger, Modal } from 'react-basics';
import { Button, Icon, Text, useToast, DialogTrigger, Dialog, Modal } from '@umami/react-zen';
import { PasswordEditForm } from '@/app/(main)/profile/PasswordEditForm';
import { Icons } from '@/components/icons';
import { useMessages } from '@/components/hooks';
export function PasswordChangeButton() {
const { formatMessage, labels, messages } = useMessages();
const { showToast } = useToasts();
const { toast } = useToast();
const handleSave = () => {
showToast({ message: formatMessage(messages.saved), variant: 'success' });
toast(formatMessage(messages.saved));
};
return (
<>
<ModalTrigger>
<Button>
<Icon>
<Icons.Lock />
</Icon>
<Text>{formatMessage(labels.changePassword)}</Text>
</Button>
<Modal title={formatMessage(labels.changePassword)}>
{close => <PasswordEditForm onSave={handleSave} onClose={close} />}
</Modal>
</ModalTrigger>
</>
<DialogTrigger>
<Button>
<Icon>
<Icons.Lock />
</Icon>
<Text>{formatMessage(labels.changePassword)}</Text>
</Button>
<Modal>
<Dialog title={formatMessage(labels.changePassword)}>
{({ close }) => <PasswordEditForm onSave={handleSave} onClose={close} />}
</Dialog>
</Modal>
</DialogTrigger>
);
}

2
src/app/(main)/profile/PasswordEditForm.tsx
View File

@@ -1,5 +1,5 @@
import { useRef } from 'react';
import { Form, FormRow, FormInput, FormButtons, PasswordField, Button } from 'react-basics';
import { Form, FormRow, FormInput, FormButtons, PasswordField, Button } from '@umami/react-zen';
import { useApi, useMessages } from '@/components/hooks';
export function PasswordEditForm({ onSave, onClose }) {

2
src/app/(main)/profile/ProfileSettings.tsx
View File

@@ -1,4 +1,4 @@
import { Form, FormRow } from 'react-basics';
import { Form, FormRow } from '@umami/react-zen';
import { TimezoneSetting } from '@/app/(main)/profile/TimezoneSetting';
import { DateRangeSetting } from '@/app/(main)/profile/DateRangeSetting';
import { LanguageSetting } from '@/app/(main)/profile/LanguageSetting';

2
src/app/(main)/profile/ThemeSetting.tsx
View File

@@ -1,5 +1,5 @@
import classNames from 'classnames';
import { Button, Icon } from 'react-basics';
import { Button, Icon } from '@umami/react-zen';
import { useTheme } from '@/components/hooks';
import { Icons } from '@/components/icons';
import styles from './ThemeSetting.module.css';

2
src/app/(main)/profile/TimezoneSetting.tsx
View File

@@ -1,5 +1,5 @@
import { useState } from 'react';
import { Dropdown, Item, Button, Flexbox } from 'react-basics';
import { Dropdown, Item, Button, Flexbox } from '@umami/react-zen';
import { useTimezone, useMessages } from '@/components/hooks';
import { getTimezone } from '@/lib/date';
import styles from './TimezoneSetting.module.css';