commit 1532472eb4a6718c118862333e144f76fa4dab8a parent 648aa570bb47c9eaa6bef3071a44e2c031149f2e Author: Sebastian <sebasjm@gmail.com> Date: Tue, 25 Nov 2025 08:55:23 -0300 hide merchant integration when account is admin or exchange Diffstat:
| M | packages/bank-ui/src/pages/account/ShowAccountDetails.tsx | | | 448 | ++++++++++++++++++++++++++++++++++++++++--------------------------------------- |
1 file changed, 225 insertions(+), 223 deletions(-)
diff --git a/packages/bank-ui/src/pages/account/ShowAccountDetails.tsx b/packages/bank-ui/src/pages/account/ShowAccountDetails.tsx @@ -244,276 +244,278 @@ export function ShowAccountDetails({ </div> </AccountForm> </div> - <div class="grid grid-cols-1 gap-x-8 gap-y-8 pt-6 md:grid-cols-3 bg-gray-100 my-4 px-4 pb-4 rounded-lg"> - <div class="px-4 sm:px-0"> - <h2 class="text-base font-semibold leading-7 text-gray-900"> - <div class="flex items-center justify-between"> - <span class="flex flex-grow flex-col"> - <span - class="text-sm text-black font-semibold leading-6 " - id="availability-label" - > - <i18n.Translate>Merchant integration</i18n.Translate> + {result.body.is_taler_exchange || account === "admin" ? undefined : ( + <div class="grid grid-cols-1 gap-x-8 gap-y-8 pt-6 md:grid-cols-3 bg-gray-100 my-4 px-4 pb-4 rounded-lg"> + <div class="px-4 sm:px-0"> + <h2 class="text-base font-semibold leading-7 text-gray-900"> + <div class="flex items-center justify-between"> + <span class="flex flex-grow flex-col"> + <span + class="text-sm text-black font-semibold leading-6 " + id="availability-label" + > + <i18n.Translate>Merchant integration</i18n.Translate> + </span> </span> - </span> - </div> - </h2> - <p class="mt-2 text-sm text-gray-500"> - <i18n.Translate> - Use this information to link your Taler Merchant Backoffice - account with the current bank account. You can start by copying - the values, then go to your merchant backoffice service provider, - login into your account and look for the "import" button in the - "bank account" section. - </i18n.Translate> - </p> - </div> + </div> + </h2> + <p class="mt-2 text-sm text-gray-500"> + <i18n.Translate> + Use this information to link your Taler Merchant Backoffice + account with the current bank account. You can start by copying + the values, then go to your merchant backoffice service + provider, login into your account and look for the "import" + button in the "bank account" section. + </i18n.Translate> + </p> + </div> - {payto !== undefined && ( - <div class="bg-white shadow-sm ring-1 ring-gray-900/5 sm:rounded-xl md:col-span-2"> - <div class="px-4 py-6 sm:p-8"> - <div class="grid max-w-2xl grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6"> - <div class="sm:col-span-5"> - <label - class="block text-sm font-medium leading-6 text-gray-900" - for="account-type" - > - {i18n.str`Account type`} - </label> - <div class="mt-2"> - <input - type="text" - class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="account-type" - id="account-type" - disabled={true} - value={payto.targetType} - autocomplete="off" - /> + {payto !== undefined && ( + <div class="bg-white shadow-sm ring-1 ring-gray-900/5 sm:rounded-xl md:col-span-2"> + <div class="px-4 py-6 sm:p-8"> + <div class="grid max-w-2xl grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6"> + <div class="sm:col-span-5"> + <label + class="block text-sm font-medium leading-6 text-gray-900" + for="account-type" + > + {i18n.str`Account type`} + </label> + <div class="mt-2"> + <input + type="text" + class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" + name="account-type" + id="account-type" + disabled={true} + value={payto.targetType} + autocomplete="off" + /> + </div> + <p class="mt-2 text-sm text-gray-500"> + <i18n.Translate> + Method to use for wire transfer. + </i18n.Translate> + </p> </div> - <p class="mt-2 text-sm text-gray-500"> - <i18n.Translate> - Method to use for wire transfer. - </i18n.Translate> - </p> - </div> - {((payto) => { - switch (payto.targetType) { - case "iban": { - return ( - <div class="sm:col-span-5"> - <label - class="block text-sm font-medium leading-6 text-gray-900" - for="iban" - > - {i18n.str`IBAN`} - </label> - <div class="mt-2"> - <div class="flex justify-between"> - <input - type="text" - class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="iban" - id="iban" - disabled={true} - value={payto.iban} - autocomplete="off" - /> - <CopyButton - class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " - getContent={() => payto.iban} - /> - </div> - </div> - <p class="mt-2 text-sm text-gray-500"> - <i18n.Translate> - International Bank Account Number. - </i18n.Translate> - </p> - </div> - ); - } - case "x-taler-bank": { - return ( - <Fragment> + {((payto) => { + switch (payto.targetType) { + case "iban": { + return ( <div class="sm:col-span-5"> <label class="block text-sm font-medium leading-6 text-gray-900" - for="account-host" + for="iban" > - {i18n.str`Account name`} + {i18n.str`IBAN`} </label> <div class="mt-2"> <div class="flex justify-between"> <input type="text" class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="account-host" - id="account-host" + name="iban" + id="iban" disabled={true} - value={payto.host} + value={payto.iban} autocomplete="off" /> + <CopyButton + class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " + getContent={() => payto.iban} + /> </div> - <CopyButton - class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " - getContent={() => payto.host} - /> </div> - <p class="mt-2 text-sm text-gray-500"> <i18n.Translate> - Bank host where the service is located. + International Bank Account Number. </i18n.Translate> </p> </div> + ); + } + case "x-taler-bank": { + return ( + <Fragment> + <div class="sm:col-span-5"> + <label + class="block text-sm font-medium leading-6 text-gray-900" + for="account-host" + > + {i18n.str`Account name`} + </label> + <div class="mt-2"> + <div class="flex justify-between"> + <input + type="text" + class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" + name="account-host" + id="account-host" + disabled={true} + value={payto.host} + autocomplete="off" + /> + </div> + <CopyButton + class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " + getContent={() => payto.host} + /> + </div> + + <p class="mt-2 text-sm text-gray-500"> + <i18n.Translate> + Bank host where the service is located. + </i18n.Translate> + </p> + </div> + <div class="sm:col-span-5"> + <label + class="block text-sm font-medium leading-6 text-gray-900" + for="account-name" + > + {i18n.str`Account name`} + </label> + <div class="mt-2"> + <div class="flex justify-between"> + <input + type="text" + class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" + name="account-name" + id="account-name" + disabled={true} + value={payto.account} + autocomplete="off" + /> + </div> + <CopyButton + class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " + getContent={() => payto.account} + /> + </div> + + <p class="mt-2 text-sm text-gray-500"> + <i18n.Translate> + Bank account identifier for wire transfers. + </i18n.Translate> + </p> + </div> + </Fragment> + ); + } + case "bitcoin": { + return ( <div class="sm:col-span-5"> <label class="block text-sm font-medium leading-6 text-gray-900" - for="account-name" + for="iban" > - {i18n.str`Account name`} + {i18n.str`Address`} </label> <div class="mt-2"> - <div class="flex justify-between"> - <input - type="text" - class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="account-name" - id="account-name" - disabled={true} - value={payto.account} - autocomplete="off" - /> - </div> + <input + type="text" + class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" + name="iban" + id="iban" + disabled={true} + value={"asd"} + autocomplete="off" + /> <CopyButton class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " - getContent={() => payto.account} + getContent={() => "Asd"} /> </div> - <p class="mt-2 text-sm text-gray-500"> <i18n.Translate> - Bank account identifier for wire transfers. + International Bank Account Number. </i18n.Translate> </p> </div> - </Fragment> - ); + ); + } + default: + return `unsupported account type ${payto.targetType}`; } - case "bitcoin": { - return ( - <div class="sm:col-span-5"> - <label - class="block text-sm font-medium leading-6 text-gray-900" - for="iban" - > - {i18n.str`Address`} - </label> - <div class="mt-2"> - <input - type="text" - class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="iban" - id="iban" - disabled={true} - value={"asd"} - autocomplete="off" - /> - <CopyButton - class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " - getContent={() => "Asd"} - /> - </div> - <p class="mt-2 text-sm text-gray-500"> - <i18n.Translate> - International Bank Account Number. - </i18n.Translate> - </p> - </div> - ); - } - default: - return `unsupported account type ${payto.targetType}`; - } - })(payto)} + })(payto)} - <div class="sm:col-span-5"> - <label - class="block text-sm font-medium leading-6 text-gray-900" - for="iban" - > - {i18n.str`Owner's name`} - </label> - <div class="mt-2"> - <div class="flex justify-between"> - <input - type="text" - class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="iban" - id="iban" - disabled={true} - value={result.body.name} - autocomplete="off" - /> - <CopyButton - class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " - getContent={() => result.body.name} - /> + <div class="sm:col-span-5"> + <label + class="block text-sm font-medium leading-6 text-gray-900" + for="iban" + > + {i18n.str`Owner's name`} + </label> + <div class="mt-2"> + <div class="flex justify-between"> + <input + type="text" + class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" + name="iban" + id="iban" + disabled={true} + value={result.body.name} + autocomplete="off" + /> + <CopyButton + class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " + getContent={() => result.body.name} + /> + </div> </div> + <p class="mt-2 text-sm text-gray-500"> + <i18n.Translate> + Legal name of the person holding the account. + </i18n.Translate> + </p> </div> - <p class="mt-2 text-sm text-gray-500"> - <i18n.Translate> - Legal name of the person holding the account. - </i18n.Translate> - </p> - </div> - <div class="sm:col-span-5"> - <label - class="block text-sm font-medium leading-6 text-gray-900" - for="iban" - > - {i18n.str`Account info URL`} - </label> - <div class="mt-2"> - <div class="flex justify-between"> - <input - type="text" - class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" - name="iban" - id="iban" - disabled={true} - value={baseURL} - autocomplete="off" - /> - <CopyButton - class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " - getContent={() => baseURL} - /> + <div class="sm:col-span-5"> + <label + class="block text-sm font-medium leading-6 text-gray-900" + for="iban" + > + {i18n.str`Account info URL`} + </label> + <div class="mt-2"> + <div class="flex justify-between"> + <input + type="text" + class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" + name="iban" + id="iban" + disabled={true} + value={baseURL} + autocomplete="off" + /> + <CopyButton + class="p-2 rounded-full text-black shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 " + getContent={() => baseURL} + /> + </div> </div> + <p class="mt-2 text-sm text-gray-500"> + <i18n.Translate> + From where the merchant can download information about + incoming wire transfers to this account. + </i18n.Translate> + </p> </div> - <p class="mt-2 text-sm text-gray-500"> - <i18n.Translate> - From where the merchant can download information about - incoming wire transfers to this account. - </i18n.Translate> - </p> </div> </div> + <div class="flex items-center justify-between gap-x-6 border-t border-gray-900/10 px-4 py-4 sm:px-8"> + <a + href={routeClose.url({})} + name="cancel" + class="text-sm font-semibold leading-6 text-gray-900" + > + <i18n.Translate>Cancel</i18n.Translate> + </a> + <span></span> + </div> </div> - <div class="flex items-center justify-between gap-x-6 border-t border-gray-900/10 px-4 py-4 sm:px-8"> - <a - href={routeClose.url({})} - name="cancel" - class="text-sm font-semibold leading-6 text-gray-900" - > - <i18n.Translate>Cancel</i18n.Translate> - </a> - <span></span> - </div> - </div> - )} - </div> + )} + </div> + )} </Fragment> ); }