Skip to content

Commit ac272f5

Browse files
roryabrahamroryabraham
authored
Merge pull request Expensify#65564 from shubham1206agra/merge-tooltip-translations
Merge tooltip translations to get better auto-translations
2 parents 16ddf6f + 38d0765 commit ac272f5

14 files changed

Lines changed: 164 additions & 648 deletions

File tree

‎src/App.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,10 +86,10 @@ function App({url}: AppProps) {
8686
ThemeStylesProvider,
8787
ThemeIllustrationsProvider,
8888
SafeAreaProvider,
89+
HTMLEngineProvider,
8990
PortalProvider,
9091
SafeArea,
9192
LocaleContextProvider,
92-
HTMLEngineProvider,
9393
PopoverContextProvider,
9494
CurrentReportIDContextProvider,
9595
ScrollOffsetContextProvider,

‎src/components/HTMLEngineProvider/BaseHTMLEngineProvider.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,11 @@ function BaseHTMLEngineProvider({textSelectable = false, children, enableExperim
9696
},
9797
contentModel: HTMLContentModel.block,
9898
}),
99+
tooltip: HTMLElementModel.fromCustomModel({
100+
tagName: 'tooltip',
101+
mixedUAStyles: {whiteSpace: 'pre', ...styles.productTrainingTooltipText},
102+
contentModel: HTMLContentModel.block,
103+
}),
99104
strong: HTMLElementModel.fromCustomModel({
100105
tagName: 'strong',
101106
getMixedUAStyles: (tnode) => (isChildOfTaskTitle(tnode as TNode) ? {} : styles.strong),
@@ -149,6 +154,7 @@ function BaseHTMLEngineProvider({textSelectable = false, children, enableExperim
149154
styles.mb0,
150155
styles.colorMuted,
151156
styles.mutedNormalTextLabel,
157+
styles.productTrainingTooltipText,
152158
styles.textLabelSupporting,
153159
styles.lh16,
154160
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: 7 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,9 @@ 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+
<View style={[styles.renderHTML, styles.dFlex, styles.flexShrink1]}>
298+
<RenderHTML html={translate(tooltip.content)} />
299+
</View>
310300
{!tooltip?.shouldRenderActionButtons && (
311301
<PressableWithoutFeedback
312302
shouldUseAutoHitSlop
@@ -352,14 +342,13 @@ const useProductTrainingContext = (tooltipName: ProductTrainingTooltipName, shou
352342
styles.textAlignCenter,
353343
styles.gap3,
354344
styles.pv2,
355-
styles.productTrainingTooltipText,
356-
styles.textWrap,
357-
styles.mw100,
358345
styles.flex1,
359346
styles.justifyContentBetween,
360347
styles.ph2,
361348
styles.gap2,
362-
styles.textBold,
349+
styles.renderHTML,
350+
styles.dFlex,
351+
styles.flexShrink1,
363352
theme.tooltipHighlightText,
364353
theme.icon,
365354
translate,

‎src/languages/de.ts‎

Lines changed: 13 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -6971,66 +6971,23 @@ const translations = {
69716971
productTrainingTooltip: {
69726972
// TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room
69736973
// https://github.com/Expensify/App/issues/57045#issuecomment-2701455668
6974-
conciergeLHNGBR: {
6975-
part1: 'Loslegen',
6976-
part2: 'hier!',
6977-
},
6978-
saveSearchTooltip: {
6979-
part1: 'Benennen Sie Ihre gespeicherten Suchen um',
6980-
part2: 'hier!',
6981-
},
6982-
bottomNavInboxTooltip: {
6983-
part1: 'Überprüfen Sie was',
6984-
part2: 'benötigt Ihre Aufmerksamkeit',
6985-
part3: 'und',
6986-
part4: 'über Ausgaben chatten.',
6987-
},
6988-
workspaceChatTooltip: {
6989-
part1: 'Chatten mit',
6990-
part2: 'Genehmiger',
6991-
},
6992-
globalCreateTooltip: {
6993-
part1: 'Ausgaben erstellen',
6994-
part2: ', beginnen Sie zu chatten,',
6995-
part3: 'und mehr.',
6996-
part4: 'Probieren Sie es aus!',
6997-
},
6998-
GBRRBRChat: {
6999-
part1: 'Du wirst 🟢 auf sehen',
7000-
part2: 'Maßnahmen ergreifen',
7001-
part3: ',\nund 🔴 auf',
7002-
part4: 'Elemente zur Überprüfung.',
7003-
},
7004-
accountSwitcher: {
7005-
part1: 'Zugriff auf Ihre',
7006-
part2: 'Copilot-Konten',
7007-
part3: 'hier',
7008-
},
7009-
expenseReportsFilter: {
7010-
part1: 'Willkommen! Finden Sie alle Ihre',
7011-
part2: 'Berichte des Unternehmens',
7012-
part3: 'here.',
7013-
},
6974+
conciergeLHNGBR: '<tooltip>Loslegen <strong>hier!</strong></tooltip>',
6975+
saveSearchTooltip: '<tooltip><strong>Benennen Sie Ihre gespeicherten Suchen um</strong> hier!</tooltip>',
6976+
globalCreateTooltip: '<tooltip><strong>Ausgaben erstellen</strong>, beginnen Sie zu chatten, und mehr. Probieren Sie es aus!</tooltip>',
6977+
bottomNavInboxTooltip: '<tooltip>Überprüfen Sie was <strong>benötigt Ihre Aufmerksamkeit</strong> und <strong>über Ausgaben chatten.</strong></tooltip>',
6978+
workspaceChatTooltip: '<tooltip>Chatten mit <strong>Genehmigern</strong></tooltip>',
6979+
GBRRBRChat: '<tooltip>Du wirst 🟢 auf sehen <strong>Maßnahmen ergreifen</strong>, und 🔴 auf <strong>Elemente zur Überprüfung.</strong></tooltip>',
6980+
accountSwitcher: '<tooltip>Zugriff auf Ihre <strong>Copilot-Konten</strong> hier</tooltip>',
6981+
expenseReportsFilter: '<tooltip>Willkommen! Finden Sie alle Ihre <strong>Berichte des Unternehmens</strong> hier.</tooltip>',
70146982
scanTestTooltip: {
7015-
part1: 'Möchten Sie sehen, wie Scan funktioniert?',
7016-
part2: 'Probieren Sie einen Testbeleg aus!',
7017-
part3: 'Wählen Sie unsere',
7018-
part4: 'Testmanager',
7019-
part5: 'um es auszuprobieren!',
7020-
part6: 'Jetzt,',
7021-
part7: 'Reichen Sie Ihre Ausgaben ein',
7022-
part8: 'und sieh zu, wie die Magie geschieht!',
6983+
main: '<tooltip><strong>Möchten Sie sehen, wie Scan funktioniert?</strong> Probieren Sie einen Testbeleg aus!</tooltip>',
6984+
manager: '<tooltip>Wählen Sie unsere <strong>Testmanager</strong>, um es auszuprobieren!</tooltip>',
6985+
confirmation: '<tooltip>Jetzt, <strong>Reichen Sie Ihre Ausgaben ein</strong> und sieh zu, wie die Magie geschieht!</tooltip>',
70236986
tryItOut: 'Probieren Sie es aus',
70246987
noThanks: 'Nein danke',
70256988
},
7026-
outstandingFilter: {
7027-
part1: 'Filter für Ausgaben, die',
7028-
part2: 'Genehmigung erforderlich',
7029-
},
7030-
scanTestDriveTooltip: {
7031-
part1: 'Diesen Beleg senden an',
7032-
part2: 'Beenden Sie die Probefahrt!',
7033-
},
6989+
outstandingFilter: '<tooltip>Filter für Ausgaben, die <strong>Genehmigung erforderlich</strong></tooltip>',
6990+
scanTestDriveTooltip: '<tooltip>Diesen Beleg senden an <strong>Beenden Sie die Probefahrt!</strong></tooltip>',
70346991
},
70356992
discardChangesConfirmation: {
70366993
title: 'Änderungen verwerfen?',

0 commit comments

Comments
 (0)