extras
/
mue
mirror of https://github.com/mue/mue.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

style(settings): use variables for localization

This commit is contained in:
alexsparkes 2024-02-06 18:44:32 +00:00
parent df0e7bfec5
commit 4f0a8207b1
3 changed files with 25 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/modals/main/settings/sections/Greeting.jsx
View File

@ -24,10 +24,12 @@ export default class GreetingSettings extends PureComponent {
}; };
render() { render() {
const GREETING_SECTION = 'modals.main.settings.sections.greeting';
return ( return (
<> <>
<Header <Header
title={variables.getMessage('modals.main.settings.sections.greeting.title')} title={variables.getMessage(`${GREETING_SECTION}.title`)}
setting="greeting" setting="greeting"
category="greeting" category="greeting"
element=".greeting" element=".greeting"
@ -36,26 +38,26 @@ export default class GreetingSettings extends PureComponent {
/> />
<SettingsItem <SettingsItem
title={variables.getMessage('modals.main.settings.additional_settings')} title={variables.getMessage('modals.main.settings.additional_settings')}
subtitle={variables.getMessage('modals.main.settings.sections.greeting.additional')} subtitle={variables.getMessage(`${GREETING_SECTION}.additional`)}
> >
<Checkbox <Checkbox
name="events" name="events"
text={variables.getMessage('modals.main.settings.sections.greeting.events')} text={variables.getMessage(`${GREETING_SECTION}.events`)}
category="greeting" category="greeting"
/> />
<Checkbox <Checkbox
name="defaultGreetingMessage" name="defaultGreetingMessage"
text={variables.getMessage('modals.main.settings.sections.greeting.default')} text={variables.getMessage(`${GREETING_SECTION}.default`)}
category="greeting" category="greeting"
/> />
<Text <Text
title={variables.getMessage('modals.main.settings.sections.greeting.name')} title={variables.getMessage(`${GREETING_SECTION}.name`)}
name="greetingName" name="greetingName"
category="greeting" category="greeting"
/> />
</SettingsItem> </SettingsItem>
<SettingsItem <SettingsItem
title={variables.getMessage('modals.main.settings.sections.greeting.birthday')} title={variables.getMessage(`${GREETING_SECTION}.birthday`)}
subtitle={variables.getMessage( subtitle={variables.getMessage(
'modals.main.settings.sections.greeting.birthday_subtitle', 'modals.main.settings.sections.greeting.birthday_subtitle',
)} )}
@ -68,11 +70,11 @@ export default class GreetingSettings extends PureComponent {
/> />
<Checkbox <Checkbox
name="birthdayage" name="birthdayage"
text={variables.getMessage('modals.main.settings.sections.greeting.birthday_age')} text={variables.getMessage(`${GREETING_SECTION}.birthday_age`)}
category="greeting" category="greeting"
/> />
<p style={{ marginRight: 'auto' }}> <p style={{ marginRight: 'auto' }}>
{variables.getMessage('modals.main.settings.sections.greeting.birthday_date')} {variables.getMessage(`${GREETING_SECTION}.birthday_date`)}
</p> </p>
<input <input
type="date" type="date"

19
src/components/modals/main/settings/sections/Message.jsx
View File

@ -58,22 +58,21 @@ export default class Message extends PureComponent {
} }
render() { render() {
const MESSAGE_SECTION = 'modals.main.settings.sections.message';
return ( return (
<> <>
<Header <Header
title={variables.getMessage('modals.main.settings.sections.message.title')} title={variables.getMessage(`${MESSAGE_SECTION}.title`)}
setting="message" setting="message"
category="message" category="message"
element=".message" element=".message"
zoomSetting="zoomMessage" zoomSetting="zoomMessage"
switch={true} switch={true}
/> />
<SettingsItem <SettingsItem title={variables.getMessage(`${MESSAGE_SECTION}.messages`)} final={true}>
title={variables.getMessage('modals.main.settings.sections.message.messages')}
final={true}
>
<button onClick={() => this.modifyMessage('add')}> <button onClick={() => this.modifyMessage('add')}>
{variables.getMessage('modals.main.settings.sections.message.add')} <MdAdd /> {variables.getMessage(`${MESSAGE_SECTION}.add`)} <MdAdd />
</button> </button>
</SettingsItem> </SettingsItem>
<div className="messagesContainer"> <div className="messagesContainer">
@ -85,7 +84,7 @@ export default class Message extends PureComponent {
</div> </div>
<div className="messageText"> <div className="messageText">
<span className="subtitle"> <span className="subtitle">
{variables.getMessage('modals.main.settings.sections.message.title')} {variables.getMessage(`${MESSAGE_SECTION}.title`)}
</span> </span>
<TextareaAutosize <TextareaAutosize
value={this.state.messages[index]} value={this.state.messages[index]}
@ -117,13 +116,13 @@ export default class Message extends PureComponent {
<div className="emptyNewMessage"> <div className="emptyNewMessage">
<MdOutlineTextsms /> <MdOutlineTextsms />
<span className="title"> <span className="title">
{variables.getMessage('modals.main.settings.sections.message.no_messages')} {variables.getMessage(`${MESSAGE_SECTION}.no_messages`)}
</span> </span>
<span className="subtitle"> <span className="subtitle">
{variables.getMessage('modals.main.settings.sections.message.add_some')} {variables.getMessage(`${MESSAGE_SECTION}.add_some`)}
</span> </span>
<button onClick={() => this.modifyMessage('add')}> <button onClick={() => this.modifyMessage('add')}>
{variables.getMessage('modals.main.settings.sections.message.add')} {variables.getMessage(`${MESSAGE_SECTION}.add`)}
<MdAdd /> <MdAdd />
</button> </button>
</div> </div>

14
src/components/modals/main/settings/sections/Stats.jsx
View File

@ -107,12 +107,12 @@ export default class Stats extends PureComponent {
</div> </div>
); );
const STATS_SECTION = 'modals.main.settings.sections.stats';
return ( return (
<> <>
<div className="statsTopBar"> <div className="statsTopBar">
<span className="mainTitle"> <span className="mainTitle">{variables.getMessage(`${STATS_SECTION}.title`)}</span>
{variables.getMessage('modals.main.settings.sections.stats.title')}
</span>
<div className="headerActions"> <div className="headerActions">
<button onClick={() => this.downloadStats()}> <button onClick={() => this.downloadStats()}>
<MdDownload /> {variables.getMessage('widgets.background.download')} <MdDownload /> {variables.getMessage('widgets.background.download')}
@ -130,7 +130,7 @@ export default class Stats extends PureComponent {
<div className="statGrid"> <div className="statGrid">
<div> <div>
<span className="subtitle"> <span className="subtitle">
{variables.getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}{' '} {variables.getMessage(`${STATS_SECTION}.sections.tabs_opened`)}{' '}
</span> </span>
<span>{this.state.stats['tabs-opened'] || 0}</span> <span>{this.state.stats['tabs-opened'] || 0}</span>
</div> </div>
@ -201,12 +201,10 @@ export default class Stats extends PureComponent {
</div> </div>
</div> </div>
<div className="statSection leftPanel"> <div className="statSection leftPanel">
<span className="title"> <span className="title">{variables.getMessage(`${STATS_SECTION}.achievements`)}</span>
{variables.getMessage('modals.main.settings.sections.stats.achievements')}
</span>
<br /> <br />
<span className="subtitle"> <span className="subtitle">
{variables.getMessage('modals.main.settings.sections.stats.unlocked', { {variables.getMessage(`${STATS_SECTION}.unlocked`, {
count: this.getUnlockedCount() + '/' + this.state.achievements.length, count: this.getUnlockedCount() + '/' + this.state.achievements.length,
})} })}
</span> </span>