steven/epq-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added basis for internationlisation

Browse source 
Currently supported: el_GR, en_US, ar_SA, zh_TW
This commit is contained in:
Zhongheng Liu 2024-01-14 22:42:56 +02:00
commit e85f778774
No known key found for this signature in database
8 changed files with 241 additions and 111 deletions
Download patch file Download diff file Expand all files Collapse all files

73
src/Chat/MessageContainer.tsx
View file

@ -1,24 +1,55 @@
import React from "react";
import React, { useContext } from "react";
import { Message, MessageType } from "./types";
import { LangContext } from "../context";
import strings from "../Intl/strings.json";
export const MessageContainer = ({
type,
fromUserId,
toUserId,
content,
timeMillis,
}: Message): React.ReactElement<Message> => {
const dateTime: Date = new Date(timeMillis);
const lang = useContext(LangContext);
const msgPage = strings[lang].chat;
/* FIXED funny error
* DESCRIPTION
* The line below was
* return (<p>[{dateTime.toLocaleString(Intl.DateTimeFormat().resolvedOptions().timeZone)}]...</p>)
* The line incorrectly generated a value of "UTC" as the parameter to toLocaleString()
* While "UTC" is an accepted string value, in EEST, aka. "Europe/Athens" timezone string is not an acceptable parameter.
* This caused the return statement to fail, and the message fails to render, despite it being correctly committed to the db.
* Funny clown moment 🤡
*/
export const MessageContainer = (
{
type,
fromUserId,
toUserId,
content,
timeMillis,
}: Message
): React.ReactElement<Message> => {
const dateTime: Date = new Date(timeMillis);
/* FIXED funny error
* DESCRIPTION
* The line below was
* return (<p>[{dateTime.toLocaleString(Intl.DateTimeFormat().resolvedOptions().timeZone)}]...</p>)
* The line incorrectly generated a value of "UTC" as the parameter to toLocaleString()
* While "UTC" is an accepted string value, in EEST, aka. "Europe/Athens" timezone string is not an acceptable parameter.
* This caused the return statement to fail, and the message fails to render, despite it being correctly committed to the db.
* Funny clown moment 🤡
*/
return (<p>[{dateTime.toLocaleString()}] Message from {fromUserId}: {content}</p>);
switch (type) {
case MessageType.HELLO as MessageType:
return (
<p>
[{dateTime.toLocaleString()}]{" "}
{msgPage.joinMessage.replace("$userName", fromUserId)}
</p>
);
case MessageType.MESSAGE as MessageType:
return (
<p>
[{dateTime.toLocaleString()}]{" "}
{msgPage.serverMessage
.replace("$userName", fromUserId)
.replace("$content", content)}
</p>
);
case MessageType.DATA as MessageType:
return <></>;
case MessageType.SYSTEM as MessageType:
return <></>;
default:
console.error("Illegal MessageType reported!");
return (
<p>
[{dateTime.toLocaleString()}] **THIS MESSAGE CANNOT BE
CORRECTLY SHOWN BECAUSE THE CLIENT ENCOUNTERED AN ERROR**
</p>
);
}
};