enhancement(PayExpenseModal): add help for missing fees estimate (#10641

)

components/expenses/PayExpenseModal.tsx

@@ -3,6 +3,7 @@ import { useQuery } from '@apollo/client';
 import { Check } from '@styled-icons/boxicons-regular/Check';
 import { FormikProvider, useFormik, useFormikContext } from 'formik';
 import { cloneDeep, kebabCase, omit, round } from 'lodash';
+import { CircleHelp } from 'lucide-react';
 import { FormattedMessage, useIntl } from 'react-intl';
 import styled from 'styled-components';
 import type { BorderProps, SpaceProps } from 'styled-system';
@@ -34,6 +35,7 @@ import StyledModal, { ModalBody, ModalHeader } from '../StyledModal';
 import StyledSelect from '../StyledSelect';
 import StyledTooltip from '../StyledTooltip';
 import { H4, P, Span } from '../Text';
+import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/Tooltip';
 
 import { FieldGroup } from './PayoutBankInformationForm';
 import PayoutMethodData from './PayoutMethodData';
@@ -674,7 +676,18 @@ const PayExpenseModal = ({ onClose, onSubmit, expense, collective, host, error }
                   {amounts.paymentProcessorFee !== null ? (
                     <FormattedMessage id="TotalAmount" defaultMessage="Total amount" />
                   ) : (
-                    <FormattedMessage id="TotalAmountWithoutFee" defaultMessage="Total amount (without fees)" />
+                    <Tooltip>
+                      <TooltipTrigger className="flex items-center gap-1">
+                        <FormattedMessage id="TotalAmountWithoutFee" defaultMessage="Total amount (without fees)" />
+                        <CircleHelp size={16} className="text-muted-foreground" />
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <FormattedMessage
+                          defaultMessage="This payment provider doesn’t offer a way to calculate the fees in advance."
+                          id="EC5IZi"
+                        />
+                      </TooltipContent>
+                    </Tooltip>
                   )}
                 </Label>
                 <Amount>

lang/ca.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Edit",

lang/cs.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Aplikace \"{name}\" byla vytvořena",
   "E98WbS": "Opozitní e-mail účtu",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Nový koncept byl vytvořen pro <Expense>opakující se výdaje</Expense> na <Account></Account>",
   "EcwMPA": "Kontakt pověřený osobou",
   "Edit": "Upravit",

lang/de.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Anwendung \"{name}\" erstellt",
   "E98WbS": "E-Mail des Gegenkontos",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Neuer Entwurf für <Expense>wiederkehrende Ausgaben</Expense> auf <Account></Account> erstellt",
   "EcwMPA": "Ansprechpartner",
   "Edit": "Bearbeiten",

lang/en.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Edit",

lang/es.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Aplicación \"{name}\" creada",
   "E98WbS": "Correo electrónico de la cuenta opuesta",
   "E9pJQz": "Gasto #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Nuevo borrador creado para <Expense>gasto recurrente</Expense> en <Account></Account>",
   "EcwMPA": "Contactar con el cesionario",
   "Edit": "Editar",

lang/fr.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" créée",
   "E98WbS": "E-mail du compte de contrepartie",
   "E9pJQz": "Dépense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Nouveau brouillon créé pour une <Expense>dépense récurrente</Expense> sur <Account></Account>",
   "EcwMPA": "Contacter le responsable",
   "Edit": "Éditer",

lang/he.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "ההצעה \"{name}\" נוצרה",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "טיוטה חדשה עבור <Expense>הוצאה מחזורית</Expense> תוצרה לחשבון <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "עריכה",

lang/it.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Modifica",

lang/ja.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "編集",

lang/ko.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "편집",

lang/nl.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Applicatie \"{name}\" aangemaakt",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Bewerken",

lang/pl.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Utworzona aplikacja \"{name}\"",
   "E98WbS": "E-mail konta przeciwległego",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Nowy draft utworzony dla <Expense>wydatku cyklicznego</Expense> dla <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Edytuj",

lang/pt-BR.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Inscrição \"{name}\" criada",
   "E98WbS": "Email secundário",
   "E9pJQz": "Despesa #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Novo rascunho criado para <Expense>despesa recorrente</Expense> em <Account></Account>",
   "EcwMPA": "Contato atribuído",
   "Edit": "Editar",

lang/pt.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Editar",

lang/ru.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Application \"{name}\" created",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Редактировать",

lang/sk-SK.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Aplikácia \"{name}\" vytvorená",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Upraviť",

lang/sv-SE.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Applikation \"{name}\" skapad",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "Nytt utkast skapat för <Expense>återkommande utgift</Expense> på <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Redigera",

lang/uk.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "Застосунок «{name}» створено",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "New draft created for <Expense>recurring expense</Expense> on <Account></Account>",
   "EcwMPA": "Contact assignee",
   "Edit": "Змінити",

lang/zh.json

@@ -1191,6 +1191,7 @@
   "E8zg4M": "应用“{name}”已创建",
   "E98WbS": "Opposite Account Email",
   "E9pJQz": "Expense #{id}",
+  "EC5IZi": "This payment provider doesn’t offer a way to calculate the fees in advance.",
   "ecapW0": "已在 <Account></Account> 创建新的<Expense>定期支出</Expense>草稿",
   "EcwMPA": "联系受让人",
   "Edit": "编辑",