{% extends 'Layouts/Doc/default.html.twig' %}
{% block title %}{{ 'app.documentation.menu.webhook.overview'|trans }}{% endblock %}
{% block headerPageTitle %}WEBHOOK {{ 'app.documentation.menu.webhook.overview'|trans|upper }}{% endblock %}
{% block body %}
<div class="card mb-12">
<div class="card-body flex-column p-5">
<div class="d-flex align-items-center h-lg-200px p-5 p-lg-15">
<div class="row">
<div class="col-md-8 pt-5 scroll-y">
<h1 class="fw-bold fs-4 fs-lg-1 text-gray-800 mb-3">Use incoming webhooks to get real-time updates</h1>
<div class="position-relative w-100 text-gray-800">
<p><strong>Listen for events on your Popina Order account so your integration can automatically trigger reactions.</strong></p>
<p><strong>Popina Order</strong> uses webhooks to notify your application when an event happens in your account. Webhooks are particularly useful for asynchronous events like when a customer’s bank confirms a payment, a customer disputes a charge, a recurring payment succeeds, or when order's state changes.</p>
</div>
</div>
<div class="col-md-4 text-center">
<img src="/metronic8/demo1/assets/media/illustrations/sketchy-1/20.png" alt="" class="mw-100 mh-125px mh-lg-275px mb-lg-n12">
<img alt="Logo" src="{{ asset( foxorders_doc ~ 'webhook/logo.png') }}" style="width:150px; height:auto">
</div>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-body flex-column p-5">
<div class="d-flex align-items-center p-lg-15">
<div class="row">
<div class="col-md-12 scroll-y">
<h1 class="fw-bold fs-4 fs-lg-1 text-gray-800 mb-3">Why use webhooks</h1>
<p>Let’s say you’ve registered to receive the <strong>order.payed</strong> event and a customer clicks the <strong>“Pay”</strong> button in your app or website. A webhook between <strong>Popina Order</strong> and your app tells your app whether the customer’s payment is successful or not. After your webhook endpoint receives the <strong>order.payed</strong> event, your webhook function can then run backend actions to fulfill an order–such as calling your kitchen's interface APIs to inform your staff. Using an API for this workflow is like calling the API every millisecond to ask, was the payment successful?</p>
<h1 class="fw-bold fs-4 fs-lg-1 text-gray-800 mb-3 mt-10">How Popina Order uses webhooks</h1>
<p>A <strong>webhook</strong> enables <strong>Popina Order</strong> to push real-time notifications to your app. Popina Order uses <strong>HTTPS</strong> to send these notifications to your app as a <strong>JSON payload</strong>. You can then use these notifications to execute actions in your backend systems. To learn more, see <a href="{{ path('foxorders_documentation_webhook_events_order') }}"><strong>POPINA ORDER Order events</strong></a> and <a href="{{ path('foxorders_documentation_webhook_events_sync') }}"><strong>POPINA ORDER Sync events</strong></a>.</p>
<div class="text-center">
<img alt="webhook-schema" src="{{ asset( foxorders_doc ~ 'webhook/webhooks-notifications.jpg') }}" style="width:70%;">
</div>
<h1 class="fw-bold fs-4 fs-lg-1 text-gray-800 mb-3 mt-10">Steps to receive webhooks</h1>
<p>You can start receiving event notifications in your app using the steps in this section:</p>
<ol>
<li><strong>Identify the events</strong> you want to monitor and the <strong>event payloads</strong> to parse.</li>
<li><strong>Create a webhook endpoint</strong> as an HTTP endpoint (URL) on your local server.</li>
<li><strong>Handle POST requests from Popina Order</strong> by parsing each event object and returning 2xx response status codes.</li>
<li><strong>Test</strong> that your webhook endpoint is <strong>working properly</strong>.</li>
<li><strong>Deploy your webhook endpoint</strong> so it’s a publicly accessible HTTPS URL.</li>
<li><strong>Register your publicly accessible HTTPS URL</strong> in the Popina Order dashboard.</li>
</ol>
<h1 class="fw-bold fs-4 fs-lg-1 text-gray-800 mb-3 mt-10">Built-in retries</h1>
<p><strong>Popina Order webhooks</strong> have <strong>built-in retry methods</strong> for <strong>3xx</strong>, <strong>4xx</strong>, or <strong>5xx</strong> response status codes.</p>
<p>If Popina Order doesn’t quickly receive a <strong>2xx</strong> response status code for an event (after the configured retries number), we mark the event as <strong>failed</strong> and stop trying to send it to your endpoint. After multiple days, we email you about the misconfigured endpoint, and automatically disable it soon after if you haven’t addressed it.</p>
<div class="p-5 mt-4 bg-light mt-10">
<h4>Popina Order webhooks configuration</h4>
<p>In order to configure your <strong>app's endpoint and the retries</strong>, you must contact <strong>Popina Order support team</strong>.</p>
<p><strong>Popina Order</strong> can attempt reties attempts up to <strong>3 times</strong>.</p>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}