Skip to content

Commit 68195aa

Browse files
iamfaraniamfaran
committed
add translations for chatbox and chatcontroller
1 parent 89ce6d8 commit 68195aa

File tree

9 files changed

+411
-216
lines changed

9 files changed

+411
-216
lines changed

‎client/packages/lowcoder/src/comps/comps/chatBoxComponentv2/chatBoxComp.tsx‎

Lines changed: 67 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
} from "comps/controls/styleControlConstants";
2323
import { hiddenPropertyView } from "comps/utils/propertyUtils";
2424
import { EditorContext } from "comps/editorState";
25+
import { trans } from "i18n";
2526

2627
import { ChatBoxView } from "./components/ChatBoxView";
2728
import { ChatBoxContext } from "./ChatBoxContext";
@@ -31,76 +32,66 @@ import type { ChatRoom, PendingRoomInvite } from "./store";
3132

3233
const ChatEvents = [
3334
{
34-
label: "Message Sent",
35+
label: trans("chatBoxV2.messageSent"),
3536
value: "messageSent",
36-
description:
37-
"Triggered when the user presses send. Read chatBox.lastSentMessageText to get the message content.",
37+
description: trans("chatBoxV2.messageSentDesc"),
3838
},
3939
{
40-
label: "Start Typing",
40+
label: trans("chatBoxV2.startTyping"),
4141
value: "startTyping",
42-
description:
43-
"Triggered when the user starts typing. Wire this to chatController.startTyping().",
42+
description: trans("chatBoxV2.startTypingDesc"),
4443
},
4544
{
46-
label: "Stop Typing",
45+
label: trans("chatBoxV2.stopTyping"),
4746
value: "stopTyping",
48-
description:
49-
"Triggered when the user stops typing. Wire this to chatController.stopTyping().",
47+
description: trans("chatBoxV2.stopTypingDesc"),
5048
},
5149
{
52-
label: "Room Switch",
50+
label: trans("chatBoxV2.roomSwitch"),
5351
value: "roomSwitch",
54-
description:
55-
"User clicked a room they are already a member of. Read chatBox.pendingRoomId, then call chatController.switchRoom({{chatBox1.pendingRoomId}}).",
52+
description: trans("chatBoxV2.roomSwitchDesc"),
5653
},
5754
{
58-
label: "Room Join",
55+
label: trans("chatBoxV2.roomJoin"),
5956
value: "roomJoin",
60-
description:
61-
"User wants to join a room from search results. Read chatBox.pendingRoomId, then call chatController.joinRoom({{chatBox1.pendingRoomId}}).",
57+
description: trans("chatBoxV2.roomJoinDesc"),
6258
},
6359
{
64-
label: "Room Leave",
60+
label: trans("chatBoxV2.roomLeave"),
6561
value: "roomLeave",
66-
description:
67-
"User clicked leave on a room. Read chatBox.pendingRoomId, then call chatController.leaveRoom({{chatBox1.pendingRoomId}}).",
62+
description: trans("chatBoxV2.roomLeaveDesc"),
6863
},
6964
{
70-
label: "Room Create",
65+
label: trans("chatBoxV2.roomCreate"),
7166
value: "roomCreate",
72-
description:
73-
"User submitted the create-room form. Read chatBox.newRoomName, newRoomType, newRoomDescription, newRoomLlmQuery, then call chatController.createRoom(...).",
67+
description: trans("chatBoxV2.roomCreateDesc"),
7468
},
7569
{
76-
label: "Invite Send",
70+
label: trans("chatBoxV2.inviteSend"),
7771
value: "inviteSend",
78-
description:
79-
"User sent a room invite. Read chatBox.inviteTargetUserId, then call chatController.sendInvite(currentRoomId, {{chatBox1.inviteTargetUserId}}).",
72+
description: trans("chatBoxV2.inviteSendDesc"),
8073
},
8174
{
82-
label: "Invite Accept",
75+
label: trans("chatBoxV2.inviteAccept"),
8376
value: "inviteAccept",
84-
description:
85-
"User accepted a pending invite. Read chatBox.pendingInviteId, then call chatController.acceptInvite({{chatBox1.pendingInviteId}}).",
77+
description: trans("chatBoxV2.inviteAcceptDesc"),
8678
},
8779
{
88-
label: "Invite Decline",
80+
label: trans("chatBoxV2.inviteDecline"),
8981
value: "inviteDecline",
90-
description:
91-
"User declined a pending invite. Read chatBox.pendingInviteId, then call chatController.declineInvite({{chatBox1.pendingInviteId}}).",
82+
description: trans("chatBoxV2.inviteDeclineDesc"),
9283
},
9384
] as const;
9485

