diff --git a/.env.example b/.env.example index abd0167b..b6fa8374 100644 --- a/.env.example +++ b/.env.example @@ -14,6 +14,7 @@ NX_NEXTAUTH_URL=http://localhost:4200 # We use ngrok to expose a local development environment to the internet # You can sign up for a free account and get an API key at https://ngrok.com NGROK_AUTH_TOKEN= +NGROK_DOMAIN= ######################################################################## # DATABASE @@ -35,7 +36,8 @@ NX_POLYGON_API_KEY= # We use Teller.io for automated banking data. You can sign up for a free # account and get a free API key at https://teller.io NX_TELLER_SIGNING_SECRET= -NX_TELLER_APP_ID= +NEXT_PUBLIC_TELLER_APP_ID= +NEXT_PUBLIC_TELLER_ENV=sandbox NX_TELLER_ENV=sandbox ######################################################################## @@ -57,4 +59,4 @@ NX_POSTMARK_API_TOKEN= ######################################################################## NX_PLAID_SECRET= NX_FINICITY_APP_KEY= -NX_FINICITY_PARTNER_SECRET= \ No newline at end of file +NX_FINICITY_PARTNER_SECRET= diff --git a/.vscode/settings.json b/.vscode/settings.json index b76293a8..475b191d 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -8,5 +8,7 @@ }, "[html]": { "editor.defaultFormatter": "esbenp.prettier-vscode" - } + }, + "typescript.enablePromptUseWorkspaceTsdk": true, + "typescript.tsdk": "node_modules/typescript/lib" } diff --git a/README.md b/README.md index a3c8eca8..99a64fbf 100644 --- a/README.md +++ b/README.md @@ -4,10 +4,6 @@ Get involved: [Discord](https://link.maybe.co/discord) • [Website](https://maybe.co) • [Issues](https://github.com/maybe-finance/maybe/issues) -🚨 NOTE: This is the original React app of the previously-defunct personal finance app, Maybe. This original version used many external services (Plaid, Finicity, etc) and getting it to fully function will be a decent amount of work. - -There's a LOT of work to do to get this functioning, but it should be feasible. - ## Backstory We spent the better part of 2021/2022 building a personal finance + wealth management app called Maybe. Very full-featured, including an "Ask an Advisor" feature which connected users with an actual CFP/CFA to help them with their finances (all included in your subscription). @@ -37,11 +33,12 @@ As a personal finance + wealth management app, Maybe has a lot of features. Here And dozens upon dozens of smaller features. -## Building the app +## Getting started -This is the current state of building the app. You'll hit errors, which we're working to resolve (and certainly welcome PRs to help with that). +This is the current state of building the app. We're actively working to make this process much more streamlined! -You'll need Docker installed to run the app locally. +*You'll need Docker installed to run the app locally.* +[Docker Desktop](https://www.docker.com/products/docker-desktop/) is an easy way to get started. First, copy the `.env.example` file to `.env`: @@ -53,6 +50,14 @@ Then, create a new secret using `openssl rand -base64 32` and populate `NEXTAUTH To enable transactional emails, you'll need to create a [Postmark](https://postmarkapp.com/) account and add your API key to your `.env` file (`NX_POSTMARK_API_TOKEN`). You can also set the from and reply-to email addresses (`NX_POSTMARK_FROM_ADDRESS` and `NX_POSTMARK_REPLY_TO_ADDRESS`). If you want to run the app without email, you can set `NX_POSTMARK_API_TOKEN` to a dummy value. +Maybe uses [Teller](https://teller.io/) for connecting financial accounts. To get started with Teller, you'll need to create an account. Once you've created an account: + +- Add your Teller application id to your `.env` file (`NEXT_PUBLIC_TELLER_APP_ID`). +- Download your authentication certificates from Teller, create a `certs` folder in the root of the project, and place your certs in that directory. You should have both a `certificate.pem` and `private_key.pem`. **NEVER** check these files into source control, the `.gitignore` file will prevent the `certs/` directory from being added, but please double check. +- Set your `NEXT_PUBLIC_TELLER_ENV` and `NX_TELLER_ENV` to your desired environment. The default is `sandbox` which allows for testing with mock data. The login credentials for the sandbox environment are `username` and `password`. To connect to real financial accounts, you'll need to use the `development` environment. +- Webhooks are not implemented yet, but you can populate the `NX_TELLER_SIGNING_SECRET` with the value from your Teller account. +- We highly recommend checking out the [Teller docs](https://teller.io/docs) for more info. + Then run the following yarn commands: ``` @@ -63,6 +68,27 @@ yarn prisma:seed yarn dev ``` +## Set Up Ngrok + +External data providers require HTTPS/SSL webhook URLs for sending data. + +To test this locally/during development, you will need to setup `ngrok`. + +1. Visit [ngrok.com](https://ngrok.com/) +2. Create a free account +3. Visit [this page](https://dashboard.ngrok.com/get-started/your-authtoken) to access your auth token +4. Paste it into your `.env` file: `NGROK_AUTH_TOKEN=your_auth_token` + +You should claim your free static domain to avoid needing to change the URL each time you start/stop the server. + +To do so: + +1. Visit the [domains](https://dashboard.ngrok.com/cloud-edge/domains) page +2. Click on Create Domain +3. Copy the domain and paste it into your `.env` file: `NGROK_DOMAIN=your_domain` + +That's it! As long as you run the project locally using `docker` with `yarn dev:services:all` you'll be good to go. + ## Contributing To contribute, please see our [contribution guide](https://github.com/maybe-finance/maybe/blob/main/CONTRIBUTING.md). diff --git a/apps/client/pages/api/auth/[...nextauth].ts b/apps/client/pages/api/auth/[...nextauth].ts index 3a18412a..a641f0ac 100644 --- a/apps/client/pages/api/auth/[...nextauth].ts +++ b/apps/client/pages/api/auth/[...nextauth].ts @@ -85,7 +85,6 @@ export const authOptions = { strategy: 'jwt' as SessionStrategy, maxAge: 1 * 24 * 60 * 60, // 1 Day }, - providers: [ CredentialsProvider({ name: 'Credentials', diff --git a/apps/client/pages/login.tsx b/apps/client/pages/login.tsx index 84634495..aabcc715 100644 --- a/apps/client/pages/login.tsx +++ b/apps/client/pages/login.tsx @@ -57,6 +57,7 @@ export default function LoginPage() {
setEmail(e.currentTarget.value)} @@ -64,6 +65,7 @@ export default function LoginPage() { setFirstName(e.currentTarget.value)} /> setLastName(e.currentTarget.value)} /> setEmail(e.currentTarget.value)} @@ -82,6 +85,7 @@ export default function RegisterPage() { Details Security - Billing + {process.env.STRIPE_API_KEY && Billing} @@ -46,9 +46,11 @@ export default function SettingsPage() { - - - + {process.env.STRIPE_API_KEY && ( + + + + )} diff --git a/apps/e2e/cypress.config.ts b/apps/e2e/cypress.config.ts index c5564c9e..a77a70ab 100644 --- a/apps/e2e/cypress.config.ts +++ b/apps/e2e/cypress.config.ts @@ -11,14 +11,10 @@ export default defineConfig({ baseUrl: 'http://localhost:4200', env: { API_URL: 'http://localhost:3333/v1', - AUTH0_ID: 'REPLACE_THIS', - AUTH0_CLIENT_ID: 'REPLACE_THIS', - AUTH0_NAME: 'Engineering CI', - AUTH0_EMAIL: 'REPLACE_THIS', - AUTH0_PASSWORD: 'REPLACE_THIS', - AUTH0_DOMAIN: 'REPLACE_THIS', - STRIPE_WEBHOOK_SECRET: - 'REPLACE_THIS', + NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET, + NEXT_PUBLIC_NEXTAUTH_URL: 'http://localhost:4200', + NEXTAUTH_URL: process.env.NEXTAUTH_URL, + STRIPE_WEBHOOK_SECRET: 'REPLACE_THIS', STRIPE_CUSTOMER_ID: 'REPLACE_THIS', STRIPE_SUBSCRIPTION_ID: 'REPLACE_THIS', }, diff --git a/apps/e2e/src/e2e/accounts.cy.ts b/apps/e2e/src/e2e/accounts.cy.ts index de33a9ea..1a106c3c 100644 --- a/apps/e2e/src/e2e/accounts.cy.ts +++ b/apps/e2e/src/e2e/accounts.cy.ts @@ -19,81 +19,6 @@ function openEditAccountModal() { } describe('Accounts', () => { - it('should sync and edit a plaid connection', () => { - cy.apiRequest({ - method: 'POST', - url: 'e2e/plaid/connect', - }).then((response) => { - expect(response.status).to.eql(200) - - // The only time we need to manually send a Plaid webhook is in Github actions when testing a PR - if (Cypress.env('WEBHOOK_TYPE') === 'mock') { - const { plaidItemId } = response.body.data.json - - cy.request({ - method: 'POST', - url: `${Cypress.env('API_URL')}/plaid/webhook`, - body: { - webhook_type: 'TRANSACTIONS', - webhook_code: 'HISTORICAL_UPDATE', - item_id: plaidItemId, - }, - }) - .its('status') - .should('equal', 200) - } - }) - - // Check account sidebar names and balances - cy.visit('/accounts') - cy.getByTestId('account-group', { timeout: 20_000 }) - - assertSidebarAccounts([ - ['Assets', '$20,000'], - ['Cash', '$20,000'], - ['Sandbox Savings', '$15,000'], - ['Sandbox Checking', '$5,000'], - ['Debts', '$950'], - ['Credit Cards', '$950'], - ['Sandbox CC', '$950'], - ]) - - // Check current net worth - cy.visit('/') - cy.getByTestId('current-data-value').should('contain.text', '$19,050.00') - - // Visit each account page, edit details, re-validate amounts - cy.contains('a', 'Sandbox Checking').click() - cy.getByTestId('current-data-value').should('contain.text', '$5,000.00') - - cy.contains('a', 'Sandbox Savings').click() - cy.getByTestId('current-data-value').should('contain.text', '$15,000.00') - - cy.contains('a', 'Sandbox CC').click() - cy.getByTestId('current-data-value').should('contain.text', '$950.00') - - openEditAccountModal() - - cy.getByTestId('connected-account-form').within(() => { - cy.get('input[name="name"]') - .should('have.value', 'Sandbox CC') - .clear() - .type('Credit Credit') - cy.get('input[name="categoryUser"]').should('have.value', 'credit') - cy.get('input[name="startDate"]') - .should('have.value', '') - .type(DateTime.now().minus({ months: 1 }).toFormat('MMddyyyy')) - cy.root().submit() - }) - - // Should be able to submit empty start date on connected account - openEditAccountModal() - cy.getByTestId('connected-account-form').within(() => { - cy.get('input[name="startDate"]').clear() - cy.root().submit() - }) - }) - it('should interpolate and display manual vehicle account data', () => { cy.getByTestId('add-account-button').click() cy.contains('h4', 'Add account') @@ -149,6 +74,8 @@ describe('Accounts', () => { cy.contains('h4', 'Add real estate') // Details + cy.contains('label', 'Country').click() + cy.contains('button', 'Uganda').click() cy.get('input[name="line1"]').focus().type('123 Example St') cy.get('input[name="city"]').type('New York') cy.get('input[name="state"]').type('NY') @@ -187,6 +114,9 @@ describe('Accounts', () => { openEditAccountModal() cy.getByTestId('property-form').within(() => { + cy.get('input[name="country"]').should('have.value', 'UG') + cy.contains('label', 'Country').click() + cy.contains('button', 'United States').click() cy.get('input[name="line1"]') .should('have.value', '123 Example St') .clear() diff --git a/apps/e2e/src/e2e/auth.cy.ts b/apps/e2e/src/e2e/auth.cy.ts new file mode 100644 index 00000000..8150a9ea --- /dev/null +++ b/apps/e2e/src/e2e/auth.cy.ts @@ -0,0 +1,9 @@ +describe('Auth', () => { + beforeEach(() => cy.visit('/')) + + describe('Logging in', () => { + it('should show the home page of an authenticated user', () => { + cy.contains('h5', 'Assets & Debts') + }) + }) +}) diff --git a/apps/e2e/src/support/commands.ts b/apps/e2e/src/support/commands.ts index 9084edc3..676fb30b 100644 --- a/apps/e2e/src/support/commands.ts +++ b/apps/e2e/src/support/commands.ts @@ -1,17 +1,13 @@ -import jwtDecode from 'jwt-decode' - -declare global { - // eslint-disable-next-line @typescript-eslint/no-namespace - namespace Cypress { - // eslint-disable-next-line @typescript-eslint/no-unused-vars - interface Chainable { - login(username: string, password: string): Chainable - apiRequest(...params: Parameters): Chainable - getByTestId(...parameters: Parameters): Chainable - selectDate(date: Date): Chainable - preserveAccessToken(): Chainable - restoreAccessToken(): Chainable - } +// eslint-disable-next-line @typescript-eslint/no-namespace +declare namespace Cypress { + // eslint-disable-next-line @typescript-eslint/no-unused-vars + interface Chainable { + login(): Chainable + apiRequest(...params: Parameters): Chainable + getByTestId(...parameters: Parameters): Chainable + selectDate(date: Date): Chainable + preserveAccessToken(): Chainable + restoreAccessToken(): Chainable } } @@ -20,13 +16,10 @@ Cypress.Commands.add('getByTestId', (testId, ...rest) => { }) Cypress.Commands.add('apiRequest', ({ url, headers = {}, ...options }, ...rest) => { - const accessToken = window.localStorage.getItem('token') - return cy.request( { url: `${Cypress.env('API_URL')}/${url}`, headers: { - Authorization: `Bearer ${accessToken}`, ...headers, }, ...options, @@ -35,74 +28,11 @@ Cypress.Commands.add('apiRequest', ({ url, headers = {}, ...options }, ...rest) ) }) -/** - * Logs in with the engineering CI account - */ -Cypress.Commands.add('login', (username, password) => { - // Preserves login across tests - cy.session('login-session-key', login, { - validate() { - cy.apiRequest({ url: 'e2e' }).its('status').should('eq', 200) - }, - }) - - function login() { - const client_id = Cypress.env('AUTH0_CLIENT_ID') - const audience = 'https://maybe-finance-api/v1' - const scope = 'openid profile email offline_access' - const accessTokenStorageKey = `@@auth0spajs@@::${client_id}::${audience}::${scope}` - const AUTH_DOMAIN = Cypress.env('AUTH0_DOMAIN') - - cy.log(`Logging in as ${username}`) - - /** - * Uses the official Cypress Auth0 strategy for testing with Auth0 - * https://docs.cypress.io/guides/testing-strategies/auth0-authentication#Auth0-Application-Setup - * - * Relevant Auth0 endpoint - * https://auth0.com/docs/api/authentication?javascript#resource-owner-password - */ - cy.request({ - method: 'POST', - url: `https://${AUTH_DOMAIN}/oauth/token`, - body: { - grant_type: 'password', - username, - password, - audience, - scope, - client_id, - }, - }).then(({ body }) => { - const claims = jwtDecode(body.id_token) - - const { nickname, name, picture, updated_at, email, email_verified, sub, exp } = claims - - const item = { - body: { - ...body, - decodedToken: { - claims, - user: { - nickname, - name, - picture, - updated_at, - email, - email_verified, - sub, - }, - audience, - client_id, - }, - }, - expiresAt: exp, - } - - window.localStorage.setItem(accessTokenStorageKey, JSON.stringify(item)) - window.localStorage.setItem('token', body.access_token) - - cy.visit('/') - }) - } +Cypress.Commands.add('login', () => { + cy.visit('/login') + cy.get('input[name="email"]').type('bond@007.com') + cy.get('input[name="password"]').type('TestPassword123') + cy.get('button[type="submit"]').click() + //eslint-disable-next-line cypress/no-unnecessary-waiting + cy.wait(1000) }) diff --git a/apps/e2e/src/support/e2e.ts b/apps/e2e/src/support/e2e.ts index a8e64fd1..be528804 100644 --- a/apps/e2e/src/support/e2e.ts +++ b/apps/e2e/src/support/e2e.ts @@ -2,8 +2,7 @@ import './commands' beforeEach(() => { // Login - // Rate limit 30 / min - https://auth0.com/docs/troubleshoot/customer-support/operational-policies/rate-limit-policy#limits-for-non-production-tenants-of-paying-customers-and-all-tenants-of-free-customers - cy.login(Cypress.env('AUTH0_EMAIL'), Cypress.env('AUTH0_PASSWORD')) + cy.login() // Delete the current user to wipe all data before test cy.apiRequest({ @@ -14,6 +13,6 @@ beforeEach(() => { expect(response.status).to.equal(200) }) - // Re-login (JWT should still be valid) + // Go back to dashboard cy.visit('/') }) diff --git a/apps/e2e/src/support/index.ts b/apps/e2e/src/support/index.ts new file mode 100644 index 00000000..5e5628a4 --- /dev/null +++ b/apps/e2e/src/support/index.ts @@ -0,0 +1,2 @@ +import './commands' +import './e2e' diff --git a/apps/server/src/app/__tests__/account.integration.spec.ts b/apps/server/src/app/__tests__/account.integration.spec.ts index 23b068c7..d8ebb18e 100644 --- a/apps/server/src/app/__tests__/account.integration.spec.ts +++ b/apps/server/src/app/__tests__/account.integration.spec.ts @@ -9,7 +9,6 @@ import { } from '@maybe-finance/server/features' import { InMemoryQueueFactory, PgService, type IQueueFactory } from '@maybe-finance/server/shared' import { createLogger, transports } from 'winston' -import isCI from 'is-ci' import nock from 'nock' import Decimal from 'decimal.js' import { startServer, stopServer } from './utils/server' @@ -27,7 +26,7 @@ const prisma = new PrismaClient() // For TypeScript support const plaid = jest.mocked(_plaid) // eslint-disable-line -const auth0Id = isCI ? 'auth0|61afd38f678a0c006895f046' : 'auth0|61afd340678a0c006895f000' +const authId = '__TEST_USER_ID__' let axios: AxiosInstance let user: User @@ -38,7 +37,7 @@ if (process.env.IS_VSCODE_DEBUG === 'true') { beforeEach(async () => { // Clears old user and data, creates new user - user = await resetUser(auth0Id) + user = await resetUser(authId) }) describe('/v1/accounts API', () => { diff --git a/apps/server/src/app/__tests__/connection.integration.spec.ts b/apps/server/src/app/__tests__/connection.integration.spec.ts index 747f9ee0..7eb81099 100644 --- a/apps/server/src/app/__tests__/connection.integration.spec.ts +++ b/apps/server/src/app/__tests__/connection.integration.spec.ts @@ -2,7 +2,6 @@ import type { AxiosInstance } from 'axios' import type { SharedType } from '@maybe-finance/shared' import type { Prisma, AccountConnection, AccountSyncStatus, User } from '@prisma/client' import type { ItemRemoveResponse } from 'plaid' -import isCI from 'is-ci' import { startServer, stopServer } from './utils/server' import { getAxiosClient } from './utils/axios' import prisma from '../lib/prisma' @@ -18,7 +17,7 @@ jest.mock('plaid') // For TypeScript support const plaid = jest.mocked(_plaid) -const auth0Id = isCI ? 'auth0|61afd38f678a0c006895f046' : 'auth0|61afd340678a0c006895f000' +const authId = '__TEST_USER_ID__' let axios: AxiosInstance let user: User | null let connection: AccountConnection @@ -45,7 +44,7 @@ afterAll(async () => { }) beforeEach(async () => { - user = await resetUser(auth0Id) + user = await resetUser(authId) connectionData = { data: { diff --git a/apps/server/src/app/__tests__/utils/axios.ts b/apps/server/src/app/__tests__/utils/axios.ts index e5b80ac5..1449e1a2 100644 --- a/apps/server/src/app/__tests__/utils/axios.ts +++ b/apps/server/src/app/__tests__/utils/axios.ts @@ -1,38 +1,37 @@ import type { AxiosResponse } from 'axios' import type { SharedType } from '@maybe-finance/shared' import { superjson } from '@maybe-finance/shared' -import env from '../../../env' -import isCI from 'is-ci' import Axios from 'axios' +import { encode } from 'next-auth/jwt' -// Fetches Auth0 access token (JWT) and prepares Axios client to use it on each request export async function getAxiosClient() { - const tenantUrl = isCI - ? 'REPLACE_THIS-staging.us.auth0.com' - : 'REPLACE_THIS-development.us.auth0.com' - - const { - data: { access_token: token }, - } = await Axios.request({ - method: 'POST', - url: `https://${tenantUrl}/oauth/token`, - headers: { 'content-type': 'application/json' }, - data: { - grant_type: 'password', - username: 'REPLACE_THIS', - password: 'REPLACE_THIS', - audience: 'https://maybe-finance-api/v1', - scope: '', - client_id: isCI ? 'REPLACE_THIS' : 'REPLACE_THIS', + const baseUrl = 'http://127.0.0.1:53333/v1' + const jwt = await encode({ + maxAge: 1 * 24 * 60 * 60, + secret: process.env.NEXTAUTH_SECRET || 'CHANGE_ME', + token: { + sub: '__TEST_USER_ID__', + user: '__TEST_USER_ID__', + 'https://maybe.co/email': 'REPLACE_THIS', + firstName: 'REPLACE_THIS', + lastName: 'REPLACE_THIS', + name: 'REPLACE_THIS', }, }) + const defaultHeaders = { + 'Content-Type': 'application/json', + 'Access-Control-Allow-Credentials': true, + Authorization: `Bearer ${jwt}`, + } + const axiosOptions = { + baseURL: baseUrl, + headers: defaultHeaders, + } + const axios = Axios.create({ - baseURL: 'http://127.0.0.1:53333/v1', + ...axiosOptions, validateStatus: () => true, // Tests should determine whether status is correct, not Axios - headers: { - Authorization: `Bearer ${token}`, - }, }) axios.interceptors.response.use((response: AxiosResponse) => { diff --git a/apps/server/src/app/app.ts b/apps/server/src/app/app.ts index c495a30d..4383a53e 100644 --- a/apps/server/src/app/app.ts +++ b/apps/server/src/app/app.ts @@ -36,6 +36,7 @@ import { valuationsRouter, institutionsRouter, finicityRouter, + tellerRouter, transactionsRouter, holdingsRouter, securitiesRouter, @@ -43,6 +44,7 @@ import { toolsRouter, publicRouter, e2eRouter, + adminRouter, } from './routes' import env from '../env' @@ -92,6 +94,7 @@ app.use(cors({ origin, credentials: true })) app.options('*', cors() as RequestHandler) app.set('view engine', 'ejs').set('views', __dirname + '/app/admin/views') +app.use('/admin', adminRouter) app.use( morgan(env.NX_MORGAN_LOG_LEVEL, { @@ -156,6 +159,7 @@ app.use('/v1/users', usersRouter) app.use('/v1/e2e', e2eRouter) app.use('/v1/plaid', plaidRouter) app.use('/v1/finicity', finicityRouter) +app.use('/v1/teller', tellerRouter) app.use('/v1/accounts', accountsRouter) app.use('/v1/account-rollup', accountRollupRouter) app.use('/v1/connections', connectionsRouter) diff --git a/apps/server/src/app/lib/endpoint.ts b/apps/server/src/app/lib/endpoint.ts index 8e01b00d..f6340672 100644 --- a/apps/server/src/app/lib/endpoint.ts +++ b/apps/server/src/app/lib/endpoint.ts @@ -240,6 +240,7 @@ const userService = new UserService( const institutionProviderFactory = new InstitutionProviderFactory({ PLAID: plaidService, FINICITY: finicityService, + TELLER: tellerService, }) const institutionService: IInstitutionService = new InstitutionService( diff --git a/apps/server/src/app/middleware/validate-auth-jwt.ts b/apps/server/src/app/middleware/validate-auth-jwt.ts index 5e46cec8..2124c88b 100644 --- a/apps/server/src/app/middleware/validate-auth-jwt.ts +++ b/apps/server/src/app/middleware/validate-auth-jwt.ts @@ -2,17 +2,20 @@ import cookieParser from 'cookie-parser' import { decode } from 'next-auth/jwt' const SECRET = process.env.NEXTAUTH_SECRET ?? 'REPLACE_THIS' - export const validateAuthJwt = async (req, res, next) => { cookieParser(SECRET)(req, res, async (err) => { if (err) { return res.status(500).json({ message: 'Internal Server Error' }) } - if (req.cookies && 'next-auth.session-token' in req.cookies) { + const cookieName = req.secure + ? '__Secure-next-auth.session-token' + : 'next-auth.session-token' + + if (req.cookies && cookieName in req.cookies) { try { const token = await decode({ - token: req.cookies['next-auth.session-token'], + token: req.cookies[cookieName], secret: SECRET, }) @@ -26,6 +29,18 @@ export const validateAuthJwt = async (req, res, next) => { console.error('Error in token validation', error) return res.status(500).json({ message: 'Internal Server Error' }) } + } else if (req.headers.authorization) { + const token = req.headers.authorization.split(' ')[1] + const decoded = await decode({ + token, + secret: SECRET, + }) + if (decoded) { + req.user = decoded + return next() + } else { + return res.status(401).json({ message: 'Unauthorized' }) + } } else { return res.status(401).json({ message: 'Unauthorized' }) } diff --git a/apps/server/src/app/routes/admin.router.ts b/apps/server/src/app/routes/admin.router.ts new file mode 100644 index 00000000..dd17b6d9 --- /dev/null +++ b/apps/server/src/app/routes/admin.router.ts @@ -0,0 +1,33 @@ +import { Router } from 'express' +import { auth, claimCheck } from 'express-openid-connect' +import { createBullBoard } from '@bull-board/api' +import { BullAdapter } from '@bull-board/api/bullAdapter' +import { ExpressAdapter } from '@bull-board/express' +import { AuthUtil, BullQueue } from '@maybe-finance/server/shared' +import { SharedType } from '@maybe-finance/shared' +import { queueService } from '../lib/endpoint' +import env from '../../env' +import { validateAuthJwt } from '../middleware' + +const router = Router() + +const serverAdapter = new ExpressAdapter().setBasePath('/admin/bullmq') + +createBullBoard({ + queues: queueService.allQueues + .filter((q): q is BullQueue => q instanceof BullQueue) + .map((q) => new BullAdapter(q.queue)), + serverAdapter, +}) + +router.get('/', validateAuthJwt, (req, res) => { + res.render('pages/dashboard', { + user: req.user?.name, + role: 'Admin', + }) +}) + +// Visit /admin/bullmq to see BullMQ Dashboard +router.use('/bullmq', validateAuthJwt, serverAdapter.getRouter()) + +export default router diff --git a/apps/server/src/app/routes/e2e.router.ts b/apps/server/src/app/routes/e2e.router.ts index 0b4bc830..5b9edb29 100644 --- a/apps/server/src/app/routes/e2e.router.ts +++ b/apps/server/src/app/routes/e2e.router.ts @@ -6,13 +6,13 @@ import endpoint from '../lib/endpoint' const router = Router() -router.use((req, res, next) => { - const roles = req.user?.['https://maybe.co/roles'] +const testUserId = 'test_ec3ee8a4-fa01-4f11-8ac5-9c49dd7fbae4' - if (roles?.includes('CIUser') || roles?.includes('Admin')) { +router.use((req, res, next) => { + if (req.user?.sub === testUserId) { next() } else { - res.status(401).send('Route only available to CIUser and Admin roles') + res.status(401).send('Route only available to test users') } }) @@ -47,14 +47,14 @@ router.post( trialLapsed: z.boolean().default(false), }), resolve: async ({ ctx, input }) => { - ctx.logger.debug(`Resetting CI user ${ctx.user!.authId}`) - await ctx.prisma.$transaction([ - ctx.prisma.$executeRaw`DELETE FROM "user" WHERE auth_id=${ctx.user!.authId};`, + ctx.prisma.$executeRaw`DELETE FROM "user" WHERE auth_id=${testUserId};`, ctx.prisma.user.create({ data: { - authId: ctx.user!.authId, - email: 'REPLACE_THIS', + authId: testUserId, + email: 'bond@007.com', + firstName: 'James', + lastName: 'Bond', dob: new Date('1990-01-01'), linkAccountDismissedAt: new Date(), // ensures our auto-account link doesn't trigger diff --git a/apps/server/src/app/routes/index.ts b/apps/server/src/app/routes/index.ts index 135a9a24..30601f84 100644 --- a/apps/server/src/app/routes/index.ts +++ b/apps/server/src/app/routes/index.ts @@ -5,6 +5,7 @@ export { default as usersRouter } from './users.router' export { default as webhooksRouter } from './webhooks.router' export { default as plaidRouter } from './plaid.router' export { default as finicityRouter } from './finicity.router' +export { default as tellerRouter } from './teller.router' export { default as valuationsRouter } from './valuations.router' export { default as institutionsRouter } from './institutions.router' export { default as transactionsRouter } from './transactions.router' @@ -14,3 +15,4 @@ export { default as plansRouter } from './plans.router' export { default as toolsRouter } from './tools.router' export { default as publicRouter } from './public.router' export { default as e2eRouter } from './e2e.router' +export { default as adminRouter } from './admin.router' diff --git a/apps/server/src/app/routes/teller.router.ts b/apps/server/src/app/routes/teller.router.ts new file mode 100644 index 00000000..c802ff70 --- /dev/null +++ b/apps/server/src/app/routes/teller.router.ts @@ -0,0 +1,45 @@ +import { Router } from 'express' +import { z } from 'zod' +import endpoint from '../lib/endpoint' + +const router = Router() + +router.post( + '/handle-enrollment', + endpoint.create({ + input: z.object({ + institution: z.object({ + name: z.string(), + id: z.string(), + }), + enrollment: z.object({ + accessToken: z.string(), + user: z.object({ + id: z.string(), + }), + enrollment: z.object({ + id: z.string(), + institution: z.object({ + name: z.string(), + }), + }), + signatures: z.array(z.string()).optional(), + }), + }), + resolve: ({ input: { institution, enrollment }, ctx }) => { + return ctx.tellerService.handleEnrollment(ctx.user!.id, institution, enrollment) + }, + }) +) + +router.post( + '/institutions/sync', + endpoint.create({ + resolve: async ({ ctx }) => { + ctx.ability.throwUnlessCan('manage', 'Institution') + await ctx.queueService.getQueue('sync-institution').add('sync-teller-institutions', {}) + }, + }) +) + +export default router diff --git a/apps/server/src/env.ts b/apps/server/src/env.ts index 11fd2f76..c9040de3 100644 --- a/apps/server/src/env.ts +++ b/apps/server/src/env.ts @@ -48,8 +48,6 @@ const envSchema = z.object({ NX_SENTRY_DSN: z.string().optional(), NX_SENTRY_ENV: z.string().optional(), - NX_LD_SDK_KEY: z.string().default('REPLACE_THIS'), - NX_POLYGON_API_KEY: z.string().default(''), NX_PORT: z.string().default('3333'), diff --git a/apps/workers/src/app/__tests__/finicity.integration.spec.ts b/apps/workers/src/app/__tests__/finicity.integration.spec.ts index b56e632c..de3bac65 100644 --- a/apps/workers/src/app/__tests__/finicity.integration.spec.ts +++ b/apps/workers/src/app/__tests__/finicity.integration.spec.ts @@ -68,8 +68,8 @@ describe('Finicity', () => { userId: user.id, name: 'TEST_FINICITY', type: 'finicity', - finicityInstitutionId: 'REPLACE_THIS', - finicityInstitutionLoginId: 'REPLACE_THIS', + finicityInstitutionId: '101732', + finicityInstitutionLoginId: '6000483842', }, }) diff --git a/apps/workers/src/app/__tests__/helpers/user.test-helper.ts b/apps/workers/src/app/__tests__/helpers/user.test-helper.ts index 0956a22b..322b7dba 100644 --- a/apps/workers/src/app/__tests__/helpers/user.test-helper.ts +++ b/apps/workers/src/app/__tests__/helpers/user.test-helper.ts @@ -1,22 +1,28 @@ import type { PrismaClient, User } from '@prisma/client' +import { faker } from '@faker-js/faker' -export async function resetUser(prisma: PrismaClient, authId = 'TODO'): Promise { - // eslint-disable-next-line - const [_, __, ___, user] = await prisma.$transaction([ - prisma.$executeRaw`DELETE FROM "user" WHERE auth_id=${authId};`, +export async function resetUser(prisma: PrismaClient, authId = '__TEST_USER_ID__'): Promise { + try { + // eslint-disable-next-line + const [_, __, ___, user] = await prisma.$transaction([ + prisma.$executeRaw`DELETE FROM "user" WHERE auth_id=${authId};`, - // Deleting a user does not cascade to securities, so delete all security records - prisma.$executeRaw`DELETE from security;`, - prisma.$executeRaw`DELETE from security_pricing;`, + // Deleting a user does not cascade to securities, so delete all security records + prisma.$executeRaw`DELETE from security;`, + prisma.$executeRaw`DELETE from security_pricing;`, - prisma.user.create({ - data: { - authId, - email: 'test@example.com', - finicityCustomerId: 'TEST', - }, - }), - ]) - - return user + prisma.user.create({ + data: { + authId, + email: faker.internet.email(), + finicityCustomerId: faker.string.uuid(), + tellerUserId: faker.string.uuid(), + }, + }), + ]) + return user + } catch (e) { + console.error('error in reset user transaction', e) + throw e + } } diff --git a/apps/workers/src/app/__tests__/teller.integration.spec.ts b/apps/workers/src/app/__tests__/teller.integration.spec.ts new file mode 100644 index 00000000..74c19457 --- /dev/null +++ b/apps/workers/src/app/__tests__/teller.integration.spec.ts @@ -0,0 +1,118 @@ +import type { User } from '@prisma/client' +import { TellerGenerator } from '../../../../../tools/generators' +import { TellerApi } from '@maybe-finance/teller-api' +jest.mock('@maybe-finance/teller-api') +import { + TellerETL, + TellerService, + type IAccountConnectionProvider, +} from '@maybe-finance/server/features' +import { createLogger } from '@maybe-finance/server/shared' +import prisma from '../lib/prisma' +import { resetUser } from './helpers/user.test-helper' +import { transports } from 'winston' +import { cryptoService } from '../lib/di' + +const logger = createLogger({ level: 'debug', transports: [new transports.Console()] }) +const teller = jest.mocked(new TellerApi()) +const tellerETL = new TellerETL(logger, prisma, teller, cryptoService) +const service: IAccountConnectionProvider = new TellerService( + logger, + prisma, + teller, + tellerETL, + cryptoService, + 'TELLER_WEBHOOK_URL', + true +) + +afterAll(async () => { + await prisma.$disconnect() +}) + +describe('Teller', () => { + let user: User + + beforeEach(async () => { + jest.clearAllMocks() + + user = await resetUser(prisma) + }) + + it('syncs connection', async () => { + const tellerConnection = TellerGenerator.generateConnection() + const tellerAccounts = tellerConnection.accountsWithBalances + const tellerTransactions = tellerConnection.transactions + + teller.getAccounts.mockResolvedValue(tellerAccounts) + + teller.getTransactions.mockImplementation(async ({ accountId }) => { + return Promise.resolve(tellerTransactions.filter((t) => t.account_id === accountId)) + }) + + const connection = await prisma.accountConnection.create({ + data: { + userId: user.id, + name: 'TEST_TELLER', + type: 'teller', + tellerEnrollmentId: tellerConnection.enrollment.enrollment.id, + tellerInstitutionId: tellerConnection.enrollment.institutionId, + tellerAccessToken: cryptoService.encrypt(tellerConnection.enrollment.accessToken), + }, + }) + + await service.sync(connection) + + const { accounts } = await prisma.accountConnection.findUniqueOrThrow({ + where: { + id: connection.id, + }, + include: { + accounts: { + include: { + transactions: true, + investmentTransactions: true, + holdings: true, + valuations: true, + }, + }, + }, + }) + + // all accounts + expect(accounts).toHaveLength(tellerConnection.accounts.length) + for (const account of accounts) { + expect(account.transactions).toHaveLength( + tellerTransactions.filter((t) => t.account_id === account.tellerAccountId).length + ) + } + + // credit accounts + const creditAccounts = tellerAccounts.filter((a) => a.type === 'credit') + expect(accounts.filter((a) => a.type === 'CREDIT')).toHaveLength(creditAccounts.length) + for (const creditAccount of creditAccounts) { + const account = accounts.find((a) => a.tellerAccountId === creditAccount.id)! + expect(account.transactions).toHaveLength( + tellerTransactions.filter((t) => t.account_id === account.tellerAccountId).length + ) + expect(account.holdings).toHaveLength(0) + expect(account.valuations).toHaveLength(0) + expect(account.investmentTransactions).toHaveLength(0) + } + + // depository accounts + const depositoryAccounts = tellerAccounts.filter((a) => a.type === 'depository') + expect(accounts.filter((a) => a.type === 'DEPOSITORY')).toHaveLength( + depositoryAccounts.length + ) + for (const depositoryAccount of depositoryAccounts) { + const account = accounts.find((a) => a.tellerAccountId === depositoryAccount.id)! + expect(account.transactions).toHaveLength( + tellerTransactions.filter((t) => t.account_id === account.tellerAccountId).length + ) + expect(account.holdings).toHaveLength(0) + expect(account.valuations).toHaveLength(0) + expect(account.investmentTransactions).toHaveLength(0) + } + }) +}) diff --git a/apps/workers/src/app/lib/di.ts b/apps/workers/src/app/lib/di.ts index 987ebedd..9e6d68c5 100644 --- a/apps/workers/src/app/lib/di.ts +++ b/apps/workers/src/app/lib/di.ts @@ -259,6 +259,7 @@ export const securityPricingProcessor: ISecurityPricingProcessor = new SecurityP const institutionProviderFactory = new InstitutionProviderFactory({ PLAID: plaidService, FINICITY: finicityService, + TELLER: tellerService, }) export const institutionService: IInstitutionService = new InstitutionService( diff --git a/apps/workers/src/env.ts b/apps/workers/src/env.ts index f58963bf..3bfcfb45 100644 --- a/apps/workers/src/env.ts +++ b/apps/workers/src/env.ts @@ -22,8 +22,6 @@ const envSchema = z.object({ NX_SENTRY_DSN: z.string().optional(), NX_SENTRY_ENV: z.string().optional(), - NX_LD_SDK_KEY: z.string().default('REPLACE_THIS'), - NX_REDIS_URL: z.string().default('redis://localhost:6379'), NX_POLYGON_API_KEY: z.string().default(''), @@ -35,6 +33,8 @@ const envSchema = z.object({ NX_CDN_PRIVATE_BUCKET: z.string().default('REPLACE_THIS'), NX_CDN_PUBLIC_BUCKET: z.string().default('REPLACE_THIS'), + + STRIPE_API_KEY: z.string().optional(), }) const env = envSchema.parse(process.env) diff --git a/apps/workers/src/main.ts b/apps/workers/src/main.ts index 35c16cdd..70cdffd6 100644 --- a/apps/workers/src/main.ts +++ b/apps/workers/src/main.ts @@ -16,6 +16,7 @@ import { workerErrorHandlerService, } from './app/lib/di' import env from './env' +import { cleanUpOutdatedJobs } from './utils' // Defaults from quickstart - https://docs.sentry.io/platforms/node/ Sentry.init({ @@ -99,6 +100,7 @@ syncSecurityQueue.add( {}, { repeat: { cron: '*/5 * * * *' }, // Run every 5 minutes + jobId: Date.now().toString(), } ) @@ -115,11 +117,17 @@ syncInstitutionQueue.process( async () => await institutionService.sync('FINICITY') ) +syncInstitutionQueue.process( + 'sync-teller-institutions', + async () => await institutionService.sync('TELLER') +) + syncInstitutionQueue.add( 'sync-plaid-institutions', {}, { repeat: { cron: '0 */24 * * *' }, // Run every 24 hours + jobId: Date.now().toString(), } ) @@ -128,6 +136,16 @@ syncInstitutionQueue.add( {}, { repeat: { cron: '0 */24 * * *' }, // Run every 24 hours + jobId: Date.now().toString(), + } +) + +syncInstitutionQueue.add( + 'sync-teller-institutions', + {}, + { + repeat: { cron: '0 */24 * * *' }, // Run every 24 hours + jobId: Date.now().toString(), } ) @@ -136,11 +154,13 @@ syncInstitutionQueue.add( */ sendEmailQueue.process('send-email', async (job) => await emailProcessor.send(job.data)) -sendEmailQueue.add( - 'send-email', - { type: 'trial-reminders' }, - { repeat: { cron: '0 */12 * * *' } } // Run every 12 hours -) +if (env.STRIPE_API_KEY) { + sendEmailQueue.add( + 'send-email', + { type: 'trial-reminders' }, + { repeat: { cron: '0 */12 * * *' } } // Run every 12 hours + ) +} // Fallback - usually triggered by errors not handled (or thrown) within the Bull event handlers (see above) process.on( @@ -156,6 +176,11 @@ process.on( await workerErrorHandlerService.handleWorkersError({ variant: 'unhandled', error }) ) +// Replace any jobs that have changed cron schedules and ensures only +// one repeatable jobs for each type is running +const queues = [syncSecurityQueue, syncInstitutionQueue] +cleanUpOutdatedJobs(queues) + const app = express() app.use(cors()) @@ -181,20 +206,24 @@ const server = app.listen(env.NX_PORT, () => { logger.info(`Worker health server started on port ${env.NX_PORT}`) }) -function onShutdown() { +async function onShutdown() { logger.info('[shutdown.start]') - server.close() + await new Promise((resolve) => server.close(resolve)) // shutdown queues - Promise.allSettled( - queueService.allQueues - .filter((q): q is BullQueue => q instanceof BullQueue) - .map((q) => q.queue.close()) - ).finally(() => { + try { + await Promise.allSettled( + queueService.allQueues + .filter((q): q is BullQueue => q instanceof BullQueue) + .map((q) => q.queue.close()) + ) + } catch (error) { + logger.error('[shutdown.error]', error) + } finally { logger.info('[shutdown.complete]') - process.exit() - }) + process.exitCode = 0 + } } process.on('SIGINT', onShutdown) diff --git a/apps/workers/src/utils.ts b/apps/workers/src/utils.ts new file mode 100644 index 00000000..de615175 --- /dev/null +++ b/apps/workers/src/utils.ts @@ -0,0 +1,46 @@ +import type { IQueue } from '@maybe-finance/server/shared' +import type { JobInformation } from 'bull' + +export async function cleanUpOutdatedJobs(queues: IQueue[]) { + for (const queue of queues) { + const repeatedJobs = await queue.getRepeatableJobs() + + const outdatedJobs = filterOutdatedJobs(repeatedJobs) + for (const job of outdatedJobs) { + await queue.removeRepeatableByKey(job.key) + } + } +} + +function filterOutdatedJobs(jobs: JobInformation[]) { + const jobGroups = new Map() + + jobs.forEach((job) => { + if (!jobGroups.has(job.name)) { + jobGroups.set(job.name, []) + } + jobGroups.get(job.name).push(job) + }) + + const mostRecentJobs = new Map() + jobGroups.forEach((group, name) => { + const mostRecentJob = group.reduce((mostRecent, current) => { + if (current.id === null) return mostRecent + const currentIdTime = current.id + const mostRecentIdTime = mostRecent ? mostRecent.id : 0 + + return currentIdTime > mostRecentIdTime ? current : mostRecent + }, null) + + if (mostRecentJob) { + mostRecentJobs.set(name, mostRecentJob.id) + } + }) + + return jobs.filter((job: JobInformation) => { + const mostRecentId = mostRecentJobs.get(job.name) + return job.id === null || job.id !== mostRecentId + }) +} + +export default cleanUpOutdatedJobs diff --git a/docker-compose.yml b/docker-compose.yml index 8593af32..66ff2116 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -31,7 +31,7 @@ services: ports: - 4551:4551 environment: - - DOMAIN=host.docker.internal + - DOMAIN=${NGROK_DOMAIN:-host.docker.internal} - PORT=3333 - AUTH_TOKEN=${NGROK_AUTH_TOKEN} - DEBUG=true diff --git a/libs/client/features/src/accounts-manager/AccountTypeSelector.tsx b/libs/client/features/src/accounts-manager/AccountTypeSelector.tsx index 2b7c81f8..d3be9221 100644 --- a/libs/client/features/src/accounts-manager/AccountTypeSelector.tsx +++ b/libs/client/features/src/accounts-manager/AccountTypeSelector.tsx @@ -7,12 +7,14 @@ import { useDebounce, usePlaid, useFinicity, + useTellerConfig, + useTellerConnect, } from '@maybe-finance/client/shared' - import { Input } from '@maybe-finance/design-system' import InstitutionGrid from './InstitutionGrid' import { AccountTypeGrid } from './AccountTypeGrid' import InstitutionList, { MIN_QUERY_LENGTH } from './InstitutionList' +import { useLogger } from '@maybe-finance/client/shared' const SEARCH_DEBOUNCE_MS = 300 @@ -23,6 +25,7 @@ export default function AccountTypeSelector({ view: string onViewChange: (view: string) => void }) { + const logger = useLogger() const { setAccountManager } = useAccountContext() const [searchQuery, setSearchQuery] = useState('') @@ -33,8 +36,11 @@ export default function AccountTypeSelector({ debouncedSearchQuery.length >= MIN_QUERY_LENGTH && view !== 'manual' + const config = useTellerConfig(logger) + const { openPlaid } = usePlaid() const { openFinicity } = useFinicity() + const { open: openTeller } = useTellerConnect(config, logger) const inputRef = useRef(null) @@ -77,6 +83,9 @@ export default function AccountTypeSelector({ case 'FINICITY': openFinicity(providerInstitution.providerId) break + case 'TELLER': + openTeller(providerInstitution.providerId) + break default: break } @@ -138,11 +147,12 @@ export default function AccountTypeSelector({ categoryUser: 'crypto', }, }) - return } - if (!data) return + if (!data) { + return + } switch (data.provider) { case 'PLAID': @@ -151,6 +161,9 @@ export default function AccountTypeSelector({ case 'FINICITY': openFinicity(data.providerId) break + case 'TELLER': + openTeller(data.providerId) + break default: break } diff --git a/libs/client/features/src/accounts-manager/InstitutionGrid.tsx b/libs/client/features/src/accounts-manager/InstitutionGrid.tsx index bdb55845..4321a6cf 100644 --- a/libs/client/features/src/accounts-manager/InstitutionGrid.tsx +++ b/libs/client/features/src/accounts-manager/InstitutionGrid.tsx @@ -14,48 +14,48 @@ const banks: GridImage[] = [ src: 'chase-bank.png', alt: 'Chase Bank', institution: { - provider: 'PLAID', - providerId: 'ins_56', + provider: 'TELLER', + providerId: 'chase', }, }, { src: 'capital-one.png', alt: 'Capital One Bank', institution: { - provider: 'PLAID', - providerId: 'ins_128026', + provider: 'TELLER', + providerId: 'capital_one', }, }, { src: 'wells-fargo.png', alt: 'Wells Fargo Bank', institution: { - provider: 'PLAID', - providerId: 'ins_127991', + provider: 'TELLER', + providerId: 'wells_fargo', }, }, { src: 'american-express.png', alt: 'American Express Bank', institution: { - provider: 'PLAID', - providerId: 'ins_10', + provider: 'TELLER', + providerId: 'amex', }, }, { src: 'bofa.png', alt: 'Bank of America', institution: { - provider: 'PLAID', - providerId: 'ins_127989', + provider: 'TELLER', + providerId: 'bank_of_america', }, }, { src: 'usaa-bank.png', alt: 'USAA Bank', institution: { - provider: 'PLAID', - providerId: 'ins_7', + provider: 'TELLER', + providerId: 'usaa', }, }, ] diff --git a/libs/client/features/src/accounts-manager/property/AddProperty.tsx b/libs/client/features/src/accounts-manager/property/AddProperty.tsx index 880b6915..3d8d2fd6 100644 --- a/libs/client/features/src/accounts-manager/property/AddProperty.tsx +++ b/libs/client/features/src/accounts-manager/property/AddProperty.tsx @@ -19,6 +19,7 @@ export function AddProperty({ defaultValues }: { defaultValues: Partial { + onSubmit={async ({ line1, city, state, country, zip, ...rest }) => { await updateAccount.mutateAsync({ id: account.id, data: { @@ -30,6 +30,7 @@ export function EditProperty({ account }: { account: SharedType.AccountDetail }) line1, city, state, + country, zip, }, }, diff --git a/libs/client/features/src/accounts-manager/property/PropertyForm.tsx b/libs/client/features/src/accounts-manager/property/PropertyForm.tsx index 7506c670..eec44819 100644 --- a/libs/client/features/src/accounts-manager/property/PropertyForm.tsx +++ b/libs/client/features/src/accounts-manager/property/PropertyForm.tsx @@ -1,7 +1,7 @@ import type { CreatePropertyFields, UpdatePropertyFields } from '@maybe-finance/client/shared' -import { Button, Input } from '@maybe-finance/design-system' -import { DateUtil } from '@maybe-finance/shared' -import { useForm } from 'react-hook-form' +import { Button, Input, Listbox } from '@maybe-finance/design-system' +import { DateUtil, Geo } from '@maybe-finance/shared' +import { Controller, useForm } from 'react-hook-form' import { AccountValuationFormFields } from '../AccountValuationFormFields' type Props = @@ -36,7 +36,26 @@ export default function PropertyForm({ mode, defaultValues, onSubmit }: Props) {
Location
- + ( + + + {Geo.countries.find((c) => c.code === field.value)?.name || + 'Select'} + + + {Geo.countries.map((country) => ( + + {country.name} + + ))} + + + )} + /> ) { const { addAccount } = useAccountContext() - return ( <>
@@ -338,7 +337,7 @@ function DefaultContent({ {onboarding && onboarding} - + {process.env.STRIPE_API_KEY && }
diff --git a/libs/client/features/src/layout/MobileLayout.tsx b/libs/client/features/src/layout/MobileLayout.tsx index 585af1dd..960b929e 100644 --- a/libs/client/features/src/layout/MobileLayout.tsx +++ b/libs/client/features/src/layout/MobileLayout.tsx @@ -174,7 +174,7 @@ export function MobileLayout({ children, sidebar }: MobileLayoutProps) {
- + {process.env.STRIPE_API_KEY && }
diff --git a/libs/client/features/src/user-billing/BillingPreferences.tsx b/libs/client/features/src/user-billing/BillingPreferences.tsx index 022a03d8..66064d1f 100644 --- a/libs/client/features/src/user-billing/BillingPreferences.tsx +++ b/libs/client/features/src/user-billing/BillingPreferences.tsx @@ -78,7 +78,9 @@ export function BillingPreferences() { )} - setTakeoverOpen(false)} /> + {process.env.STRIPE_API_KEY && ( + setTakeoverOpen(false)} /> + )} ) } diff --git a/libs/client/shared/src/api/index.ts b/libs/client/shared/src/api/index.ts index 6fe77f31..c03040f8 100644 --- a/libs/client/shared/src/api/index.ts +++ b/libs/client/shared/src/api/index.ts @@ -5,6 +5,7 @@ export * from './useFinicityApi' export * from './useInstitutionApi' export * from './useUserApi' export * from './usePlaidApi' +export * from './useTellerApi' export * from './useValuationApi' export * from './useTransactionApi' export * from './useHoldingApi' diff --git a/libs/client/shared/src/api/useTellerApi.ts b/libs/client/shared/src/api/useTellerApi.ts new file mode 100644 index 00000000..d67f4e69 --- /dev/null +++ b/libs/client/shared/src/api/useTellerApi.ts @@ -0,0 +1,64 @@ +import { useMemo } from 'react' +import toast from 'react-hot-toast' +import { useAxiosWithAuth } from '../hooks/useAxiosWithAuth' +import { useMutation, useQueryClient } from '@tanstack/react-query' +import type { SharedType } from '@maybe-finance/shared' +import type { AxiosInstance } from 'axios' +import type { TellerTypes } from '@maybe-finance/teller-api' +import { useAccountConnectionApi } from './useAccountConnectionApi' + +type TellerInstitution = { + name: string + id: string +} + +const TellerApi = (axios: AxiosInstance) => ({ + async handleEnrollment(input: { + institution: TellerInstitution + enrollment: TellerTypes.Enrollment + }) { + const { data } = await axios.post( + '/teller/handle-enrollment', + input + ) + return data + }, +}) + +export function useTellerApi() { + const queryClient = useQueryClient() + const { axios } = useAxiosWithAuth() + const api = useMemo(() => TellerApi(axios), [axios]) + + const { useSyncConnection } = useAccountConnectionApi() + const syncConnection = useSyncConnection() + + const addConnectionToState = (connection: SharedType.AccountConnection) => { + const accountsData = queryClient.getQueryData(['accounts']) + if (!accountsData) + queryClient.setQueryData(['accounts'], { + connections: [{ ...connection, accounts: [] }], + accounts: [], + }) + else { + const { connections, ...rest } = accountsData + queryClient.setQueryData(['accounts'], { + connections: [...connections, { ...connection, accounts: [] }], + ...rest, + }) + } + } + + const useHandleEnrollment = () => + useMutation(api.handleEnrollment, { + onSuccess: (_connection) => { + addConnectionToState(_connection) + syncConnection.mutate(_connection.id) + toast.success(`Account connection added!`) + }, + }) + + return { + useHandleEnrollment, + } +} diff --git a/libs/client/shared/src/hooks/index.ts b/libs/client/shared/src/hooks/index.ts index 6481beb2..9410b7f4 100644 --- a/libs/client/shared/src/hooks/index.ts +++ b/libs/client/shared/src/hooks/index.ts @@ -9,5 +9,6 @@ export * from './useQueryParam' export * from './useScreenSize' export * from './useAccountNotifications' export * from './usePlaid' +export * from './useTeller' export * from './useProviderStatus' export * from './useModalManager' diff --git a/libs/client/shared/src/hooks/useTeller.ts b/libs/client/shared/src/hooks/useTeller.ts new file mode 100644 index 00000000..a77ac913 --- /dev/null +++ b/libs/client/shared/src/hooks/useTeller.ts @@ -0,0 +1,182 @@ +import { useEffect, useState } from 'react' +import * as Sentry from '@sentry/react' +import type { Logger } from '../providers/LogProvider' +import toast from 'react-hot-toast' +import { useAccountContext } from '../providers' +import { useTellerApi } from '../api' +import type { + TellerConnectEnrollment, + TellerConnectFailure, + TellerConnectOptions, + TellerConnectInstance, +} from 'teller-connect-react' +import useScript from 'react-script-hook' +type TellerEnvironment = 'sandbox' | 'development' | 'production' | undefined +type TellerAccountSelection = 'disabled' | 'single' | 'multiple' | undefined +const TC_JS = 'https://cdn.teller.io/connect/connect.js' + +// Create the base configuration for Teller Connect +export const useTellerConfig = (logger: Logger) => { + return { + applicationId: process.env.NEXT_PUBLIC_TELLER_APP_ID ?? 'ADD_TELLER_APP_ID', + environment: (process.env.NEXT_PUBLIC_TELLER_ENV as TellerEnvironment) ?? 'sandbox', + selectAccount: 'disabled' as TellerAccountSelection, + onInit: () => { + logger.debug(`Teller Connect has initialized`) + }, + onSuccess: {}, + onExit: () => { + logger.debug(`Teller Connect exited`) + }, + onFailure: (failure: TellerConnectFailure) => { + logger.error(`Teller Connect exited with error`, failure) + Sentry.captureEvent({ + level: 'error', + message: 'TELLER_CONNECT_ERROR', + tags: { + 'teller.error.code': failure.code, + 'teller.error.message': failure.message, + }, + }) + }, + } as TellerConnectOptions +} + +// Custom implementation of useTellerHook to handle institution id being passed in +export const useTellerConnect = (options: TellerConnectOptions, logger: Logger) => { + const { useHandleEnrollment } = useTellerApi() + const handleEnrollment = useHandleEnrollment() + const { setAccountManager } = useAccountContext() + const [loading, error] = useScript({ + src: TC_JS, + checkForExisting: true, + }) + + const [teller, setTeller] = useState(null) + const [iframeLoaded, setIframeLoaded] = useState(false) + + const createTellerInstance = (institutionId: string) => { + return createTeller( + { + ...options, + onSuccess: async (enrollment: TellerConnectEnrollment) => { + logger.debug('User enrolled successfully') + try { + await handleEnrollment.mutateAsync({ + institution: { + id: institutionId!, + name: enrollment.enrollment.institution.name, + }, + enrollment, + }) + } catch (error) { + toast.error(`Failed to add account`) + } + }, + institution: institutionId, + onInit: () => { + setIframeLoaded(true) + options.onInit && options.onInit() + }, + }, + window.TellerConnect.setup + ) + } + + useEffect(() => { + if (loading) { + return + } + + if (!options.applicationId) { + return + } + + if (error || !window.TellerConnect) { + console.error('Error loading TellerConnect:', error) + return + } + + if (teller != null) { + teller.destroy() + } + + return () => teller?.destroy() + }, [ + loading, + error, + options.applicationId, + options.enrollmentId, + options.connectToken, + options.products, + ]) + + const ready = teller != null && (!loading || iframeLoaded) + + const logIt = () => { + if (!options.applicationId) { + console.error('teller-connect-react: open() called without a valid applicationId.') + } + } + + return { + error, + ready, + open: (institutionId: string) => { + logIt() + const tellerInstance = createTellerInstance(institutionId) + tellerInstance.open() + setAccountManager({ view: 'idle' }) + }, + } +} + +interface ManagerState { + teller: TellerConnectInstance | null + open: boolean +} + +export const createTeller = ( + config: TellerConnectOptions, + creator: (config: TellerConnectOptions) => TellerConnectInstance +) => { + const state: ManagerState = { + teller: null, + open: false, + } + + if (typeof window === 'undefined' || !window.TellerConnect) { + throw new Error('TellerConnect is not loaded') + } + + state.teller = creator({ + ...config, + onExit: () => { + state.open = false + config.onExit && config.onExit() + }, + }) + + const open = () => { + if (!state.teller) { + return + } + + state.open = true + state.teller.open() + } + + const destroy = () => { + if (!state.teller) { + return + } + + state.teller.destroy() + state.teller = null + } + + return { + open, + destroy, + } +} diff --git a/libs/client/shared/src/providers/AccountContextProvider.tsx b/libs/client/shared/src/providers/AccountContextProvider.tsx index 98ef3586..6a6aa38a 100644 --- a/libs/client/shared/src/providers/AccountContextProvider.tsx +++ b/libs/client/shared/src/providers/AccountContextProvider.tsx @@ -18,6 +18,7 @@ type PropertyMetadataValues = { line1: string city: string state: string + country: string zip: string } export type CreatePropertyFields = PropertyMetadataValues & AccountValuationFields @@ -50,6 +51,7 @@ type AccountManager = | { view: 'idle' } | { view: 'add-plaid'; linkToken: string } | { view: 'add-finicity' } + | { view: 'add-teller' } | { view: 'add-account' } | { view: 'add-property'; defaultValues: Partial } | { view: 'add-vehicle'; defaultValues: Partial } diff --git a/libs/design-system/src/lib/DatePicker/DatePicker.spec.tsx b/libs/design-system/src/lib/DatePicker/DatePicker.spec.tsx index a490e8bc..5ebb18cd 100644 --- a/libs/design-system/src/lib/DatePicker/DatePicker.spec.tsx +++ b/libs/design-system/src/lib/DatePicker/DatePicker.spec.tsx @@ -3,9 +3,6 @@ import { fireEvent, render, screen, waitFor } from '@testing-library/react' import { DatePicker } from './' import { DateTime } from 'luxon' -// Set date to Oct 29, 2021 to keep snapshots consistent -beforeAll(() => jest.useFakeTimers().setSystemTime(new Date('2021-10-29 12:00:00'))) - // DatePicker configuration const minDate = DateTime.now().minus({ years: 2 }) const maxDate = DateTime.now() diff --git a/libs/design-system/src/lib/DatePicker/DatePickerCalendar.tsx b/libs/design-system/src/lib/DatePicker/DatePickerCalendar.tsx index 34f307bc..c9cd8257 100644 --- a/libs/design-system/src/lib/DatePicker/DatePickerCalendar.tsx +++ b/libs/design-system/src/lib/DatePicker/DatePickerCalendar.tsx @@ -73,7 +73,7 @@ export function DatePickerCalendar({