import { localeType } from '@/utils/i18n' import { Dialog, DialogBody, DialogHeader, Input, Option, Select, Typography } from '@material-tailwind/react' import { ChangeEvent, useEffect, useState } from 'react' import { FormattedMessage } from 'react-intl' type Props = { opened: boolean close: () => void reloadSettings: () => void } const languages = [ { label: 'English', value: 'en' }, { label: '日本語', value: 'ja' } ] export default function Settings(props: Props) { const [language, setLanguage] = useState('en') const [fontSize, setFontSize] = useState(16) useEffect(() => { if (typeof localStorage !== 'undefined') { const lang = localStorage.getItem('language') setLanguage(lang as localeType) } }, []) const languageChanged = (e: string) => { if (typeof localStorage !== 'undefined') { localStorage.setItem('language', e) } props.reloadSettings() } const fontSizeChanged = (e: ChangeEvent) => { setFontSize(parseInt(e.target.value)) if (typeof localStorage !== 'undefined') { localStorage.setItem('fontSize', e.target.value) } props.reloadSettings() } return (
) }