9586
// ─── Children map ────────────────────────────────────────────────────────────
9687

9788
const childrenMap = {
9889
// ── Chat content ─────────────────────────────────────────────────
99-
chatTitle: stringExposingStateControl("chatTitle", "Chat"),
90+
chatTitle: stringExposingStateControl("chatTitle", trans("chatBoxV2.chatTitleDefault")),
10091
showHeader: withDefault(BoolControl, true),
10192
messages: jsonArrayControl([]),
10293
currentUserId: withDefault(StringControl, "user_1"),
103-
currentUserName: withDefault(StringControl, "User"),
94+
currentUserName: withDefault(StringControl, trans("chatBoxV2.currentUserNameDefault")),
10495
typingUsers: jsonArrayControl([]),
10596
isAiThinking: withDefault(BoolControl, false),
10697
lastSentMessageText: stringExposingStateControl("lastSentMessageText", ""),
@@ -146,70 +137,62 @@ const ChatBoxPropertyView = React.memo((props: { children: any }) => {
146137
<>
147138
<Section name={sectionNames.basic}>
148139
{children.chatTitle.propertyView({
149-
label: "Chat Title",
150-
tooltip: "Display title shown in the chat header",
140+
label: trans("chatBoxV2.chatTitleLabel"),
141+
tooltip: trans("chatBoxV2.chatTitleTooltip"),
151142
})}
152143
{children.messages.propertyView({
153-
label: "Messages",
154-
tooltip:
155-
'Bind to your data query, e.g. {{ loadMessages.data }}. Expected shape: [{ id, text, authorId, authorName, timestamp }]',
144+
label: trans("chatBoxV2.messagesLabel"),
145+
tooltip: trans("chatBoxV2.messagesTooltip"),
156146
})}
157147
{children.currentUserId.propertyView({
158-
label: "Current User ID",
159-
tooltip:
160-
"The current user's ID — used to distinguish own vs. other messages. Bind to {{ chatController1.userId }}",
148+
label: trans("chatBoxV2.currentUserIdLabel"),
149+
tooltip: trans("chatBoxV2.currentUserIdTooltip"),
161150
})}
162151
{children.currentUserName.propertyView({
163-
label: "Current User Name",
164-
tooltip: "The current user's display name",
152+
label: trans("chatBoxV2.currentUserNameLabel"),
153+
tooltip: trans("chatBoxV2.currentUserNameTooltip"),
165154
})}
166155
</Section>
167156

168-
<Section name="Rooms Panel">
169-
{children.showRoomsPanel.propertyView({ label: "Show Rooms Panel" })}
157+
<Section name={trans("chatBoxV2.roomsPanelSection")}>
158+
{children.showRoomsPanel.propertyView({ label: trans("chatBoxV2.showRoomsPanelLabel") })}
170159
{children.roomsPanelWidth.propertyView({
171-
label: "Panel Width",
172-
tooltip: "Width of the rooms sidebar, e.g. 240px or 30%",
160+
label: trans("chatBoxV2.panelWidthLabel"),
161+
tooltip: trans("chatBoxV2.panelWidthTooltip"),
173162
})}
174163
{children.rooms.propertyView({
175-
label: "Rooms",
176-
tooltip:
177-
"Bind to {{ chatController1.userRooms }} — the list of rooms visible to the current user.",
164+
label: trans("chatBoxV2.roomsLabel"),
165+
tooltip: trans("chatBoxV2.roomsTooltip"),
178166
})}
179167
{children.currentRoomId.propertyView({
180-
label: "Current Room ID",
181-
tooltip:
182-
"Bind to {{ chatController1.currentRoomId }} to highlight the active room.",
168+
label: trans("chatBoxV2.currentRoomIdLabel"),
169+
tooltip: trans("chatBoxV2.currentRoomIdTooltip"),
183170
})}
184171
{children.pendingInvites.propertyView({
185-
label: "Pending Invites",
186-
tooltip:
187-
"Bind to {{ chatController1.pendingInvites }} to show invite notifications.",
172+
label: trans("chatBoxV2.pendingInvitesLabel"),
173+
tooltip: trans("chatBoxV2.pendingInvitesTooltip"),
188174
})}
189-
{children.allowRoomCreation.propertyView({ label: "Allow Room Creation" })}
190-
{children.allowRoomSearch.propertyView({ label: "Allow Room Search" })}
175+
{children.allowRoomCreation.propertyView({ label: trans("chatBoxV2.allowRoomCreationLabel") })}
176+
{children.allowRoomSearch.propertyView({ label: trans("chatBoxV2.allowRoomSearchLabel") })}
191177
</Section>
192178

193-
<Section name="Real-time">
179+
<Section name={trans("chatBoxV2.realTimeSection")}>
194180
{children.typingUsers.propertyView({
195-
label: "Typing Users",
196-
tooltip:
197-
"Array of users currently typing. Bind to {{ chatController1.typingUsers }}",
181+
label: trans("chatBoxV2.typingUsersLabel"),
182+
tooltip: trans("chatBoxV2.typingUsersTooltip"),
198183
})}
199184
{children.isAiThinking.propertyView({
200-
label: "AI Is Thinking",
201-
tooltip:
202-
"Show the AI thinking animation to all users in this room. Bind to {{ chatController1.aiThinkingRooms[chatBox1.currentRoomId] }}",
185+
label: trans("chatBoxV2.aiIsThinkingLabel"),
186+
tooltip: trans("chatBoxV2.aiIsThinkingTooltip"),
203187
})}
204188
{children.onlineUsers.propertyView({
205-
label: "Online Users",
206-
tooltip:
207-
"Array of online users with presence. Bind to {{ chatController1.onlineUsers }}. Shape: [{ userId, userName, currentRoomId }]",
189+
label: trans("chatBoxV2.onlineUsersLabel"),
190+
tooltip: trans("chatBoxV2.onlineUsersTooltip"),
208191
})}
209192
</Section>
210193

211-
<Section name="Display">
212-
{children.showHeader.propertyView({ label: "Show Header" })}
194+
<Section name={trans("chatBoxV2.displaySection")}>
195+
{children.showHeader.propertyView({ label: trans("chatBoxV2.showHeaderLabel") })}
213196
</Section>
214197

215198
{["logic", "both"].includes(editorMode) && (
@@ -227,16 +210,16 @@ const ChatBoxPropertyView = React.memo((props: { children: any }) => {
227210
<Section name={sectionNames.style}>
228211
{children.style.getPropertyView()}
229212
</Section>
230-
<Section name="Sidebar Style">
213+
<Section name={trans("chatBoxV2.sidebarStyleSection")}>
231214
{children.sidebarStyle.getPropertyView()}
232215
</Section>
233-
<Section name="Header Style">
216+
<Section name={trans("chatBoxV2.headerStyleSection")}>
234217
{children.headerStyle.getPropertyView()}
235218
</Section>
236-
<Section name="Message Style">
219+
<Section name={trans("chatBoxV2.messageStyleSection")}>
237220
{children.messageStyle.getPropertyView()}
238221
</Section>
239-
<Section name="Input Style">
222+
<Section name={trans("chatBoxV2.inputStyleSection")}>
240223
{children.inputStyle.getPropertyView()}
241224
</Section>
242225
<Section name={sectionNames.animationStyle} hasTooltip={true}>
@@ -351,34 +334,34 @@ ChatBoxV2Tmp = class extends ChatBoxV2Tmp {
351334
};
352335

353336
export const ChatBoxV2Comp = withExposingConfigs(ChatBoxV2Tmp, [
354-
new NameConfig("chatTitle", "Chat display title"),
337+
new NameConfig("chatTitle", trans("chatBoxV2.chatTitleExposed")),
355338
new NameConfig(
356339
"lastSentMessageText",
357-
"Text of the last message sent by the user — use in your save query",
340+
trans("chatBoxV2.lastSentMessageTextExposed"),
358341
),
359-
new NameConfig("messageText", "Current text in the message input"),
360-
new NameConfig("currentRoomId", "Currently active room ID — for AI thinking or room-scoped queries"),
342+
new NameConfig("messageText", trans("chatBoxV2.messageTextExposed")),
343+
new NameConfig("currentRoomId", trans("chatBoxV2.currentRoomIdExposed")),
361344
new NameConfig(
362345
"pendingRoomId",
363-
"Room ID the user wants to switch to, join, or leave — read in roomSwitch/roomJoin/roomLeave events",
346+
trans("chatBoxV2.pendingRoomIdExposed"),
364347
),
365-
new NameConfig("newRoomName", "Name entered in the create-room form"),
348+
new NameConfig("newRoomName", trans("chatBoxV2.newRoomNameExposed")),
366349
new NameConfig(
367350
"newRoomType",
368-
"Type selected in the create-room form: public | private | llm",
351+
trans("chatBoxV2.newRoomTypeExposed"),
369352
),
370-
new NameConfig("newRoomDescription", "Description entered in the create-room form"),
353+
new NameConfig("newRoomDescription", trans("chatBoxV2.newRoomDescriptionExposed")),
371354
new NameConfig(
372355
"newRoomLlmQuery",
373-
"Query name entered for LLM rooms in the create-room form",
356+
trans("chatBoxV2.newRoomLlmQueryExposed"),
374357
),
375358
new NameConfig(
376359
"inviteTargetUserId",
377-
"User ID entered in the invite form — read in inviteSend event",
360+
trans("chatBoxV2.inviteTargetUserIdExposed"),
378361
),
379362
new NameConfig(
380363
"pendingInviteId",
381-
"Invite ID the user accepted or declined — read in inviteAccept/inviteDecline events",
364+
trans("chatBoxV2.pendingInviteIdExposed"),
382365
),
383366
NameConfigHidden,
384367
]);

‎client/packages/lowcoder/src/comps/comps/chatBoxComponentv2/components/ChatBoxView.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { CreateRoomModal } from "./CreateRoomModal";
1313
import { InviteUserModal } from "./InviteUserModal";
1414
import { useChatBox } from "../ChatBoxContext";
1515
import type { ChatRoom } from "../store";
16+
import { trans } from "i18n";
1617

1718
export const ChatBoxView = React.memo(() => {
1819
const ctx = useChatBox();
@@ -61,7 +62,7 @@ export const ChatBoxView = React.memo(() => {
6162
{ctx.currentRoomId && roomOnlineCount > 0 && (
6263
<OnlineCountBadge>
6364
<OnlineCountDot />
64-
{roomOnlineCount} online
65+
{trans("chatBoxV2.onlineCount", { count: roomOnlineCount })}
6566
</OnlineCountBadge>
6667
)}
6768
</ChatHeaderBar>

0 commit comments

Comments
 (0)