How to Implement a Peer-to-Peer Payment System in FlutterFlow

In the Stripe Dashboard, enable Connect and configure your platform settings. Choose Express account type for simplicity. In Firestore, extend user documents with: stripeConnectId (String, nullable), stripeOnboardingComplete (Boolean, default false), stripePayoutsEnabled (Boolean). Create a transfers collection: fromUserId (String), toUserId (String), amount (Integer, in cents), currency (String, 'usd'), stripeTransferId (String), status (String: 'pending', 'completed', 'failed'), createdAt (Timestamp), note (String, optional message from sender). This model tracks all transfers with their Stripe reference IDs for reconciliation.

Build two Cloud Functions. First, createConnectAccount: creates a Stripe Express account for the user via stripe.accounts.create() with type 'express', stores the account ID in the user's stripeConnectId field, then generates an Account Link URL via stripe.accountLinks.create() with return and refresh URLs pointing to your app. Second, checkOnboardingStatus: checks the Stripe account's charges_enabled and payouts_enabled fields and updates the user's Firestore document accordingly. The user opens the Account Link URL in a WebView or external browser to complete Stripe's hosted identity verification form.

1// Cloud Function: createConnectAccount
2const functions = require('firebase-functions');
3const admin = require('firebase-admin');
4const stripe = require('stripe')(
5  process.env.STRIPE_SECRET_KEY);
6
7exports.createConnectAccount = functions.https
8  .onCall(async (data, context) => {
9    const userId = context.auth.uid;
10    const user = (await admin.firestore()
11      .doc(`users/${userId}`).get()).data();
12    // Create Express account
13    const account = await stripe.accounts.create({
14      type: 'express',
15      email: user.email,
16      capabilities: {
17        transfers: { requested: true },
18      },
19    });
20    await admin.firestore().doc(`users/${userId}`)
21      .update({ stripeConnectId: account.id });
22    // Create onboarding link
23    const accountLink = await stripe.accountLinks
24      .create({
25        account: account.id,
26        refresh_url: `${data.baseUrl}/onboarding-refresh`,
27        return_url: `${data.baseUrl}/onboarding-complete`,
28        type: 'account_onboarding',
29      });
30    return { url: accountLink.url, accountId: account.id };
31  });
32
33exports.checkOnboardingStatus = functions.https
34  .onCall(async (data, context) => {
35    const userId = context.auth.uid;
36    const user = (await admin.firestore()
37      .doc(`users/${userId}`).get()).data();
38    const account = await stripe.accounts
39      .retrieve(user.stripeConnectId);
40    await admin.firestore().doc(`users/${userId}`)
41      .update({
42        stripeOnboardingComplete:
43          account.details_submitted,
44        stripePayoutsEnabled:
45          account.payouts_enabled,
46      });
47    return {
48      complete: account.details_submitted,
49      payoutsEnabled: account.payouts_enabled
50    };
51  });

Create a WalletSetupPage. Check the user's stripeOnboardingComplete field. If false, show a setup card explaining that identity verification is required to send and receive money. Add a Verify Identity button that calls the createConnectAccount Cloud Function and opens the returned URL in a WebView or launches it externally. When the user returns, call checkOnboardingStatus to update their status. If onboarding is complete, show a green checkmark with 'Identity Verified' status. Display a KYC status indicator: 'Not Started' (grey), 'In Progress' (yellow), 'Verified' (green), 'Action Required' (red, when Stripe needs more info).

Create a SendMoneyPage with a user search TextField to find the recipient by name or email. Display the selected recipient's name and avatar. Add an amount TextField (numeric, formatted as currency) and an optional note TextField. On send, call a transferMoney Cloud Function that: validates both sender and recipient have verified Stripe Connect accounts, creates a charge on the sender via stripe.charges.create() with the platform as destination, then creates a transfer to the recipient via stripe.transfers.create(). Write the transfer record to Firestore with status 'completed'. Show a success animation and transfer confirmation with details.

1// Cloud Function: transferMoney
2exports.transferMoney = functions.https
3  .onCall(async (data, context) => {
4    const { toUserId, amount, note } = data;
5    const fromUserId = context.auth.uid;
6    const db = admin.firestore();
7    const fromUser = (await db.doc(
8      `users/${fromUserId}`).get()).data();
9    const toUser = (await db.doc(
10      `users/${toUserId}`).get()).data();
11    if (!fromUser.stripePayoutsEnabled ||
12        !toUser.stripePayoutsEnabled) {
13      throw new functions.https.HttpsError(
14        'failed-precondition',
15        'Both users must complete verification');
16    }
17    // Create transfer
18    const transfer = await stripe.transfers.create({
19      amount: amount, // in cents
20      currency: 'usd',
21      destination: toUser.stripeConnectId,
22      transfer_group: `p2p_${fromUserId}_${toUserId}`,
23    });
24    // Record in Firestore
25    await db.collection('transfers').add({
26      fromUserId, toUserId, amount,
27      currency: 'usd',
28      stripeTransferId: transfer.id,
29      status: 'completed',
30      note: note || '',
31      createdAt: admin.firestore
32        .FieldValue.serverTimestamp()
33    });
34    return { success: true,
35      transferId: transfer.id };
36  });

Create a WalletPage showing the user's current balance and transfer history. Call a Cloud Function that retrieves the Stripe balance for the user's Connect account via stripe.balance.retrieve({stripeAccount: connectId}). Display the available balance prominently at the top. Below, add a ListView with a Backend Query on transfers where fromUserId equals current user OR toUserId equals current user, ordered by createdAt descending. Each transfer row shows: direction icon (up arrow for sent, down arrow for received), recipient or sender name, amount (red for sent, green for received), note text if present, date, and status badge. Add filter ChoiceChips for All, Sent, and Received.