> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flinks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# GEFT Widget

> Embed the GEFT widget iframe to guide users through the guaranteed payment flow.

## What your customers will see

The GEFT widget is embedded into your site as an iframe that guides users through the guaranteed payment flow. Users will experience a seamless payment process with real-time guarantee decisions and secure bank account connection.

The GEFT widget flow includes:

1. **Institution Selection** - Users select their financial institution
2. **Bank Authentication** - Secure login to their bank account
3. **Account Selection** - Choose the account for payment
4. **Amount Confirmation** - Enter or confirm payment amount
5. **Guarantee Evaluation** - Real-time guarantee decision by Flinks
6. **PAD Agreement** - Sign Pre-Authorized Debit agreement
7. **Payment Completion** - Guaranteed payment processing

## Launching the GEFT Widget

Once you have a sessionId from the [/Sessions/Initiate](/api/pay/endpoints/geft/sessions-initiate) endpoint, launch the GEFT widget:

```html theme={null}
<iframe
  src="https://payments.flinksapp.com/app/?sessionId=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
  width="100%"
  height="600"
  frameborder="0">
</iframe>
```

### Widget URL Structure

The GEFT widget URL follows this pattern:

```
https://payments.flinksapp.com/app/?sessionId=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
```

Where:

* **payments.flinksapp.com** - Production environment URL
* **xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx** - The session ID obtained from session creation

For sandbox testing, use `payments-uat.flinksapp.com` instead.

## Supported Browsers

The GEFT widget is supported by:

* Chrome
* Safari
* Firefox
* Microsoft Edge
* Opera

## Widget Configuration

Widget behavior is controlled through session creation parameters rather than URL parameters. Configure your GEFT widget by setting options in the [/Sessions/Initiate](/api/pay/endpoints/geft/sessions-initiate) request:

### Language Settings

```json theme={null}
{
  "options": {
    "notificationPreferences": {
      "language": "EN" // or "FR"
    }
  }
}
```

### Amount Handling

```json theme={null}
{
  "amount": 500.00 // Pre-set amount (optional)
}
```

If amount is omitted, users will enter the amount in the widget flow.

### Consent Screen

```json theme={null}
{
  "options": {
    "showConsentScreen": true // or false
  }
}
```

Controls whether to display the Flinks consent screen or use your own.

## Widget States and User Experience

### Initial Loading

When the widget loads, users see the institution selection screen where they choose their bank.

### Authentication Flow

After selecting their institution, users are redirected to their bank's login page for secure authentication.

### Guarantee Decision

Once authenticated, Flinks evaluates the transaction in real-time and provides either:

* **Guarantee Approval** - Payment can proceed with Flinks assuming EFT risk
* **Guarantee Decline** - Alternative payment methods should be offered

### PAD Agreement

For approved guarantees, users must sign a Pre-Authorized Debit agreement before payment processing begins.

### Completion

After successful completion, the widget indicates payment success and can redirect users back to your application.

## Integration Best Practices

### Widget Sizing

* **Minimum width**: 400px
* **Recommended height**: 600px
* **Responsive design**: Use percentage widths for mobile compatibility

### Error Handling

Implement proper error handling for various scenarios:

* Network connectivity issues
* Session timeouts
* User abandonment
* Guarantee failures

### User Experience

* Show loading indicators during widget initialization
* Provide clear messaging about the guarantee process
* Offer alternative payment methods for guarantee failures
* Implement session timeout handling

## Event Monitoring

Monitor widget events to track user progress and handle different scenarios. See [Event Handling](/guides/pay/geft/event-handling) for detailed event documentation and implementation examples.

Common events to monitor:

* `APP_MOUNTED` - Widget successfully loaded
* `INSTITUTION_SELECTED` - User selected their bank
* `GUARANTEE_OFFERED` - Payment can be guaranteed
* `SUCCESS` - Payment completed successfully
* `GUARANTEE_FAILED` - Guarantee declined

## Testing Your Widget

Use the sandbox environment to test your GEFT widget integration:

1. Use sandbox credentials and base URI
2. Test with various reference IDs to trigger different scenarios
3. Verify event handling for all possible outcomes
4. Test on different devices and browsers

See the [Sandbox Guide](/guides/pay/geft/sandbox-overview) for complete testing procedures and test scenarios.

## Related Documentation

* **[Setup Guide](/guides/pay/geft/setup-flinks-pay)**: Complete implementation walkthrough
* **[Event Handling](/guides/pay/geft/event-handling)**: Widget event tracking
* **[Sandbox Guide](/guides/pay/geft/sandbox-overview)**: Testing procedures
* **[API Reference](/api/pay/endpoints/geft/index)**: Backend API documentation