From df566ce08519f9e5d58a849cfc2036c2f6369e38 Mon Sep 17 00:00:00 2001 From: Julian Kobrynski Date: Mon, 3 Feb 2025 16:01:55 +0100 Subject: [PATCH 01/29] add an option to display action buttons in tooltips --- .../ProductTrainingContext/TOOLTIPS.ts | 2 + .../ProductTrainingContext/index.tsx | 58 +++++++++++++------ src/languages/en.ts | 2 + src/languages/es.ts | 2 + 4 files changed, 45 insertions(+), 19 deletions(-) diff --git a/src/components/ProductTrainingContext/TOOLTIPS.ts b/src/components/ProductTrainingContext/TOOLTIPS.ts index 2e553b21681a..fa907d040659 100644 --- a/src/components/ProductTrainingContext/TOOLTIPS.ts +++ b/src/components/ProductTrainingContext/TOOLTIPS.ts @@ -27,6 +27,7 @@ type TooltipData = { name: ProductTrainingTooltipName; priority: number; shouldShow: (props: ShouldShowConditionProps) => boolean; + shouldRenderActionButtons?: boolean; }; const TOOLTIPS: Record = { @@ -129,6 +130,7 @@ const TOOLTIPS: Record = { name: SCAN_TEST_TOOLTIP, priority: 900, shouldShow: () => false, + shouldRenderActionButtons: true, }, }; diff --git a/src/components/ProductTrainingContext/index.tsx b/src/components/ProductTrainingContext/index.tsx index a7806574126d..0d8a115f2a4e 100644 --- a/src/components/ProductTrainingContext/index.tsx +++ b/src/components/ProductTrainingContext/index.tsx @@ -1,6 +1,7 @@ import React, {createContext, useCallback, useContext, useEffect, useMemo, useState} from 'react'; import {View} from 'react-native'; import {useOnyx} from 'react-native-onyx'; +import Button from '@components/Button'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; @@ -176,35 +177,54 @@ const useProductTrainingContext = (tooltipName: ProductTrainingTooltipName, shou const renderProductTrainingTooltip = useCallback(() => { const tooltip = TOOLTIPS[tooltipName]; return ( - - - - {tooltip.content.map(({text, isBold}) => { - const translatedText = translate(text); - return ( - - {translatedText} - - ); - })} - + + + + + {tooltip.content.map(({text, isBold}) => { + const translatedText = translate(text); + return ( + + {translatedText} + + ); + })} + + + {!!tooltip?.shouldRenderActionButtons && ( + +