This is a monorepo containing packages that together provide a full membership and donation management system, delivered as a WordPress plugin.

• packages/join-flow — A React application implementing the join form frontend.
• packages/join-block — A WordPress Gutenberg plugin containing the join form block(s) and the backend logic that processes memberships, payments, and CRM integrations.
• packages/join-e2e — End-to-end tests (Puppeteer).

Current version: 1.4.0

1. A visitor lands on a WordPress page with the Join Form block. They enter their email address and are directed to the join form itself.
2. The Join Form Fullscreen Takeover block hosts the React application. It takes over the full page and guides the visitor through a multi-step form: personal details, membership plan selection, optional donation, and payment.
3. On submission the React app POSTs to a WordPress REST API endpoint provided by the plugin. The backend orchestrates all downstream services: it creates the payment, sets up the subscription or one-off charge, and syncs the new member to any configured integrations (Auth0, Zetkin, Action Network, Mailchimp).
4. On success the visitor is redirected to a configurable success page.

All copy within both blocks is fully configurable — nothing is hardcoded.

The join flow supports three distinct modes, controlled by environment variables:

The default. Steps:

1. Details — name, email, phone, address (with optional postcode lookup), date of birth, nationality, county, "how did you hear about us?", contact consent, and any configured custom fields.
2. Membership plan — choose a tier from the configured plans.
3. Donation (optional) — offer an additional one-off or recurring donation on top of membership.
4. Payment — select a payment method and complete payment.
5. Confirmation — review and submit.

Reorders and simplifies the flow to: Donation → Details → Payment. The membership amount equals the donation amount; no separate plan selection step is shown.

For existing members updating their membership or payment details. The email is pre-filled via a URL parameter and the details step is skipped.

The plugin supports three payment providers. They can be enabled independently and combined (e.g. Stripe for cards and GoCardless for Direct Debit).

• Recurring subscriptions (card and Direct Debit)
• One-off donations via PaymentIntent (£0.01–£10,000)
• Customer upsert (creates or looks up existing customers)
• Subscription metadata (plan, organisation)
• Test and Live mode
• Environment variable: REACT_APP_USE_STRIPE=true

• Recurring Direct Debit (UK/EU bank payments)
• Supports both Hosted Pages mode and API mode (requires GoCardless Pro account — REACT_APP_USE_GOCARDLESS_API=true)
• Automatic customer and mandate creation
• Sandbox and Live environments
• Environment variable: REACT_APP_USE_GOCARDLESS=true

• Subscription and billing management (multi-currency)
• Hosted Pages mode for PCI compliance
• API mode for direct customer/subscription creation
• Environment variable: REACT_APP_USE_CHARGEBEE=true

All integrations are optional. Enable and configure them via environment variables or the WordPress settings page.

The plugin handles member lapsing automatically in response to payment provider webhooks.

• A Stripe subscription entering unpaid or incomplete_expired triggers a lapse.
• A Stripe subscription returning to active triggers an unlapse.
• Lapsed/unlapsed status is reflected in all configured integrations (e.g. "lapsed" tag in Action Network, Mailchimp, Zetkin).

The plugin exposes filters and actions for customisation without modifying plugin code.

Controls whether a member should be lapsed when a lapsing event is detected.

add_filter('ck_join_flow_should_lapse_member', function ($default, $email, $context) {
    if (($context['provider'] ?? '') === 'gocardless') {
        return false;
    }
    return $default;
}, 10, 3);

Controls whether a member should be unlapsed when a reactivation event is detected.

Customise tags applied across all integrations.

Action Network-specific tag overrides.

Fired after a successful join.

Fired when the join process encounters an error.

Fired after a member has been successfully marked as lapsed.

add_action('ck_join_flow_member_lapsed', function ($email, $context) {
    // e.g. send an internal notification or update a CRM
}, 10, 2);

Fired after a member has been successfully unmarked as lapsed.

Create an Auth0 machine-to-machine application and authorise it for the Auth0 Management API.

1. Go to Applications > APIs > Auth0 Management API > Machine to Machine Applications.
2. Authorise your application.
3. Expand the authorisation and add the following scopes: read:users, update:users, create:users, delete:users.

Configuration is available through a WordPress settings page (Settings > CK Join Flow) or via environment variables. The .env.example files in each package list all available variables.

[
  {
    "value": "standard",
    "label": "Standard",
    "amount": "10",
    "frequency": "monthly",
    "currency": "GBP",
    "allowCustomAmount": false,
    "add_tags": ["member"],
    "remove_tags": []
  }
]

• React 16, React Bootstrap
• React Hook Form, Yup (form state and validation)
• Stripe.js / @stripe/react-stripe-js
• Chargebee.js
• Webpack 5, Babel 7, SASS
• Jest, Testing Library

• PHP 8+, WordPress
• Carbon Fields (admin UI)
• Stripe PHP SDK, GoCardless PHP SDK, Chargebee PHP SDK
• Auth0 PHP SDK
• Mailchimp Marketing SDK
• GuzzleHTTP, Monolog, Google Cloud Logging
• PHPUnit, Brain Monkey, Mockery

• Lerna (monorepo)
• Docker Compose (local WordPress environment)
• GitHub Actions (CI/CD, WordPress.org releases)

yarn
yarn composer
yarn build

This produces a deployable WordPress plugin in packages/join-block.

Releases are automated via GitHub Actions (.github/workflows/release-plugin.yml).

1. Bump the version:

./scripts/bump-version.sh           # auto-increments patch
./scripts/bump-version.sh 1.4.0     # or specify a version

2. Commit and tag:

git add -A
git commit -m "Bump version to 1.4.0"
git tag 1.4.0
git push && git push --tags

The GitHub Action will build, package, and deploy to the WordPress.org plugin repository automatically. Monitor progress in the Actions tab.

yarn && yarn composer && yarn build
sh scripts/package.sh

Upload the resulting zip to a WordPress site and activate the plugin.

Note: The packaging script removes vendor/giggsey/libphonenumber-for-php/src/geocoding to stay under the 10 MB WordPress.org plugin size limit.

Prerequisites: Node.js >= 18, Yarn, Composer, Docker

# Install dependencies
yarn
yarn composer

# Configure the frontend
cd packages/join-flow
cp .env.example .env
# Edit .env — add API keys and enable desired features

# Start the Docker stack
cd ../..
yarn start

• WordPress admin: http://localhost:8082/wp-admin
• React dev server (live reload): http://localhost:3000

WordPress setup:

1. Go to http://localhost:8082/wp-admin/plugins.php and activate the Join plugin.
2. Add the Join Form Fullscreen Takeover block to a page — this is where the join flow lives.
3. Optionally add the Join Form block elsewhere to pre-fill the email and link through.
4. Configure credentials and feature flags at Settings > CK Join Flow.

yarn
cd packages/join-flow
cp .env.example .env
yarn run frontend
# Open http://localhost:3000

Use REACT_APP_USE_TEST_DATA=true in .env to pre-fill the form with example data.

cd packages/join-flow
yarn test

cd packages/join-block
composer test

cd packages/join-e2e
yarn test