diff --git a/public/dap-logos/enableBanking.svg b/public/dap-logos/enableBanking.svg new file mode 100644 index 0000000000..7eba0827b5 --- /dev/null +++ b/public/dap-logos/enableBanking.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/src/pages/settings/bank-accounts/common/components/ConnectAccounts.tsx b/src/pages/settings/bank-accounts/common/components/ConnectAccounts.tsx index e8218664cc..f6b4fc4556 100644 --- a/src/pages/settings/bank-accounts/common/components/ConnectAccounts.tsx +++ b/src/pages/settings/bank-accounts/common/components/ConnectAccounts.tsx @@ -19,6 +19,7 @@ import { useTranslation } from 'react-i18next'; import { MdLink } from 'react-icons/md'; import yodleeLogo from '/dap-logos/yodlee.svg'; import goCardlessLogo from '/dap-logos/goCardless.png'; +import enableBankingLogo from '/dap-logos/enableBanking.svg'; import { useAccentColor } from '$app/common/hooks/useAccentColor'; import { useClickAway } from 'react-use'; import { useColorScheme } from '$app/common/colors'; @@ -32,7 +33,7 @@ export function ConnectAccounts() { const divRef = useRef(null); - const [account, setAccount] = useState<'yodlee' | 'nordigen'>(); + const [account, setAccount] = useState<'yodlee' | 'nordigen' | 'enablebanking'>(); const [isModalVisible, setIsModalVisible] = useState(false); useClickAway(divRef, () => { @@ -74,6 +75,21 @@ export function ConnectAccounts() { }); }; + const handleConnectEnableBanking = () => { + request('POST', endpoint('/api/v1/one_time_token'), { + context: 'enablebanking', + platform: 'react', + }).then((tokenResponse) => { + handleClose(); + + window.open( + endpoint('/enablebanking/connect/:hash', { + hash: tokenResponse?.data?.hash, + }) + ); + }); + }; + const handleConnectAccount = () => { if (account === 'yodlee') { handleConnectYodlee(); @@ -82,6 +98,10 @@ export function ConnectAccounts() { if (account === 'nordigen') { handleConnectNordigen(); } + + if (account === 'enablebanking') { + handleConnectEnableBanking(); + } }; return ( @@ -89,7 +109,7 @@ export function ConnectAccounts() {