watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-15 01:55:36 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Added settings layout.

Browse source
This commit is contained in:
Mike Cao 2024-02-04 22:35:14 -08:00
parent d818bf5aaf
commit 6802093d69
22 changed files with 102 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

44
src/app/(main)/settings/profile/LanguageSetting.tsx
View file

@ -1,44 +0,0 @@
'use client';
import { useState } from 'react';
import { Button, Dropdown, Item, Flexbox } from 'react-basics';
import { useLocale, useMessages } from 'components/hooks';
import { DEFAULT_LOCALE } from 'lib/constants';
import { languages } from 'lib/lang';
import styles from './LanguageSetting.module.css';
export function LanguageSetting() {
const [search, setSearch] = useState('');
const { formatMessage, labels } = useMessages();
const { locale, saveLocale } = useLocale();
const options = search
? Object.keys(languages).filter(n => {
return (
n.toLowerCase().includes(search.toLowerCase()) ||
languages[n].label.toLowerCase().includes(search.toLowerCase())
);
})
: Object.keys(languages);
const handleReset = () => saveLocale(DEFAULT_LOCALE);
const renderValue = (value: string | number) => languages[value].label;
return (
<Flexbox gap={10}>
<Dropdown
items={options}
value={locale}
renderValue={renderValue}
onChange={val => saveLocale(val as string)}
allowSearch={true}
onSearch={setSearch}
menuProps={{ className: styles.menu }}
>
{item => <Item key={item}>{languages[item].label}</Item>}
</Dropdown>
<Button onClick={handleReset}>{formatMessage(labels.reset)}</Button>
</Flexbox>
);
}
export default LanguageSetting;