Skip to content

Commit 47da82a

Browse files
authored
Merge pull request #7894 from sagemathinc/i18n-20241002
frontend/i18n: translate connection info dialog
2 parents 65f94a0 + b211052 commit 47da82a

18 files changed

+296
-24
lines changed

src/packages/frontend/app/connection-indicator.tsx

Lines changed: 19 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,18 @@
33
* License: MS-RSL – see LICENSE.md for details
44
*/
55

6+
import { useIntl } from "react-intl";
7+
68
import {
79
CSS,
810
React,
911
useActions,
1012
useTypedRedux,
1113
} from "@cocalc/frontend/app-framework";
1214
import { Icon } from "@cocalc/frontend/components";
13-
import { COLORS } from "@cocalc/util/theme";
15+
import { labels } from "@cocalc/frontend/i18n";
1416
import track from "@cocalc/frontend/user-tracking";
17+
import { COLORS } from "@cocalc/util/theme";
1518
import {
1619
FONT_SIZE_ICONS_NORMAL,
1720
PageStyle,
@@ -35,6 +38,8 @@ export const ConnectionIndicator: React.FC<Props> = React.memo(
3538
(props: Props) => {
3639
const { on_click, height, pageStyle } = props;
3740
const { topPaddingIcons, sidePaddingIcons, fontSizeIcons } = pageStyle;
41+
42+
const intl = useIntl();
3843
const connection_status = useTypedRedux("page", "connection_status");
3944
const mesg_info = useTypedRedux("account", "mesg_info");
4045
const actions = useActions("page");
@@ -44,7 +49,7 @@ export const ConnectionIndicator: React.FC<Props> = React.memo(
4449
color: "white",
4550
overflow: "hidden",
4651
margin: "auto 0",
47-
};
52+
} as const;
4853

4954
const outer_style: CSS = {
5055
flex: "0 0 auto",
@@ -62,7 +67,7 @@ export const ConnectionIndicator: React.FC<Props> = React.memo(
6267
: COLORS.ORANGE_WARN,
6368
}
6469
: {}),
65-
};
70+
} as const;
6671

6772
function render_connection_status() {
6873
if (connection_status === "connected") {
@@ -79,9 +84,17 @@ export const ConnectionIndicator: React.FC<Props> = React.memo(
7984
}
8085
return <Icon name="wifi" style={icon_style} />;
8186
} else if (connection_status === "connecting") {
82-
return <div style={connecting_style}>connecting...</div>;
87+
return (
88+
<div style={connecting_style}>
89+
{intl.formatMessage(labels.connecting)}...
90+
</div>
91+
);
8392
} else if (connection_status === "disconnected") {
84-
return <div style={connecting_style}>disconnected</div>;
93+
return (
94+
<div style={connecting_style}>
95+
{intl.formatMessage(labels.disconnected)}
96+
</div>
97+
);
8598
}
8699
}
87100

@@ -103,5 +116,5 @@ export const ConnectionIndicator: React.FC<Props> = React.memo(
103116
{render_connection_status()}
104117
</div>
105118
);
106-
}
119+
},
107120
);

src/packages/frontend/app/connection-info.tsx

Lines changed: 63 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
*/
55

66
import { Modal } from "antd";
7+
import { FormattedMessage, useIntl } from "react-intl";
78

