Skip to content

Commit 648d1e5

Browse files
Merge tooltip translations to get better auto-translations
1 parent 9a1b8da commit 648d1e5

13 files changed

Lines changed: 158 additions & 647 deletions

File tree

src/components/HTMLEngineProvider/BaseHTMLEngineProvider.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,11 @@ function BaseHTMLEngineProvider({textSelectable = false, children, enableExperim
9191
},
9292
contentModel: HTMLContentModel.block,
9393
}),
94+
tooltip: HTMLElementModel.fromCustomModel({
95+
tagName: 'tooltip',
96+
mixedUAStyles: {whiteSpace: 'pre', ...styles.productTrainingTooltipText},
97+
contentModel: HTMLContentModel.block,
98+
}),
9499
strong: HTMLElementModel.fromCustomModel({
95100
tagName: 'strong',
96101
getMixedUAStyles: (tnode) => (isChildOfTaskTitle(tnode as TNode) ? {} : styles.strong),
@@ -144,6 +149,7 @@ function BaseHTMLEngineProvider({textSelectable = false, children, enableExperim
144149
styles.mb0,
145150
styles.colorMuted,
146151
styles.mutedNormalTextLabel,
152+
styles.productTrainingTooltipText,
147153
styles.textLabelSupporting,
148154
styles.lh16,
149155
styles.textSupporting,

src/components/ProductTrainingContext/TOOLTIPS.ts

Lines changed: 14 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ type ShouldShowConditionProps = {
3131
};
3232

3333
type TooltipData = {
34-
content: Array<{text: TranslationPaths; isBold: boolean}>;
34+
content: TranslationPaths;
3535
onHideTooltip: (isDismissedUsingCloseButton?: boolean) => void;
3636
name: ProductTrainingTooltipName;
3737
priority: number;
@@ -41,10 +41,7 @@ type TooltipData = {
4141

4242
const TOOLTIPS: Record<ProductTrainingTooltipName, TooltipData> = {
4343
[CONCIERGE_LHN_GBR]: {
44-
content: [
45-
{text: 'productTrainingTooltip.conciergeLHNGBR.part1', isBold: false},
46-
{text: 'productTrainingTooltip.conciergeLHNGBR.part2', isBold: true},
47-
],
44+
content: 'productTrainingTooltip.conciergeLHNGBR',
4845
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(CONCIERGE_LHN_GBR, isDismissedUsingCloseButton),
4946
name: CONCIERGE_LHN_GBR,
5047
priority: 1300,
@@ -53,132 +50,86 @@ const TOOLTIPS: Record<ProductTrainingTooltipName, TooltipData> = {
5350
shouldShow: () => false,
5451
},
5552
[RENAME_SAVED_SEARCH]: {
56-
content: [
57-
{text: 'productTrainingTooltip.saveSearchTooltip.part1', isBold: true},
58-
{text: 'productTrainingTooltip.saveSearchTooltip.part2', isBold: false},
59-
],
53+
content: 'productTrainingTooltip.saveSearchTooltip',
6054
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(RENAME_SAVED_SEARCH, isDismissedUsingCloseButton),
6155
name: RENAME_SAVED_SEARCH,
6256
priority: 1250,
6357
shouldShow: ({shouldUseNarrowLayout}) => !shouldUseNarrowLayout,
6458
},
6559
[GLOBAL_CREATE_TOOLTIP]: {
66-
content: [
67-
{text: 'productTrainingTooltip.globalCreateTooltip.part1', isBold: true},
68-
{text: 'productTrainingTooltip.globalCreateTooltip.part2', isBold: false},
69-
{text: 'productTrainingTooltip.globalCreateTooltip.part3', isBold: false},
70-
{text: 'productTrainingTooltip.globalCreateTooltip.part4', isBold: false},
71-
],
60+
content: 'productTrainingTooltip.globalCreateTooltip',
7261
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(GLOBAL_CREATE_TOOLTIP, isDismissedUsingCloseButton),
7362
name: GLOBAL_CREATE_TOOLTIP,
7463
priority: 1950,
7564
shouldShow: ({isUserPolicyEmployee}) => isUserPolicyEmployee,
7665
},
7766
[BOTTOM_NAV_INBOX_TOOLTIP]: {
78-
content: [
79-
{text: 'productTrainingTooltip.bottomNavInboxTooltip.part1', isBold: false},
80-
{text: 'productTrainingTooltip.bottomNavInboxTooltip.part2', isBold: true},
81-
{text: 'productTrainingTooltip.bottomNavInboxTooltip.part3', isBold: false},
82-
{text: 'productTrainingTooltip.bottomNavInboxTooltip.part4', isBold: true},
83-
],
67+
content: 'productTrainingTooltip.bottomNavInboxTooltip',
8468
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(BOTTOM_NAV_INBOX_TOOLTIP, isDismissedUsingCloseButton),
8569
name: BOTTOM_NAV_INBOX_TOOLTIP,
8670
priority: 1700,
8771
shouldShow: ({hasBeenAddedToNudgeMigration}) => hasBeenAddedToNudgeMigration,
8872
},
8973
[LHN_WORKSPACE_CHAT_TOOLTIP]: {
90-
content: [
91-
{text: 'productTrainingTooltip.workspaceChatTooltip.part1', isBold: false},
92-
{text: 'productTrainingTooltip.workspaceChatTooltip.part2', isBold: true},
93-
],
74+
content: 'productTrainingTooltip.workspaceChatTooltip',
9475
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(LHN_WORKSPACE_CHAT_TOOLTIP, isDismissedUsingCloseButton),
9576
name: LHN_WORKSPACE_CHAT_TOOLTIP,
9677
priority: 1800,
9778
shouldShow: ({isUserPolicyEmployee}) => isUserPolicyEmployee,
9879
},
9980
[GBR_RBR_CHAT]: {
100-
content: [
101-
{text: 'productTrainingTooltip.GBRRBRChat.part1', isBold: false},
102-
{text: 'productTrainingTooltip.GBRRBRChat.part2', isBold: true},
103-
{text: 'productTrainingTooltip.GBRRBRChat.part3', isBold: false},
104-
{text: 'productTrainingTooltip.GBRRBRChat.part4', isBold: true},
105-
],
81+
content: 'productTrainingTooltip.GBRRBRChat',
10682
onHideTooltip: () => dismissProductTraining(GBR_RBR_CHAT),
10783
name: GBR_RBR_CHAT,
10884
priority: 1900,
10985
shouldShow: () => true,
11086
},
11187
[ACCOUNT_SWITCHER]: {
112-
content: [
113-
{text: 'productTrainingTooltip.accountSwitcher.part1', isBold: false},
114-
{text: 'productTrainingTooltip.accountSwitcher.part2', isBold: true},
115-
{text: 'productTrainingTooltip.accountSwitcher.part3', isBold: false},
116-
],
88+
content: 'productTrainingTooltip.accountSwitcher',
11789
onHideTooltip: () => dismissProductTraining(ACCOUNT_SWITCHER),
11890
name: ACCOUNT_SWITCHER,
11991
priority: 1600,
12092
shouldShow: () => true,
12193
},
12294
[EXPENSE_REPORTS_FILTER]: {
123-
content: [
124-
{text: 'productTrainingTooltip.expenseReportsFilter.part1', isBold: false},
125-
{text: 'productTrainingTooltip.expenseReportsFilter.part2', isBold: true},
126-
{text: 'productTrainingTooltip.expenseReportsFilter.part3', isBold: false},
127-
],
95+
content: 'productTrainingTooltip.expenseReportsFilter',
12896
onHideTooltip: () => dismissProductTraining(EXPENSE_REPORTS_FILTER),
12997
name: EXPENSE_REPORTS_FILTER,
13098
priority: 2000,
13199
shouldShow: ({shouldUseNarrowLayout, isUserPolicyAdmin, hasBeenAddedToNudgeMigration}: ShouldShowConditionProps) =>
132100
!shouldUseNarrowLayout && isUserPolicyAdmin && hasBeenAddedToNudgeMigration,
133101
},
134102
[SCAN_TEST_TOOLTIP]: {
135-
content: [
136-
{text: 'productTrainingTooltip.scanTestTooltip.part1', isBold: true},
137-
{text: 'productTrainingTooltip.scanTestTooltip.part2', isBold: false},
138-
],
103+
content: 'productTrainingTooltip.scanTestTooltip.main',
139104
onHideTooltip: () => dismissProductTraining(SCAN_TEST_TOOLTIP),
140105
name: SCAN_TEST_TOOLTIP,
141106
priority: 900,
142107
shouldShow: ({isUserInPaidPolicy, hasBeenAddedToNudgeMigration}) => !isUserInPaidPolicy && !hasBeenAddedToNudgeMigration,
143108
shouldRenderActionButtons: true,
144109
},
145110
[SCAN_TEST_TOOLTIP_MANAGER]: {
146-
content: [
147-
{text: 'productTrainingTooltip.scanTestTooltip.part3', isBold: false},
148-
{text: 'productTrainingTooltip.scanTestTooltip.part4', isBold: true},
149-
{text: 'productTrainingTooltip.scanTestTooltip.part5', isBold: false},
150-
],
111+
content: 'productTrainingTooltip.scanTestTooltip.manager',
151112
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(SCAN_TEST_TOOLTIP_MANAGER, isDismissedUsingCloseButton),
152113
name: SCAN_TEST_TOOLTIP_MANAGER,
153114
priority: 1000,
154115
shouldShow: ({hasBeenAddedToNudgeMigration}) => !hasBeenAddedToNudgeMigration,
155116
},
156117
[SCAN_TEST_CONFIRMATION]: {
157-
content: [
158-
{text: 'productTrainingTooltip.scanTestTooltip.part6', isBold: false},
159-
{text: 'productTrainingTooltip.scanTestTooltip.part7', isBold: true},
160-
{text: 'productTrainingTooltip.scanTestTooltip.part8', isBold: false},
161-
],
118+
content: 'productTrainingTooltip.scanTestTooltip.confirmation',
162119
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(SCAN_TEST_CONFIRMATION, isDismissedUsingCloseButton),
163120
name: SCAN_TEST_CONFIRMATION,
164121
priority: 1100,
165122
shouldShow: ({hasBeenAddedToNudgeMigration}) => !hasBeenAddedToNudgeMigration,
166123
},
167124
[OUTSTANDING_FILTER]: {
168-
content: [
169-
{text: 'productTrainingTooltip.outstandingFilter.part1', isBold: false},
170-
{text: 'productTrainingTooltip.outstandingFilter.part2', isBold: true},
171-
],
125+
content: 'productTrainingTooltip.outstandingFilter',
172126
onHideTooltip: () => dismissProductTraining(OUTSTANDING_FILTER),
173127
name: OUTSTANDING_FILTER,
174128
priority: 1925,
175129
shouldShow: ({isUserPolicyAdmin}) => isUserPolicyAdmin,
176130
},
177131
[SCAN_TEST_DRIVE_CONFIRMATION]: {
178-
content: [
179-
{text: 'productTrainingTooltip.scanTestDriveTooltip.part1', isBold: false},
180-
{text: 'productTrainingTooltip.scanTestDriveTooltip.part2', isBold: true},
181-
],
132+
content: 'productTrainingTooltip.scanTestDriveTooltip',
182133
onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(SCAN_TEST_DRIVE_CONFIRMATION, isDismissedUsingCloseButton),
183134
name: SCAN_TEST_DRIVE_CONFIRMATION,
184135
priority: 1200,

src/components/ProductTrainingContext/index.tsx

Lines changed: 2 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Button from '@components/Button';
44
import Icon from '@components/Icon';
55
import * as Expensicons from '@components/Icon/Expensicons';
66
import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback';
7-
import Text from '@components/Text';
7+
import RenderHTML from '@components/RenderHTML';
88
import useLocalize from '@hooks/useLocalize';
99
import useOnyx from '@hooks/useOnyx';
1010
import useResponsiveLayout from '@hooks/useResponsiveLayout';
@@ -294,19 +294,7 @@ const useProductTrainingContext = (tooltipName: ProductTrainingTooltipName, shou
294294
fill={theme.tooltipHighlightText}
295295
medium
296296
/>
297-
<Text style={[styles.productTrainingTooltipText, styles.textWrap, styles.mw100]}>
298-
{tooltip.content.map(({text, isBold}) => {
299-
const translatedText = translate(text);
300-
return (
301-
<Text
302-
key={text}
303-
style={[styles.productTrainingTooltipText, isBold && styles.textBold]}
304-
>
305-
{translatedText}
306-
</Text>
307-
);
308-
})}
309-
</Text>
297+
<RenderHTML html={translate(tooltip.content)} />
310298
{!tooltip?.shouldRenderActionButtons && (
311299
<PressableWithoutFeedback
312300
shouldUseAutoHitSlop
@@ -352,14 +340,10 @@ const useProductTrainingContext = (tooltipName: ProductTrainingTooltipName, shou
352340
styles.textAlignCenter,
353341
styles.gap3,
354342
styles.pv2,
355-
styles.productTrainingTooltipText,
356-
styles.textWrap,
357-
styles.mw100,
358343
styles.flex1,
359344
styles.justifyContentBetween,
360345
styles.ph2,
361346
styles.gap2,
362-
styles.textBold,
363347
theme.tooltipHighlightText,
364348
theme.icon,
365349
translate,

src/languages/de.ts

Lines changed: 13 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -6952,66 +6952,23 @@ const translations = {
69526952
productTrainingTooltip: {
69536953
// TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room
69546954
// https://github.com/Expensify/App/issues/57045#issuecomment-2701455668
6955-
conciergeLHNGBR: {
6956-
part1: 'Loslegen',
6957-
part2: 'hier!',
6958-
},
6959-
saveSearchTooltip: {
6960-
part1: 'Benennen Sie Ihre gespeicherten Suchen um',
6961-
part2: 'hier!',
6962-
},
6963-
bottomNavInboxTooltip: {
6964-
part1: 'Überprüfen Sie was',
6965-
part2: 'benötigt Ihre Aufmerksamkeit',
6966-
part3: 'und',
6967-
part4: 'über Ausgaben chatten.',
6968-
},
6969-
workspaceChatTooltip: {
6970-
part1: 'Chatten mit',
6971-
part2: 'Genehmiger',
6972-
},
6973-
globalCreateTooltip: {
6974-
part1: 'Ausgaben erstellen',
6975-
part2: ', beginnen Sie zu chatten,',
6976-
part3: 'und mehr.',
6977-
part4: 'Probieren Sie es aus!',
6978-
},
6979-
GBRRBRChat: {
6980-
part1: 'Du wirst 🟢 auf sehen',
6981-
part2: 'Maßnahmen ergreifen',
6982-
part3: ',\nund 🔴 auf',
6983-
part4: 'Elemente zur Überprüfung.',
6984-
},
6985-
accountSwitcher: {
6986-
part1: 'Zugriff auf Ihre',
6987-
part2: 'Copilot-Konten',
6988-
part3: 'hier',
6989-
},
6990-
expenseReportsFilter: {
6991-
part1: 'Willkommen! Finden Sie alle Ihre',
6992-
part2: 'Berichte des Unternehmens',
6993-
part3: 'here.',
6994-
},
6955+
conciergeLHNGBR: '<tooltip>Loslegen <strong>hier!</strong></tooltip>',
6956+
saveSearchTooltip: '<tooltip><strong>Benennen Sie Ihre gespeicherten Suchen um</strong> hier!</tooltip>',
6957+
globalCreateTooltip: '<tooltip><strong>Ausgaben erstellen</strong>, beginnen Sie zu chatten, und mehr. Probieren Sie es aus!</tooltip>',
6958+
bottomNavInboxTooltip: '<tooltip>Überprüfen Sie was <strong>benötigt Ihre Aufmerksamkeit</strong> und <strong>über Ausgaben chatten.</strong></tooltip>',
6959+
workspaceChatTooltip: '<tooltip>Chatten mit <strong>Genehmigern</strong></tooltip>',
6960+
GBRRBRChat: '<tooltip>Du wirst 🟢 auf sehen <strong>Maßnahmen ergreifen</strong>,\nund 🔴 auf <strong>Elemente zur Überprüfung.</strong></tooltip>',
6961+
accountSwitcher: '<tooltip>Zugriff auf Ihre <strong>Copilot-Konten</strong> hier</tooltip>',
6962+
expenseReportsFilter: '<tooltip>Willkommen! Finden Sie alle Ihre <strong>Berichte des Unternehmens</strong> hier.</tooltip>',
69956963
scanTestTooltip: {
6996-
part1: 'Möchten Sie sehen, wie Scan funktioniert?',
6997-
part2: 'Probieren Sie einen Testbeleg aus!',
6998-
part3: 'Wählen Sie unsere',
6999-
part4: 'Testmanager',
7000-
part5: 'um es auszuprobieren!',
7001-
part6: 'Jetzt,',
7002-
part7: 'Reichen Sie Ihre Ausgaben ein',
7003-
part8: 'und sieh zu, wie die Magie geschieht!',
6964+
main: '<tooltip><strong>Möchten Sie sehen, wie Scan funktioniert?</strong> Probieren Sie einen Testbeleg aus!</tooltip>',
6965+
manager: '<tooltip>Wählen Sie unsere <strong>Testmanager</strong>, um es auszuprobieren!</tooltip>',
6966+
confirmation: '<tooltip>Jetzt, <strong>Reichen Sie Ihre Ausgaben ein</strong> und sieh zu, wie die Magie geschieht!</tooltip>',
70046967
tryItOut: 'Probieren Sie es aus',
70056968
noThanks: 'Nein danke',
70066969
},
7007-
outstandingFilter: {
7008-
part1: 'Filter für Ausgaben, die',
7009-
part2: 'Genehmigung erforderlich',
7010-
},
7011-
scanTestDriveTooltip: {
7012-
part1: 'Diesen Beleg senden an',
7013-
part2: 'Beenden Sie die Probefahrt!',
7014-
},
6970+
outstandingFilter: '<tooltip>Filter für Ausgaben, die <strong>Genehmigung erforderlich</strong></tooltip>',
6971+
scanTestDriveTooltip: '<tooltip>Diesen Beleg senden an <strong>Beenden Sie die Probefahrt!</strong></tooltip>',
70156972
},
70166973
discardChangesConfirmation: {
70176974
title: 'Änderungen verwerfen?',

src/languages/en.ts

Lines changed: 13 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -6909,66 +6909,23 @@ const translations = {
69096909
productTrainingTooltip: {
69106910
// TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room
69116911
// https://github.com/Expensify/App/issues/57045#issuecomment-2701455668
6912-
conciergeLHNGBR: {
6913-
part1: 'Get started',
6914-
part2: ' here!',
6915-
},
6916-
saveSearchTooltip: {
6917-
part1: 'Rename your saved searches',
6918-
part2: ' here!',
6919-
},
6920-
bottomNavInboxTooltip: {
6921-
part1: 'Check what ',
6922-
part2: 'needs your attention',
6923-
part3: '\nand ',
6924-
part4: 'chat about expenses.',
6925-
},
6926-
workspaceChatTooltip: {
6927-
part1: 'Chat with ',
6928-
part2: 'approvers',
6929-
},
6930-
globalCreateTooltip: {
6931-
part1: 'Create expenses',
6932-
part2: ', start chatting,',
6933-
part3: '\nand more.',
6934-
part4: ' Try it out!',
6935-
},
6936-
GBRRBRChat: {
6937-
part1: 'You’ll see 🟢 on ',
6938-
part2: 'actions to take',
6939-
part3: ',\nand 🔴 on ',
6940-
part4: 'items to review.',
6941-
},
6942-
accountSwitcher: {
6943-
part1: 'Access your ',
6944-
part2: 'Copilot accounts',
6945-
part3: ' here',
6946-
},
6947-
expenseReportsFilter: {
6948-
part1: 'Welcome! Find all of your',
6949-
part2: "\ncompany's reports",
6950-
part3: ' here.',
6951-
},
6912+
conciergeLHNGBR: '<tooltip>Get started <strong>here!</strong></tooltip>',
6913+
saveSearchTooltip: '<tooltip><strong>Rename your saved searches</strong> here!</tooltip>',
6914+
globalCreateTooltip: '<tooltip><strong>Create expenses</strong>, start chatting,\nand more. Try it out!</tooltip>',
6915+
bottomNavInboxTooltip: '<tooltip>Check what <strong>needs your attention</strong>\nand <strong>chat about expenses.</strong></tooltip>',
6916+
workspaceChatTooltip: '<tooltip>Chat with <strong>approvers</strong></tooltip>',
6917+
GBRRBRChat: '<tooltip>You’ll see 🟢 on <strong>actions to take</strong>,\nand 🔴 on <strong>items to review.</strong></tooltip>',
6918+
accountSwitcher: '<tooltip>Access your <strong>Copilot accounts</strong> here</tooltip>',
6919+
expenseReportsFilter: "<tooltip>Welcome! Find all of your\n<strong>company's reports</strong> here.</tooltip>",
69526920
scanTestTooltip: {
6953-
part1: 'Scan our test receipt',
6954-
part2: ' to see how it works!',
6955-
part3: 'Choose our',
6956-
part4: ' test manager',
6957-
part5: ' to try it out!',
6958-
part6: 'Now,',
6959-
part7: ' submit your expense',
6960-
part8: ' and watch the\nmagic happen!',
6921+
main: '<tooltip><strong>Scan our test receipt</strong> to see how it works!</tooltip>',
6922+
manager: '<tooltip>Choose our <strong>test manager</strong> to try it out!</tooltip>',
6923+
confirmation: '<tooltip>Now, <strong>submit your expense</strong> and watch the\nmagic happen!</tooltip>',
69616924
tryItOut: 'Try it out',
69626925
noThanks: 'No thanks',
69636926
},
6964-
outstandingFilter: {
6965-
part1: 'Filter for expenses\nthat ',
6966-
part2: 'need approval',
6967-
},
6968-
scanTestDriveTooltip: {
6969-
part1: 'Send this receipt to\n',
6970-
part2: 'complete the test drive!',
6971-
},
6927+
outstandingFilter: '<tooltip>Filter for expenses\nthat <strong>need approval</strong></tooltip>',
6928+
scanTestDriveTooltip: '<tooltip>Send this receipt to\n<strong>complete the test drive!</strong></tooltip>',
69726929
},
69736930
discardChangesConfirmation: {
69746931
title: 'Discard changes?',

0 commit comments

Comments
 (0)