Order theme names in the dropdown

This commit is contained in:
Travis Ralston 2020-03-06 17:52:16 -07:00
parent 6aeca7b853
commit 661508ddf8

View File

@ -438,6 +438,12 @@ export default class GeneralUserSettingsTab extends React.Component {
); );
} }
const themes = Object.entries(enumerateThemes())
.map(p => ({id: p[0], name: p[1]})); // convert pairs to objects for code readability
const builtInThemes = themes.filter(p => !p.id.startsWith("custom-"));
const customThemes = themes.filter(p => !builtInThemes.includes(p))
.sort((a, b) => a.name.localeCompare(b.name));
const orderedThemes = [...builtInThemes, ...customThemes];
return ( return (
<div className="mx_SettingsTab_section mx_GeneralUserSettingsTab_themeSection"> <div className="mx_SettingsTab_section mx_GeneralUserSettingsTab_themeSection">
<span className="mx_SettingsTab_subheading">{_t("Theme")}</span> <span className="mx_SettingsTab_subheading">{_t("Theme")}</span>
@ -446,8 +452,8 @@ export default class GeneralUserSettingsTab extends React.Component {
value={this.state.theme} onChange={this._onThemeChange} value={this.state.theme} onChange={this._onThemeChange}
disabled={this.state.useSystemTheme} disabled={this.state.useSystemTheme}
> >
{Object.entries(enumerateThemes()).map(([theme, text]) => { {orderedThemes.map(theme => {
return <option key={theme} value={theme}>{text}</option>; return <option key={theme.id} value={theme.id}>{theme.name}</option>;
})} })}
</Field> </Field>
{customThemeForm} {customThemeForm}