89
import { Button, Col, Row } from "@cocalc/frontend/antd-bootstrap";
910
import {
@@ -12,10 +13,13 @@ import {
1213
useTypedRedux,
1314
} from "@cocalc/frontend/app-framework";
1415
import { Icon } from "@cocalc/frontend/components";
16+
import { labels } from "@cocalc/frontend/i18n";
1517
import { webapp_client } from "@cocalc/frontend/webapp-client";
16-
import { plural } from "@cocalc/util/misc";
18+
import { COLORS } from "@cocalc/util/theme";
1719

1820
export const ConnectionInfo: React.FC = React.memo(() => {
21+
const intl = useIntl();
22+
1923
const ping = useTypedRedux("page", "ping");
2024
const avgping = useTypedRedux("page", "avgping");
2125
const status = useTypedRedux("page", "connection_status");
@@ -34,39 +38,60 @@ export const ConnectionInfo: React.FC = React.memo(() => {
3438
onOk={close}
3539
title={
3640
<>
37-
<Icon name="wifi" style={{ marginRight: "1em" }} /> Connection
41+
<Icon name="wifi" style={{ marginRight: "1em" }} />{" "}
42+
{intl.formatMessage(labels.connection)}
3843
</>
3944
}
4045
>
4146
<div>
4247
{ping ? (
4348
<Row>
4449
<Col sm={3}>
45-
<h4>Ping time</h4>
50+
<h4>
51+
<FormattedMessage
52+
id="connection-info.ping"
53+
defaultMessage="Ping time"
54+
description={"Ping how long a server takes to respond"}
55+
/>
56+
</h4>
4657
</Col>
4758
<Col sm={6}>
4859
<pre>
49-
{avgping}ms (latest: {ping}ms)
60+
<FormattedMessage
61+
id="connection-info.ping_info"
62+
defaultMessage="{avgping}ms (latest: {ping}ms)"
63+
description={
64+
"Short string stating the average and the most recent ping in milliseconds."
65+
}
66+
values={{ avgping, ping }}
67+
/>
5068
</pre>
5169
</Col>
5270
</Row>
5371
) : undefined}
5472
<Row>
5573
<Col sm={3}>
56-
<h4>Hub server</h4>
74+
<h4>
75+
<FormattedMessage
76+
id="connection-info.hub_server"
77+
defaultMessage="Hub server"
78+
description={"Ping how long a server takes to respond"}
79+
/>
80+
</h4>
5781
</Col>
5882
<Col sm={6}>
5983
<pre>{hub != null ? hub : "Not signed in"}</pre>
6084
</Col>
6185
<Col sm={2}>
6286
<Button onClick={webapp_client.hub_client.fix_connection}>
63-
<Icon name="repeat" spin={status === "connecting"} /> Reconnect
87+
<Icon name="repeat" spin={status === "connecting"} />{" "}
88+
{intl.formatMessage(labels.reconnect)}
6489
</Button>
6590
</Col>
6691
</Row>
6792
<Row>
6893
<Col sm={3}>
69-
<h4>Messages</h4>
94+
<h4>{intl.formatMessage(labels.message_plural, { num: 10 })}</h4>
7095
</Col>
7196
<Col sm={6}>
7297
<MessageInfo />
@@ -86,18 +111,37 @@ function bytes_to_str(bytes: number): string {
86111
}
87112

88113
const MessageInfo: React.FC = React.memo(() => {
114+
const intl = useIntl();
115+
89116
const info = useTypedRedux("account", "mesg_info");
90117

91118
if (info == null) {
92119
return <span></span>;
93120
}
121+
122+
function messages(num: number): string {
123+
return `${num} ${intl.formatMessage(labels.message_plural, { num })}`;
124+
}
125+
126+
const sent = intl.formatMessage({
127+
id: "connection-info.messages_sent",
128+
defaultMessage: "sent",
129+
description: "Messages sent",
130+
});
131+
132+
const received = intl.formatMessage({
133+
id: "connection-info.messages_received",
134+
defaultMessage: "received",
135+
description: "Messages received",
136+
});
137+
94138
return (
95139
<div>
96140
<pre>
97-
{info.get("sent")} messages sent (
141+
{messages(info.get("sent"))} {sent} (
98142
{bytes_to_str(info.get("sent_length"))})
99143
<br />
100-
{info.get("recv")} messages received (
144+
{messages(info.get("recv"))} {received} (
101145
{bytes_to_str(info.get("recv_length"))})
102146
<br />
103147
<span
@@ -107,17 +151,19 @@ const MessageInfo: React.FC = React.memo(() => {
107151
: undefined
108152
}
109153
>
110-
{info.get("count")} {plural(info.get("count"), "message")} in flight
154+
{messages(info.get("count"))} in flight
111155
</span>
112156
<br />
113-
{info.get("enqueued")} {plural(info.get("enqueued"), "message")} queued
114-
to send
157+
{messages(info.get("enqueued"))} queued to send
115158
</pre>
116-
<div style={{ color: "#666" }}>
117-
Connection icon color changes as the number of messages in flight to a
118-
hub increases. Usually, no action is needed, but the counts are helpful
119-
for diagnostic purposes. The maximum number of messages that can be sent
120-
at the same time is {info.get("max_concurrent")}.
159+
<div style={{ color: COLORS.GRAY_M }}>
160+
<FormattedMessage
161+
id="connection-info.info"
162+
defaultMessage={`Connection icon color changes as the number of messages in flight to a hub increases.
163+
Usually, no action is needed, but the counts are helpful for diagnostic purposes.
164+
The maximum number of messages that can be sent at the same time is {max}.`}
165+
values={{ max: info.get("max_concurrent") }}
166+
/>
121167
</div>
122168
</div>
123169
);

src/packages/frontend/i18n/common.ts

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -528,6 +528,16 @@ export const labels = defineMessages({
528528
description:
529529
"Short label, telling the user a connecting is about to be established.",
530530
},
531+
disconnected: {
532+
id: "labels.disconnected",
533+
defaultMessage: "Disconnected",
534+
description:
535+
"Short label, telling the user a possible connection has not been established.",
536+
},
537+
connection: {
538+
id: "labels.connection",
539+
defaultMessage: "Connection",
540+
},
531541
terminal_command: {
532542
id: "labels.terminal_command",
533543
defaultMessage: "Terminal command",
@@ -555,6 +565,14 @@ export const labels = defineMessages({
555565
defaultMessage: "More info",
556566
description: "Short label for showing 'more information' about something",
557567
},
568+
message_plural: {
569+
id: "labels.messsage.plural",
570+
defaultMessage: "{num, plural, one {message} other {messages}}",
571+
},
572+
reconnect: {
573+
id: "labels.reconnect",
574+
defaultMessage: "Reconnect",
575+
},
558576
});
559577

560578
export const menu = defineMessages({

src/packages/frontend/i18n/trans/ar_EG.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,12 @@
211211
"commands.generic.toggle_button_bar.confirm.title": "إخفاء شريط الأدوات لقائمة جميع المحررين",
212212
"commands.generic.toggle_button_bar.label": "{show, select, true {إخفاء} other {إظهار}} شريط الأدوات...",
213213
"commands.generic.toggle_button_bar.title": "تبديل عرض أو إخفاء شريط أدوات القائمة لجميع المحررين.",
214+
"connection-info.hub_server": "خادم المحور",
215+
"connection-info.info": "يتغير لون أيقونة الاتصال مع زيادة عدد الرسائل المرسلة إلى المحور. عادةً، لا يلزم اتخاذ أي إجراء، لكن الأعداد مفيدة لأغراض التشخيص. الحد الأقصى لعدد الرسائل التي يمكن إرسالها في نفس الوقت هو {max}.",
216+
"connection-info.messages_received": "استلم",
217+
"connection-info.messages_sent": "أُرْسِل",
218+
"connection-info.ping": "وقت الاستجابة",
219+
"connection-info.ping_info": "{avgping}مللي ثانية (الأحدث: {ping}مللي ثانية)",
214220
"editor.build_control_and_log.title": "البناء والتحكم والسجل",
215221
"editor.build_control_and_log.title.short": "بناء",
216222
"editor.clear_terminal_popconfirm_confirm": "نعم، نظف!",
@@ -529,13 +535,15 @@
529535
"labels.cloud_file_system": "أنظمة ملفات السحابة",
530536
"labels.code_folding": "طي الكود",
531537
"labels.connecting": "الاتصال",
538+
"labels.connection": "الاتصال",
532539
"labels.copied": "تم النسخ",
533540
"labels.copy": "نسخ",
534541
"labels.create_project": "إنشاء مشروع...",
535542
"labels.created": "تم الإنشاء",
536543
"labels.created_file": "تم الإنشاء",
537544
"labels.cut": "قص",
538545
"labels.deleted": "محذوف",
546+
"labels.disconnected": "غير متصل",
539547
"labels.documentation": "التوثيق",
540548
"labels.download": "تنزيل",
541549
"labels.downloaded": "تم التنزيل",
@@ -559,6 +567,7 @@
559567
"labels.loading": "جار التحميل...",
560568
"labels.log": "تسجيل",
561569
"labels.masked_files": "{masked, select, true {إخفاء الملفات المخفية} other {إظهار الملفات المخفية}}. الملفات المخفية هي ملفات تم إنشاؤها تلقائيًا أو ملفات مؤقتة، ولا يُقصد تحريرها. ستكون باللون الرمادي.",
570+
"labels.messsage.plural": "{num, plural, one {رسالة} other {رسائل}}",
562571
"labels.more_info": "مزيد من المعلومات",
563572
"labels.moved": "نُقل",
564573
"labels.new_dots": "جديد...",
@@ -582,6 +591,7 @@
582591
"labels.published_files": "ملفات منشورة",
583592
"labels.purchases": "المشتريات",
584593
"labels.recent": "الأحدث",
594+
"labels.reconnect": "إعادة الاتصال",
585595
"labels.redo": "إعادة",
586596
"labels.refresh": "تحديث",
587597
"labels.reload": "إعادة التحميل",
@@ -756,6 +766,9 @@
756766
"project.new.file-type-selector.course.label": "إدارة دورة",
757767
"project.new.file-type-selector.course.tooltip": "إذا كنت مدرسًا، اضغط هنا لإنشاء دورة جديدة. يمكنك إضافة الطلاب والمهام، واستخدامها لإنشاء مشاريع تلقائيًا للجميع، وإرسال المهام للطلاب، وجمعها، وتقييمها، إلخ. راجع <A>التوثيق</A> لمعرفة المزيد.",
758768
"project.new.file-type-selector.new.label": "مجلد جديد",
769+
"project.new.file-type-selector.sagews.modal.content": "فكر في العمل باستخدام دفتر Jupyter واستخدام نواة SageMath. يمكنك أيضًا تحويل أوراق SageWorksheets الموجودة إلى دفاتر Jupyter.",
770+
"project.new.file-type-selector.sagews.modal.ok": "إنشاء على أي حال",
771+
"project.new.file-type-selector.sagews.modal.title": "أوراق عمل SageMath متوقفة.",
759772
"project.new.file-type-selector.timers.label": "ساعة التوقيف والمؤقت",
760773
"project.new.file-type-selector.timers.tooltip": "إنشاء ساعات توقيت ومؤقتات تعاونية لتتبع الوقت المستغرق لإنجاز شيء ما.",
761774
"project.new.new-file-dropdown.label": "المزيد من أنواع الملفات...",

src/packages/frontend/i18n/trans/de_DE.json

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,12 @@
211211
"commands.generic.toggle_button_bar.confirm.title": "Umschalten, ob die Menü-Symbolleiste für alle Editoren angezeigt wird oder nicht.",
212212
"commands.generic.toggle_button_bar.label": "{show, select, true {Verbergen} other {Anzeigen}} Menü Toolbar...",
213213
"commands.generic.toggle_button_bar.title": "Umschalten, ob die Menü-Symbolleiste für alle Editoren angezeigt wird oder nicht.",
214+
"connection-info.hub_server": "Hub-Server",
215+
"connection-info.info": "Die Farbe des Verbindungsicons ändert sich, wenn die Anzahl der Nachrichten, die zu einem Hub gesendet werden, zunimmt. Normalerweise ist keine Aktion erforderlich, aber die Zählungen sind hilfreich zu Diagnosezwecken. Die maximale Anzahl der Nachrichten, die gleichzeitig gesendet werden können, beträgt {max}.",
216+
"connection-info.messages_received": "empfangen",
217+
"connection-info.messages_sent": "gesendet",
218+
"connection-info.ping": "Ping-Zeit",
219+
"connection-info.ping_info": "{avgping}ms (letzte: {ping}ms)",
214220
"editor.build_control_and_log.title": "Kompiler-Steuerung und Protokoll",
215221
"editor.build_control_and_log.title.short": "Kompilieren",
216222
"editor.clear_terminal_popconfirm_confirm": "Ja, aufräumen!",
@@ -516,7 +522,7 @@
516522
"labels.account.last_name": "Nachname",
517523
"labels.activity": "Aktivität",
518524
"labels.admin": "Admin",
519-
"labels.ai_generate_label": "Hilf mir beim Schreiben...",
525+
"labels.ai_generate_label": "Hilf mir Schreiben...",
520526
"labels.ai_generate_title": "Erstelle eine neue Datei mit Hilfe von KI",
521527
"labels.always_running": "Immer aktiv",
522528
"labels.assistant": "Assistent",
@@ -529,13 +535,15 @@
529535
"labels.cloud_file_system": "Cloud Dateisystem",
530536
"labels.code_folding": "Code-Faltung",
531537
"labels.connecting": "Verbinde",
538+
"labels.connection": "Verbindung",
532539
"labels.copied": "kopiert",
533540
"labels.copy": "Kopieren",
534541
"labels.create_project": "Projekt erstellen...",
535542
"labels.created": "Erstellt",
536543
"labels.created_file": "erstellt",
537544
"labels.cut": "Ausschneiden",
538545
"labels.deleted": "gelöscht",
546+
"labels.disconnected": "Getrennt",
539547
"labels.documentation": "Dokumentation",
540548
"labels.download": "herunterladen",
541549
"labels.downloaded": "heruntergeladen",
@@ -559,6 +567,7 @@
559567
"labels.loading": "Laden...",
560568
"labels.log": "Protokoll",
561569
"labels.masked_files": "{masked, select, true {Maskierte Dateien verbergen} other {Maskierte Dateien anzeigen}}. Maskierte Dateien sind automatisch generierte oder temporäre Dateien, die nicht bearbeitet werden sollen. Sie werden ausgegraut.",
570+
"labels.messsage.plural": "{num, plural, one {Nachricht} other {Nachrichten}}",
562571
"labels.more_info": "Mehr Infos",
563572
"labels.moved": "verschoben",
564573
"labels.new_dots": "Neu...",
@@ -582,6 +591,7 @@
582591
"labels.published_files": "Veröffentlichte Dateien",
583592
"labels.purchases": "Einkäufe",
584593
"labels.recent": "Aktuell",
594+
"labels.reconnect": "Erneut verbinden",
585595
"labels.redo": "Wiederholen",
586596
"labels.refresh": "Aktualisieren",
587597
"labels.reload": "Neu laden",
@@ -756,6 +766,9 @@
756766
"project.new.file-type-selector.course.label": "Einen Kurs verwalten",
757767
"project.new.file-type-selector.course.tooltip": "Wenn Sie Lehrer sind, klicken Sie hier, um einen neuen Kurs zu erstellen. Sie können Studenten und Aufgaben hinzufügen und automatisch Projekte für alle erstellen, Aufgaben an Studenten senden, diese einsammeln, benoten usw. Weitere Informationen finden Sie in der <A>Dokumentation</A>.",
758768
"project.new.file-type-selector.new.label": "Neuer Ordner",
769+
"project.new.file-type-selector.sagews.modal.content": "Arbeiten Sie mit einem Jupyter-Notebook und verwenden Sie einen SageMath-Kernel. Sie können auch vorhandene SageWorksheets in Jupyter-Notebooks umwandeln.",
770+
"project.new.file-type-selector.sagews.modal.ok": "Trotzdem erstellen",
771+
"project.new.file-type-selector.sagews.modal.title": "SageMath-Arbeitsblätter sind veraltet.",
759772
"project.new.file-type-selector.timers.label": "Stoppuhr und Timer",
760773
"project.new.file-type-selector.timers.tooltip": "Erstelle kollaborative Stoppuhren und Timer, um zu verfolgen, wie lange es dauert, etwas zu tun.",
761774
"project.new.new-file-dropdown.label": "Weitere Dateitypen...",

0 commit comments

Comments
 (0)