add settings pane for info

This commit is contained in:
marlon-erler
2026-04-09 15:45:19 +00:00
parent 31418f5df0
commit bb096e1443
7 changed files with 118 additions and 48 deletions
+20 -4
View File
@@ -18,10 +18,26 @@ export function ChatMessageInfoModal(
<h2>{translations.chatPage.message.messageInfoHeadline}</h2>
<div class="flex-column gap">
{InfoTile("account_circle", translations.chatPage.message.sentBy, chatMessageViewModel.sender)}
{InfoTile("schedule", translations.chatPage.message.timeSent, chatMessageViewModel.dateSent)}
{InfoTile("forum", translations.chatPage.message.channel, chatMessageViewModel.channel)}
{InfoTile("description", translations.chatPage.message.messageContent, chatMessageViewModel.body)}
{InfoTile(
"account_circle",
translations.chatPage.message.sentBy,
chatMessageViewModel.sender,
)}
{InfoTile(
"schedule",
translations.chatPage.message.timeSent,
chatMessageViewModel.dateSent,
)}
{InfoTile(
"forum",
translations.chatPage.message.channel,
chatMessageViewModel.channel,
)}
{InfoTile(
"description",
translations.chatPage.message.messageContent,
chatMessageViewModel.body,
)}
</div>
<hr></hr>
+30 -10
View File
@@ -5,18 +5,22 @@ import SettingsViewModel, {
SettingsModalPages,
} from "../../ViewModel/Global/settingsViewModel";
import { SplitModal } from "../Components/splitModal";
import { InfoTile } from "../Components/infoTile";
export function SettingsModal(settingsViewModel: SettingsViewModel) {
const detailView = React.createProxyState([settingsViewModel.selectedModalPage], () => {
switch (settingsViewModel.selectedModalPage.value) {
case SettingsModalPages.Appearance:
return <div>Appearance</div>
case SettingsModalPages.Regional:
return <div>Regional</div>
case SettingsModalPages.Info:
return <div>Info</div>
}
})
const detailView = React.createProxyState(
[settingsViewModel.selectedModalPage],
() => {
switch (settingsViewModel.selectedModalPage.value) {
case SettingsModalPages.Appearance:
return <div>Appearance</div>;
case SettingsModalPages.Regional:
return <div>Regional</div>;
case SettingsModalPages.Info:
return SettingsInfoPane(settingsViewModel);
}
},
);
return (
<div
@@ -83,3 +87,19 @@ function SettingsPaneButton(
</button>
);
}
function SettingsInfoPane(settingsViewModel: SettingsViewModel) {
return (
<div class="slide-up">
<h2>{translations.homePage.appName}</h2>
<hr></hr>
<div class="flex-column gap">
{InfoTile(
"build",
translations.settings.version,
settingsViewModel.coreViewModel.BUILD,
)}
</div>
</div>
);
}