Skip to content

Commit 295e683

Browse files
authored
Merge pull request Expensify#65902 from samranahm/60178/global-create-in-chat-intro
feat: add global_create emoji in chat intro line
2 parents 06a92ad + 5f406b4 commit 295e683

14 files changed

Lines changed: 63 additions & 51 deletions

File tree

src/components/EmptyStateComponent/index.tsx

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ import Text from '@components/Text';
99
import VideoPlayer from '@components/VideoPlayer';
1010
import useResponsiveLayout from '@hooks/useResponsiveLayout';
1111
import useThemeStyles from '@hooks/useThemeStyles';
12+
import {containsCustomEmoji, containsOnlyCustomEmoji} from '@libs/EmojiUtils';
13+
import TextWithEmojiFragment from '@pages/home/report/comment/TextWithEmojiFragment';
1214
import CONST from '@src/CONST';
1315
import type {EmptyStateComponentProps, VideoLoadedEventType} from './types';
1416

@@ -35,6 +37,7 @@ function EmptyStateComponent({
3537
const styles = useThemeStyles();
3638
const [videoAspectRatio, setVideoAspectRatio] = useState(VIDEO_ASPECT_RATIO);
3739
const {shouldUseNarrowLayout} = useResponsiveLayout();
40+
const doesSubtitleContainCustomEmoji = containsCustomEmoji(subtitle ?? '') && !containsOnlyCustomEmoji(subtitle ?? '');
3841

3942
const setAspectRatio = (event: VideoReadyForDisplayEvent | VideoLoadedEventType | undefined) => {
4043
if (!event) {
@@ -100,7 +103,15 @@ function EmptyStateComponent({
100103
<View style={[styles.emptyStateHeader(headerMediaType === CONST.EMPTY_STATE_MEDIA.ILLUSTRATION), headerStyles]}>{HeaderComponent}</View>
101104
<View style={[shouldUseNarrowLayout ? styles.p5 : styles.p8, cardContentStyles]}>
102105
<Text style={[styles.textAlignCenter, styles.textHeadlineH1, styles.mb2, titleStyles]}>{title}</Text>
103-
{subtitleText ?? <Text style={[styles.textAlignCenter, styles.textSupporting, styles.textNormal]}>{subtitle}</Text>}
106+
{subtitleText ??
107+
(doesSubtitleContainCustomEmoji ? (
108+
<TextWithEmojiFragment
109+
style={[styles.textAlignCenter, styles.textSupporting, styles.textNormal]}
110+
message={subtitle}
111+
/>
112+
) : (
113+
<Text style={[styles.textAlignCenter, styles.textSupporting, styles.textNormal]}>{subtitle}</Text>
114+
))}
104115
{children}
105116
{!isEmpty(buttons) && (
106117
<View style={[styles.gap2, styles.mt5, !shouldUseNarrowLayout ? styles.flexRow : styles.flexColumn]}>

src/components/ReportWelcomeText.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,9 @@ import {
2323
temporary_getMoneyRequestOptions,
2424
} from '@libs/ReportUtils';
2525
import SidebarUtils from '@libs/SidebarUtils';
26-
import CONST from '@src/CONST';
26+
import TextWithEmojiFragment from '@pages/home/report/comment/TextWithEmojiFragment';
2727
import type {IOUType} from '@src/CONST';
28+
import CONST from '@src/CONST';
2829
import ONYXKEYS from '@src/ONYXKEYS';
2930
import ROUTES from '@src/ROUTES';
3031
import type {Policy, Report} from '@src/types/onyx';
@@ -128,15 +129,15 @@ function ReportWelcomeText({report, policy}: ReportWelcomeTextProps) {
128129
<RenderHTML html={welcomeMessage.messageHtml} />
129130
</View>
130131
)}
131-
{isSelfDM && (
132+
{isSystemChat && (
132133
<Text>
133134
<Text>{welcomeMessage.messageText}</Text>
134-
{shouldShowUsePlusButtonText && <Text>{translate('reportActionsView.usePlusButton', {additionalText})}</Text>}
135135
</Text>
136136
)}
137-
{isSystemChat && (
137+
{isSelfDM && (
138138
<Text>
139139
<Text>{welcomeMessage.messageText}</Text>
140+
{shouldShowUsePlusButtonText && <TextWithEmojiFragment message={translate('reportActionsView.usePlusButton', {additionalText})} />}
140141
</Text>
141142
)}
142143
{isDefault && displayNamesWithTooltips.length > 0 && (
@@ -163,7 +164,7 @@ function ReportWelcomeText({report, policy}: ReportWelcomeTextProps) {
163164
{index < displayNamesWithTooltips.length - 2 && <Text>, </Text>}
164165
</Text>
165166
))}
166-
{shouldShowUsePlusButtonText && <Text>{translate('reportActionsView.usePlusButton', {additionalText})}</Text>}
167+
{shouldShowUsePlusButtonText && <TextWithEmojiFragment message={translate('reportActionsView.usePlusButton', {additionalText})} />}
167168
{isConciergeChatReport(report) && <Text>{translate('reportActionsView.askConcierge')}</Text>}
168169
</Text>
169170
)}

src/languages/de.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -851,17 +851,17 @@ const translations = {
851851
beginningOfChatHistoryUserRoom: ({reportName, reportDetailsLink}: BeginningOfChatHistoryUserRoomParams) =>
852852
`Dieser Chatraum ist für alles, was mit <strong><a class="no-style-link" href="${reportDetailsLink}">${reportName}</a></strong> zu tun hat.`,
853853
beginningOfChatHistoryInvoiceRoom: ({invoicePayer, invoiceReceiver}: BeginningOfChatHistoryInvoiceRoomParams) =>
854-
`Dieser Chat ist für Rechnungen zwischen <strong>${invoicePayer}</strong> und <strong>${invoiceReceiver}</strong>. Verwenden Sie die Schaltfläche +, um eine Rechnung zu senden.`,
854+
`Dieser Chat ist für Rechnungen zwischen <strong>${invoicePayer}</strong> und <strong>${invoiceReceiver}</strong>. Verwenden Sie die Schaltfläche <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji>, um eine Rechnung zu senden.`,
855855
beginningOfChatHistory: 'Dieser Chat ist mit',
856856
beginningOfChatHistoryPolicyExpenseChat: ({workspaceName, submitterDisplayName}: BeginningOfChatHistoryPolicyExpenseChatParams) =>
857-
`Hier wird <strong>${submitterDisplayName}</strong> die Ausgaben an <strong>${workspaceName}</strong> übermitteln. Verwenden Sie einfach die Schaltfläche +.`,
857+
`Hier wird <strong>${submitterDisplayName}</strong> die Ausgaben an <strong>${workspaceName}</strong> übermitteln. Verwenden Sie einfach die Schaltfläche <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji>.`,
858858
beginningOfChatHistorySelfDM: 'Dies ist Ihr persönlicher Bereich. Nutzen Sie ihn für Notizen, Aufgaben, Entwürfe und Erinnerungen.',
859859
beginningOfChatHistorySystemDM: 'Willkommen! Lassen Sie uns mit der Einrichtung beginnen.',
860860
chatWithAccountManager: 'Hier mit Ihrem Kundenbetreuer chatten',
861861
sayHello: 'Hallo!',
862862
yourSpace: 'Ihr Bereich',
863863
welcomeToRoom: ({roomName}: WelcomeToRoomParams) => `Willkommen in ${roomName}!`,
864-
usePlusButton: ({additionalText}: UsePlusButtonParams) => `Verwenden Sie die + Taste, um ${additionalText} einen Ausgabenposten hinzuzufügen.`,
864+
usePlusButton: ({additionalText}: UsePlusButtonParams) => `Verwenden Sie die ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} Taste, um ${additionalText} einen Ausgabenposten hinzuzufügen.`,
865865
askConcierge: 'Stellen Sie Fragen und erhalten Sie rund um die Uhr Unterstützung in Echtzeit.',
866866
conciergeSupport: '24/7 Support',
867867
create: 'erstellen',
@@ -5897,7 +5897,7 @@ const translations = {
58975897
searchResults: {
58985898
emptyResults: {
58995899
title: 'Nichts zu zeigen',
5900-
subtitle: 'Versuchen Sie, Ihre Suchkriterien anzupassen oder etwas mit dem grünen + Button zu erstellen.',
5900+
subtitle: `Versuchen Sie, Ihre Suchkriterien anzupassen oder etwas mit dem grünen ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} Button zu erstellen.`,
59015901
},
59025902
emptyExpenseResults: {
59035903
title: 'Sie haben noch keine Ausgaben erstellt.',

src/languages/en.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -840,17 +840,17 @@ const translations = {
840840
beginningOfChatHistoryUserRoom: ({reportName, reportDetailsLink}: BeginningOfChatHistoryUserRoomParams) =>
841841
`This chat room is for anything <strong><a class="no-style-link" href="${reportDetailsLink}">${reportName}</a></strong> related.`,
842842
beginningOfChatHistoryInvoiceRoom: ({invoicePayer, invoiceReceiver}: BeginningOfChatHistoryInvoiceRoomParams) =>
843-
`This chat is for invoices between <strong>${invoicePayer}</strong> and <strong>${invoiceReceiver}</strong>. Use the + button to send an invoice.`,
843+
`This chat is for invoices between <strong>${invoicePayer}</strong> and <strong>${invoiceReceiver}</strong>. Use the <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji> button to send an invoice.`,
844844
beginningOfChatHistory: 'This chat is with ',
845845
beginningOfChatHistoryPolicyExpenseChat: ({workspaceName, submitterDisplayName}: BeginningOfChatHistoryPolicyExpenseChatParams) =>
846-
`This is where <strong>${submitterDisplayName}</strong> will submit expenses to <strong>${workspaceName}</strong>. Just use the + button.`,
846+
`This is where <strong>${submitterDisplayName}</strong> will submit expenses to <strong>${workspaceName}</strong>. Just use the <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji> button.`,
847847
beginningOfChatHistorySelfDM: 'This is your personal space. Use it for notes, tasks, drafts, and reminders.',
848848
beginningOfChatHistorySystemDM: "Welcome! Let's get you set up.",
849849
chatWithAccountManager: 'Chat with your account manager here',
850850
sayHello: 'Say hello!',
851851
yourSpace: 'Your space',
852852
welcomeToRoom: ({roomName}: WelcomeToRoomParams) => `Welcome to ${roomName}!`,
853-
usePlusButton: ({additionalText}: UsePlusButtonParams) => ` Use the + button to ${additionalText} an expense.`,
853+
usePlusButton: ({additionalText}: UsePlusButtonParams) => ` Use the ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} button to ${additionalText} an expense.`,
854854
askConcierge: ' Ask questions and get 24/7 realtime support.',
855855
conciergeSupport: '24/7 support',
856856
create: 'create',
@@ -5869,7 +5869,7 @@ const translations = {
58695869
searchResults: {
58705870
emptyResults: {
58715871
title: 'Nothing to show',
5872-
subtitle: 'Try adjusting your search criteria or creating something with the green + button.',
5872+
subtitle: `Try adjusting your search criteria or creating something with the green ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} button.`,
58735873
},
58745874
emptyExpenseResults: {
58755875
title: "You haven't created any expenses yet",

src/languages/es.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -833,17 +833,17 @@ const translations = {
833833
beginningOfChatHistoryUserRoom: ({reportName, reportDetailsLink}: BeginningOfChatHistoryUserRoomParams) =>
834834
`Esta sala de chat es para cualquier cosa relacionada con <strong><a class="no-style-link" href="${reportDetailsLink}">${reportName}</a></strong>.`,
835835
beginningOfChatHistoryInvoiceRoom: ({invoicePayer, invoiceReceiver}: BeginningOfChatHistoryInvoiceRoomParams) =>
836-
`Este chat es para facturas entre <strong>${invoicePayer}</strong> y <strong>${invoiceReceiver}</strong>. Usa el botón + para enviar una factura.`,
836+
`Este chat es para facturas entre <strong>${invoicePayer}</strong> y <strong>${invoiceReceiver}</strong>. Usa el botón <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji> para enviar una factura.`,
837837
beginningOfChatHistory: 'Este chat es con ',
838838
beginningOfChatHistoryPolicyExpenseChat: ({workspaceName, submitterDisplayName}: BeginningOfChatHistoryPolicyExpenseChatParams) =>
839-
`Aquí es donde <strong>${submitterDisplayName}</strong> enviará los gastos al espacio de trabajo <strong>${workspaceName}</strong>. Solo usa el botón +.`,
839+
`Aquí es donde <strong>${submitterDisplayName}</strong> enviará los gastos al espacio de trabajo <strong>${workspaceName}</strong>. Solo usa el botón <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji>.`,
840840
beginningOfChatHistorySelfDM: 'Este es tu espacio personal. Úsalo para notas, tareas, borradores y recordatorios.',
841841
beginningOfChatHistorySystemDM: '¡Bienvenido! Vamos a configurar tu cuenta.',
842842
chatWithAccountManager: 'Chatea con tu gestor de cuenta aquí',
843843
sayHello: '¡Saluda!',
844844
yourSpace: 'Tu espacio',
845845
welcomeToRoom: ({roomName}: WelcomeToRoomParams) => `¡Bienvenido a ${roomName}!`,
846-
usePlusButton: ({additionalText}: UsePlusButtonParams) => ` Usa el botón + para ${additionalText} un gasto`,
846+
usePlusButton: ({additionalText}: UsePlusButtonParams) => ` Usa el botón ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} para ${additionalText} un gasto`,
847847
askConcierge: ' Haz preguntas y obtén soporte en tiempo real las 24/7.',
848848
conciergeSupport: 'Soporte 24/7',
849849
create: 'crear',
@@ -5892,7 +5892,7 @@ const translations = {
58925892
searchResults: {
58935893
emptyResults: {
58945894
title: 'No hay nada que ver aquí',
5895-
subtitle: 'Intenta ajustar tus criterios de búsqueda o crear algo con el botón verde +.',
5895+
subtitle: `Intenta ajustar tus criterios de búsqueda o crear algo con el botón verde ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}.`,
58965896
},
58975897
emptyExpenseResults: {
58985898
title: 'Aún no has creado ningún gasto',

src/languages/fr.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -854,17 +854,17 @@ const translations = {
854854
beginningOfChatHistoryUserRoom: ({reportName, reportDetailsLink}: BeginningOfChatHistoryUserRoomParams) =>
855855
`Ce salon de discussion est destiné à tout ce qui concerne <strong><a class="no-style-link" href="${reportDetailsLink}">${reportName}</a></strong>.`,
856856
beginningOfChatHistoryInvoiceRoom: ({invoicePayer, invoiceReceiver}: BeginningOfChatHistoryInvoiceRoomParams) =>
857-
`Ce chat concerne les factures entre <strong>${invoicePayer}</strong> et <strong>${invoiceReceiver}</strong>. Utilisez le bouton + pour envoyer une facture.`,
857+
`Ce chat concerne les factures entre <strong>${invoicePayer}</strong> et <strong>${invoiceReceiver}</strong>. Utilisez le bouton <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji> pour envoyer une facture.`,
858858
beginningOfChatHistory: 'Ce chat est avec',
859859
beginningOfChatHistoryPolicyExpenseChat: ({workspaceName, submitterDisplayName}: BeginningOfChatHistoryPolicyExpenseChatParams) =>
860-
`C'est ici que <strong>${submitterDisplayName}</strong> soumettra ses dépenses à <strong>${workspaceName}</strong>. Il suffit d'utiliser le bouton +.`,
860+
`C'est ici que <strong>${submitterDisplayName}</strong> soumettra ses dépenses à <strong>${workspaceName}</strong>. Il suffit d'utiliser le bouton <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji>.`,
861861
beginningOfChatHistorySelfDM: "C'est votre espace personnel. Utilisez-le pour des notes, des tâches, des brouillons et des rappels.",
862862
beginningOfChatHistorySystemDM: 'Bienvenue ! Commençons votre configuration.',
863863
chatWithAccountManager: 'Discutez avec votre gestionnaire de compte ici',
864864
sayHello: 'Dites bonjour !',
865865
yourSpace: 'Votre espace',
866866
welcomeToRoom: ({roomName}: WelcomeToRoomParams) => `Bienvenue dans ${roomName} !`,
867-
usePlusButton: ({additionalText}: UsePlusButtonParams) => `Utilisez le bouton + pour ${additionalText} une dépense.`,
867+
usePlusButton: ({additionalText}: UsePlusButtonParams) => `Utilisez le bouton ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} pour ${additionalText} une dépense.`,
868868
askConcierge: 'Posez des questions et obtenez une assistance en temps réel 24h/24 et 7j/7.',
869869
conciergeSupport: 'Support 24h/24 et 7j/7',
870870
create: 'créer',
@@ -5911,7 +5911,7 @@ const translations = {
59115911
searchResults: {
59125912
emptyResults: {
59135913
title: 'Rien à afficher',
5914-
subtitle: "Essayez d'ajuster vos critères de recherche ou de créer quelque chose avec le bouton vert +.",
5914+
subtitle: `Essayez d'ajuster vos critères de recherche ou de créer quelque chose avec le bouton vert ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}.`,
59155915
},
59165916
emptyExpenseResults: {
59175917
title: "Vous n'avez pas encore créé de dépenses.",

src/languages/it.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -850,17 +850,17 @@ const translations = {
850850
beginningOfChatHistoryUserRoom: ({reportName, reportDetailsLink}: BeginningOfChatHistoryUserRoomParams) =>
851851
`Questa chat è per tutto ciò che riguarda <strong><a class="no-style-link" href="${reportDetailsLink}">${reportName}</a></strong>.`,
852852
beginningOfChatHistoryInvoiceRoom: ({invoicePayer, invoiceReceiver}: BeginningOfChatHistoryInvoiceRoomParams) =>
853-
`Questa chat è per le fatture tra <strong>${invoicePayer}</strong> e <strong>${invoiceReceiver}</strong>. Utilizzare il pulsante + per inviare una fattura.`,
853+
`Questa chat è per le fatture tra <strong>${invoicePayer}</strong> e <strong>${invoiceReceiver}</strong>. Utilizzare il pulsante <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji> per inviare una fattura.`,
854854
beginningOfChatHistory: 'Questa chat è con',
855855
beginningOfChatHistoryPolicyExpenseChat: ({workspaceName, submitterDisplayName}: BeginningOfChatHistoryPolicyExpenseChatParams) =>
856-
`È qui che <strong>${submitterDisplayName}</strong> presenterà le spese a <strong>${workspaceName}</strong>. Basta usare il pulsante +.`,
856+
`È qui che <strong>${submitterDisplayName}</strong> presenterà le spese a <strong>${workspaceName}</strong>. Basta usare il pulsante <emoji>${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}</emoji>.`,
857857
beginningOfChatHistorySelfDM: 'Questo è il tuo spazio personale. Usalo per appunti, compiti, bozze e promemoria.',
858858
beginningOfChatHistorySystemDM: 'Benvenuto! Iniziamo con la configurazione.',
859859
chatWithAccountManager: 'Chatta con il tuo account manager qui',
860860
sayHello: 'Ciao!',
861861
yourSpace: 'Il tuo spazio',
862862
welcomeToRoom: ({roomName}: WelcomeToRoomParams) => `Benvenuto in ${roomName}!`,
863-
usePlusButton: ({additionalText}: UsePlusButtonParams) => `Usa il pulsante + per ${additionalText} una spesa.`,
863+
usePlusButton: ({additionalText}: UsePlusButtonParams) => `Usa il pulsante ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE} per ${additionalText} una spesa.`,
864864
askConcierge: 'Fai domande e ricevi supporto in tempo reale 24/7.',
865865
conciergeSupport: 'Supporto 24/7',
866866
create: 'creare',
@@ -5913,7 +5913,7 @@ const translations = {
59135913
searchResults: {
59145914
emptyResults: {
59155915
title: 'Niente da mostrare',
5916-
subtitle: 'Prova a modificare i criteri di ricerca o a creare qualcosa con il pulsante verde +.',
5916+
subtitle: `Prova a modificare i criteri di ricerca o a creare qualcosa con il pulsante verde ${CONST.CUSTOM_EMOJIS.GLOBAL_CREATE}.`,
59175917
},
59185918
emptyExpenseResults: {
59195919
title: 'Non hai ancora creato nessuna spesa.',

0 commit comments

Comments
 (0)