VDMDI/CT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

implement auto reconnect

Browse Source
This commit is contained in:
marlon-erler
2026-04-01 08:29:39 +00:00
parent c52d7b7685
commit 9d400a9929
82 changed files with 8340 additions and 7641 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/View/Components/chatMessage.tsx
+55 -51
View File
@@ -6,61 +6,65 @@ import ChatMessageViewModel from "../../ViewModel/Chat/chatMessageViewModel";
import { translations } from "../translations";
export function ChatMessage(chatMessageViewModel: ChatMessageViewModel) {
const statusIcon = React.createProxyState(
[chatMessageViewModel.status],
() => {
switch (chatMessageViewModel.status.value) {
case ChatMessageStatus.Outbox:
return "hourglass_top";
case ChatMessageStatus.Sent:
return "check";
case ChatMessageStatus.Received:
return "done_all";
default:
return "warning";
}
}
);
return (
<div
class="message-bubble"
toggle:sentbyuser={chatMessageViewModel.sentByUser}
>
<div class="main tile">
<div class="text-container">
<span class="sender-name ellipsis">
{chatMessageViewModel.sender}
</span>
<span
class="body"
subscribe:innerText={chatMessageViewModel.body}
></span>
<span class="timestamp ellipsis">
<span class="icon" subscribe:innerText={statusIcon}></span>
{chatMessageViewModel.dateSent}
</span>
</div>
<div class="button-container">
<button
on:click={chatMessageViewModel.showInfoModal}
aria-label={
translations.chatPage.message.showMessageInfoButtonAudioLabel
const statusIcon = React.createProxyState(
[chatMessageViewModel.status],
() => {
switch (chatMessageViewModel.status.value) {
case ChatMessageStatus.Outbox:
return "hourglass_top";
case ChatMessageStatus.Sent:
return "check";
case ChatMessageStatus.Received:
return "done_all";
default:
return "warning";
}
>
<span class="icon">info</span>
</button>
</div>
</div>
},
);
{ChatMessageInfoModal(chatMessageViewModel)}
</div>
);
return (
<div
class="message-bubble"
toggle:sentbyuser={chatMessageViewModel.sentByUser}
>
<div class="main tile">
<div class="text-container">
<span class="sender-name ellipsis">
{chatMessageViewModel.sender}
</span>
<span
class="body"
subscribe:innerText={chatMessageViewModel.body}
></span>
<span class="timestamp ellipsis">
<span
class="icon"
subscribe:innerText={statusIcon}
></span>
{chatMessageViewModel.dateSent}
</span>
</div>
<div class="button-container">
<button
on:click={chatMessageViewModel.showInfoModal}
aria-label={
translations.chatPage.message
.showMessageInfoButtonAudioLabel
}
>
<span class="icon">info</span>
</button>
</div>
</div>
{ChatMessageInfoModal(chatMessageViewModel)}
</div>
);
}
export const ChatMessageViewModelToView: React.StateItemConverter<
ChatMessageViewModel
ChatMessageViewModel
> = (chatMessageViewModel: ChatMessageViewModel) => {
return ChatMessage(chatMessageViewModel);
return ChatMessage(chatMessageViewModel);
};