Connect to Xero

export const forEachTenant = async <T = unknown>(
	xero: XeroClient,
	callback: ForEachTenantCallback<T>,
	filter?: Record<string, any>
): Promise<WithTenantId<T>[]> => {
	if (!xero.tenants.length) await xero.updateTenants(false);

	const [tenantFilter] = splitFilter(filter);

	const filteredTenants = tenantFilter
		? xero.tenants.filter(inMemoryFilterFor(tenantFilter)) // this filter function can be found in the Xero Example code
		: xero.tenants;

	const results = await Promise.all(
		filteredTenants.map(async (tenant) => {
			const result = (await callback(tenant)) as WithTenantId<T>;

			// We should go ahead and doctor up the result(s) with a tenantId,
			// as Xero never adds it, but we need it on everything we're doing
			// a forEachTenant on.
			if (Array.isArray(result)) {
				result.forEach((element) => (element.tenantId = tenant.tenantId));
			} else {
				result.tenantId = tenant.tenantId;
			}

			return result;
		})
	);

	// Now we have a two dimensional array, which is an array for each tenant. Let's flatten it.
	return results.flat() as WithTenantId<T>[];
};

import 'reflect-metadata';
import Graphweaver from '@exogee/graphweaver-server';

import { resolvers } from './schema';
import { XeroAuthApolloPlugin } from '@exogee/graphweaver-xero';

const graphweaver = new Graphweaver({
	resolvers,
	apolloServerOptions: {
		plugins: [XeroAuthApolloPlugin],
	},
});

exports.handler = graphweaver.handler();

import { useSearchParams, Navigate } from 'react-router-dom';

export const XeroAuthCodeReceiver = () => {
	const [searchParams] = useSearchParams();
	// We need to set here on initial render so that we definitely capture the code if we're receiving an auth redirect.
	// Otherwise we get an extra loop through the OAuth flow because local storage gets set too late.
	if (
		!searchParams.has('code') ||
		!searchParams.has('scope') ||
		!searchParams.has('session_state')
	) {
		return (
			<p>
				Error: Invalid response from Xero, expected to have a code, scope and session_state in the
				url.
			</p>
		);
	}

	// Ok, we're definitely receiving an auth redirect from Xero or something that acts like Xero.
	// Let's read the code and put it in local storage so we can send it to the server.
	localStorage.setItem('graphweaver-auth', window.location.href);

	// Ok, now that we've saved it we're good to go.
	return <Navigate to="/" />;
};

export const customPages = {
	routes: () => [
		{
			// This is where Xero sends us back to after the OAuth flow.
			// Its job is to read the code and store it in local storage, then
			// redirect back to /.
			path: '/xero-auth-code',
			element: <XeroAuthCodeReceiver />,
		},
		{
			path: 'xero-dashboard',
			element: <DefaultLayout />,
			children: [
				{
					index: true,
					element: <AllCompanies />,
				},
				{
					path: ':tenantId',
					element: <SingleCompany />,
				},
			],
		},
	],
...