fix theme select

This commit is contained in:
pompurin404 2024-09-21 12:53:14 +08:00
parent bed8e80f59
commit 601029c371
No known key found for this signature in database
3 changed files with 42 additions and 43 deletions

View File

@ -21,7 +21,11 @@ export async function resolveThemes(): Promise<{ key: string; label: string }[]>
return { key: file, label: name }
})
)
return [{ key: 'default.css', label: '默认' }, ...themes]
if (themes.find((theme) => theme.key === 'default.css')) {
return themes
} else {
return [{ key: 'default.css', label: '默认' }, ...themes]
}
}
export async function fetchThemes(): Promise<void> {
@ -51,12 +55,6 @@ export async function importThemes(files: string[]): Promise<void> {
}
export async function applyTheme(theme: string): Promise<void> {
if (theme === 'default.css') {
if (insertedCSSKey) {
await mainWindow?.webContents.removeInsertedCSS(insertedCSSKey)
}
return
}
if (!existsSync(path.join(themesDir(), theme))) return
const css = await readFile(path.join(themesDir(), theme), 'utf-8')
if (insertedCSSKey) {

View File

@ -67,6 +67,23 @@ const App: React.FC = () => {
const location = useLocation()
const page = useRoutes(routes)
const changeTheme = async (): Promise<void> => {
setNativeTheme(appTheme)
setTheme(appTheme)
if (customTheme) await applyTheme(customTheme)
if (!useWindowFrame) {
const options = { height: 48 } as TitleBarOverlayOptions
try {
if (platform !== 'darwin') {
options.color = window.getComputedStyle(document.documentElement).backgroundColor
options.symbolColor = window.getComputedStyle(document.documentElement).color
}
setTitleBarOverlay(options)
} catch (e) {
// ignore
}
}
}
useEffect(() => {
setOrder(siderOrder)
}, [siderOrder])
@ -80,23 +97,7 @@ const App: React.FC = () => {
}, [])
useEffect(() => {
setNativeTheme(appTheme)
setTheme(appTheme)
if (customTheme) applyTheme(customTheme)
if (!useWindowFrame) {
setTimeout(() => {
const options = { height: 48 } as TitleBarOverlayOptions
try {
if (platform !== 'darwin') {
options.color = window.getComputedStyle(document.documentElement).backgroundColor
options.symbolColor = window.getComputedStyle(document.documentElement).color
}
setTitleBarOverlay(options)
} catch (e) {
// ignore
}
}, 0)
}
changeTheme()
}, [appTheme, systemTheme, customTheme])
const onDragEnd = async (event: DragEndEvent): Promise<void> => {

View File

@ -24,9 +24,7 @@ import { IoIosHelpCircle, IoMdCloudDownload } from 'react-icons/io'
const GeneralConfig: React.FC = () => {
const { data: enable, mutate: mutateEnable } = useSWR('checkAutoRun', checkAutoRun)
const { appConfig, patchAppConfig } = useAppConfig()
const [customThemes, setCustomThemes] = React.useState([
{ key: 'default.css', label: '默认', content: '' }
])
const [customThemes, setCustomThemes] = useState<{ key: string; label: string }[]>()
const [fetching, setFetching] = useState(false)
const { setTheme } = useTheme()
const {
@ -269,22 +267,24 @@ const GeneralConfig: React.FC = () => {
</>
}
>
<Select
className="w-[60%]"
size="sm"
selectedKeys={new Set([customTheme])}
onSelectionChange={async (v) => {
try {
await patchAppConfig({ customTheme: v.currentKey as string })
} catch (e) {
alert(e)
}
}}
>
{customThemes.map((theme) => (
<SelectItem key={theme.key}>{theme.label}</SelectItem>
))}
</Select>
{customThemes && (
<Select
className="w-[60%]"
size="sm"
selectedKeys={new Set([customTheme])}
onSelectionChange={async (v) => {
try {
await patchAppConfig({ customTheme: v.currentKey as string })
} catch (e) {
alert(e)
}
}}
>
{customThemes.map((theme) => (
<SelectItem key={theme.key}>{theme.label}</SelectItem>
))}
</Select>
)}
</SettingItem>
</SettingCard>
</>