mleku/smesh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 🐛

Browse Source
This commit is contained in:
codytseng
2025-01-13 18:07:53 +08:00
parent 6bc2fde314
commit 35a22bd2ba
1 changed files with 25 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/pages/secondary/SettingsPage/index.tsx
View File

@@ -8,7 +8,7 @@ import { useTheme } from '@/providers/ThemeProvider'
import { TLanguage } from '@/types' import { TLanguage } from '@/types'
import { SelectValue } from '@radix-ui/react-select' import { SelectValue } from '@radix-ui/react-select'
import { ChevronRight, Info, Languages, Server, SunMoon } from 'lucide-react' import { ChevronRight, Info, Languages, Server, SunMoon } from 'lucide-react'
import { HTMLProps, useState } from 'react' import { forwardRef, HTMLProps, useState } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
export default function SettingsPage({ index }: { index?: number }) { export default function SettingsPage({ index }: { index?: number }) {
@@ -24,7 +24,7 @@ export default function SettingsPage({ index }: { index?: number }) {
return ( return (
<SecondaryPageLayout index={index} titlebarContent={t('Settings')}> <SecondaryPageLayout index={index} titlebarContent={t('Settings')}>
<Item> <SettingItem>
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<Languages /> <Languages />
<div>{t('Languages')}</div> <div>{t('Languages')}</div>
@@ -38,8 +38,8 @@ export default function SettingsPage({ index }: { index?: number }) {
<SelectItem value="zh">简体中文</SelectItem> <SelectItem value="zh">简体中文</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
</Item> </SettingItem>
<Item> <SettingItem>
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<SunMoon /> <SunMoon />
<div>{t('Theme')}</div> <div>{t('Theme')}</div>
@@ -54,16 +54,16 @@ export default function SettingsPage({ index }: { index?: number }) {
<SelectItem value="dark">{t('Dark')}</SelectItem> <SelectItem value="dark">{t('Dark')}</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
</Item> </SettingItem>
<Item onClick={() => push(toRelaySettings())}> <SettingItem onClick={() => push(toRelaySettings())}>
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<Server /> <Server />
<div>{t('Relays')}</div> <div>{t('Relays')}</div>
</div> </div>
<ChevronRight /> <ChevronRight />
</Item> </SettingItem>
<AboutInfoDialog> <AboutInfoDialog>
<Item> <SettingItem>
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<Info /> <Info />
<div>{t('About')}</div> <div>{t('About')}</div>
@@ -74,13 +74,14 @@ export default function SettingsPage({ index }: { index?: number }) {
</div> </div>
<ChevronRight /> <ChevronRight />
</div> </div>
</Item> </SettingItem>
</AboutInfoDialog> </AboutInfoDialog>
</SecondaryPageLayout> </SecondaryPageLayout>
) )
} }
function Item({ children, className, ...props }: HTMLProps<HTMLDivElement>) { const SettingItem = forwardRef<HTMLDivElement, HTMLProps<HTMLDivElement>>(
({ children, className, ...props }) => {
return ( return (
<div <div
className={cn( className={cn(
@@ -92,4 +93,6 @@ function Item({ children, className, ...props }: HTMLProps<HTMLDivElement>) {
{children} {children}
</div> </div>
) )
} }
)
SettingItem.displayName = 'SettingItem'