From c0287085b5c59f91b53da300f246cfc1a473a757 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Tue, 20 Jul 2021 21:26:24 +1000
Subject: [PATCH 01/60] Scaffolding Paytrace

---
 app/Console/Commands/CreateAccount.php        |   1 +
 app/Models/CompanyGateway.php                 |   8 +-
 app/Models/SystemLog.php                      |   2 +-
 app/PaymentDrivers/PayTrace/CreditCard.php    | 121 +++++++++++++
 app/PaymentDrivers/PaytracePaymentDriver.php  | 123 +++++++++++++
 ...95537_activate_paytrace_payment_driver.php |  29 ++++
 database/seeders/PaymentLibrariesSeeder.php   |   4 +-
 .../gateways/paytrace/authorize.blade.php     | 162 ++++++++++++++++++
 .../ninja2020/gateways/paytrace/pay.blade.php |   0
 .../livewire/simple-bootstrap.blade.php       |  29 ++++
 10 files changed, 474 insertions(+), 5 deletions(-)
 create mode 100644 app/PaymentDrivers/PayTrace/CreditCard.php
 create mode 100644 app/PaymentDrivers/PaytracePaymentDriver.php
 create mode 100644 database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
 create mode 100644 resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
 create mode 100644 resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
 create mode 100644 resources/views/vendor/livewire/simple-bootstrap.blade.php

diff --git a/app/Console/Commands/CreateAccount.php b/app/Console/Commands/CreateAccount.php
index 689ba262b0b5..b210981e16ba 100644
--- a/app/Console/Commands/CreateAccount.php
+++ b/app/Console/Commands/CreateAccount.php
@@ -91,6 +91,7 @@ class CreateAccount extends Command
         $account = Account::factory()->create();
         $company = Company::factory()->create([
             'account_id' => $account->id,
+            'domain' => config('ninja.app_url'),
         ]);
 
         $account->default_company_id = $company->id;
diff --git a/app/Models/CompanyGateway.php b/app/Models/CompanyGateway.php
index b9105b566e9e..1204b8e0ea1a 100644
--- a/app/Models/CompanyGateway.php
+++ b/app/Models/CompanyGateway.php
@@ -69,16 +69,20 @@ class CompanyGateway extends BaseModel
     // const TYPE_CUSTOM = 306;
     // const TYPE_BRAINTREE = 307;
     // const TYPE_WEPAY = 309;
+    // const TYPE_PAYFAST = 310;
+    // const TYPE_PAYTRACE = 311;
 
     public $gateway_consts = [
         '38f2c48af60c7dd69e04248cbb24c36e' => 300,
         'd14dd26a37cecc30fdd65700bfb55b23' => 301,
+        'd14dd26a47cecc30fdd65700bfb67b34' => 301,
         '3758e7f7c6f4cecf0f4f348b9a00f456' => 304,
         '3b6621f970ab18887c4f6dca78d3f8bb' => 305,
         '54faab2ab6e3223dbe848b1686490baa' => 306,
-        'd14dd26a47cecc30fdd65700bfb67b34' => 301,
-        '8fdeed552015b3c7b44ed6c8ebd9e992' => 309,
         'f7ec488676d310683fb51802d076d713' => 307,
+        '8fdeed552015b3c7b44ed6c8ebd9e992' => 309,
+        'd6814fc83f45d2935e7777071e629ef9' => 310,
+        'bbd736b3254b0aabed6ad7fda1298c88' => 311,
     ];
 
     protected $touches = [];
diff --git a/app/Models/SystemLog.php b/app/Models/SystemLog.php
index 7614c01ecccc..5e933edfe8a1 100644
--- a/app/Models/SystemLog.php
+++ b/app/Models/SystemLog.php
@@ -68,7 +68,7 @@ class SystemLog extends Model
     const TYPE_BRAINTREE = 307;
     const TYPE_WEPAY = 309;
     const TYPE_PAYFAST = 310;
-    
+    const TYPE_PAYTRACE = 311;
 
     const TYPE_QUOTA_EXCEEDED = 400;
     const TYPE_UPSTREAM_FAILURE = 401;
diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
new file mode 100644
index 000000000000..58937195e553
--- /dev/null
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -0,0 +1,121 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace App\PaymentDrivers\PayTrace;
+
+use App\Exceptions\PaymentFailed;
+use App\Jobs\Mail\PaymentFailureMailer;
+use App\Jobs\Util\SystemLogger;
+use App\Models\ClientGatewayToken;
+use App\Models\GatewayType;
+use App\Models\Payment;
+use App\Models\PaymentHash;
+use App\Models\PaymentType;
+use App\Models\SystemLog;
+use App\PaymentDrivers\PayFastPaymentDriver;
+use App\PaymentDrivers\PaytracePaymentDriver;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Cache;
+use Illuminate\Support\Str;
+
+class CreditCard
+{
+
+    public $paytrace_driver;
+
+    public function __construct(PaytracePaymentDriver $paytrace_driver)
+    {
+        $this->paytrace_driver = $paytrace_driver;
+    }
+
+    public function authorizeView($data)
+    {
+        
+        $data['client_key'] = $this->paytrace_driver->getAuthToken();
+
+        return render('gateways.paytrace.authorize', $data);
+    }
+
+
+ 	public function authorizeResponse($request)
+ 	{
+        $data = $request->all();
+
+        return response()->json([], 200);
+
+ 	}  
+
+    public function paymentView($data)
+    {
+
+
+        return render('gateways.paytrace.pay', $data);
+
+    }
+
+
+    public function paymentResponse(Request $request)
+    {
+        $response_array = $request->all();
+
+
+
+        // if($response_array['payment_status'] == 'COMPLETE') {
+
+        //     $this->payfast->logSuccessfulGatewayResponse(['response' => $response_array, 'data' => $this->paytrace_driver->payment_hash], SystemLog::TYPE_PAYFAST);
+
+        //     return $this->processSuccessfulPayment($response_array);
+        // }
+        // else {
+        //     $this->processUnsuccessfulPayment($response_array);
+        // }
+    }
+
+    private function processSuccessfulPayment($response_array)
+    {
+
+
+
+        // $payment = $this->paytrace_driver->createPayment($payment_record, Payment::STATUS_COMPLETED);
+
+
+    }
+
+    private function processUnsuccessfulPayment($server_response)
+    {
+        // PaymentFailureMailer::dispatch($this->paytrace_driver->client, $server_response->cancellation_reason, $this->paytrace_driver->client->company, $server_response->amount);
+
+        // PaymentFailureMailer::dispatch(
+        //     $this->paytrace_driver->client,
+        //     $server_response,
+        //     $this->paytrace_driver->client->company,
+        //     $server_response['amount_gross']
+        // );
+
+        // $message = [
+        //     'server_response' => $server_response,
+        //     'data' => $this->paytrace_driver->payment_hash->data,
+        // ];
+
+        // SystemLogger::dispatch(
+        //     $message,
+        //     SystemLog::CATEGORY_GATEWAY_RESPONSE,
+        //     SystemLog::EVENT_GATEWAY_FAILURE,
+        //     SystemLog::TYPE_PAYFAST,
+        //     $this->payfast->client,
+        //     $this->payfast->client->company,
+        // );
+
+        // throw new PaymentFailed('Failed to process the payment.', 500);
+    }
+
+}
\ No newline at end of file
diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
new file mode 100644
index 000000000000..94049366d250
--- /dev/null
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -0,0 +1,123 @@
+<?php
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace App\PaymentDrivers;
+
+use App\Models\ClientGatewayToken;
+use App\Models\GatewayType;
+use App\Models\Payment;
+use App\Models\PaymentHash;
+use App\Models\SystemLog;
+use App\PaymentDrivers\PayTrace\CreditCard;
+use App\Utils\CurlUtils;
+use App\Utils\Traits\MakesHash;
+
+class PaytracePaymentDriver extends BaseDriver
+{
+    use MakesHash;
+    
+    public $refundable = true; 
+
+    public $token_billing = true; 
+
+    public $can_authorise_credit_card = true; 
+
+    public $gateway; 
+
+    public $payment_method; 
+
+    public static $methods = [
+        GatewayType::CREDIT_CARD => CreditCard::class, //maps GatewayType => Implementation class
+    ];
+
+    const SYSTEM_LOG_TYPE = SystemLog::TYPE_PAYTRACE; //define a constant for your gateway ie TYPE_YOUR_CUSTOM_GATEWAY - set the const in the SystemLog model
+
+    public function init()
+    {
+        return $this; /* This is where you boot the gateway with your auth credentials*/
+    }
+
+    /* Returns an array of gateway types for the payment gateway */
+    public function gatewayTypes(): array
+    {
+        $types = [];
+
+            $types[] = GatewayType::CREDIT_CARD;
+
+        return $types;
+    }
+
+    /* Sets the payment method initialized */
+    public function setPaymentMethod($payment_method_id)
+    {
+        $class = self::$methods[$payment_method_id];
+        $this->payment_method = new $class($this);
+        return $this;
+    }
+
+    public function authorizeView(array $data)
+    {
+        return $this->payment_method->authorizeView($data); //this is your custom implementation from here
+    }
+
+    public function authorizeResponse($request)
+    {
+        return $this->payment_method->authorizeResponse($request);  //this is your custom implementation from here
+    }
+
+    public function processPaymentView(array $data)
+    {
+        return $this->payment_method->paymentView($data);  //this is your custom implementation from here
+    }
+
+    public function processPaymentResponse($request)
+    {
+        return $this->payment_method->paymentResponse($request); //this is your custom implementation from here
+    }
+
+    public function refund(Payment $payment, $amount, $return_client_response = false)
+    {
+        return $this->payment_method->yourRefundImplementationHere(); //this is your custom implementation from here
+    }
+
+    public function tokenBilling(ClientGatewayToken $cgt, PaymentHash $payment_hash)
+    {
+        return $this->payment_method->yourTokenBillingImplmentation(); //this is your custom implementation from here
+    }
+
+    public function processWebhookRequest(PaymentWebhookRequest $request, Payment $payment = null)
+    {
+    }
+
+    /*Helpers*/
+
+    public function getAuthToken()
+    {
+
+        $url = 'https://api.paytrace.com/oauth/token';
+        $data = [
+            'grant_type' => 'password',
+            'username' => $this->company_gateway->getConfigField('username'),
+            'password' => $this->company_gateway->getConfigField('password')
+        ];
+
+        $response = CurlUtils::post($url, $data, $headers = false);
+
+        if($response)
+        {
+            $auth_data = json_decode($response);
+
+            return $auth_data->access_token;
+        }
+
+        return false;
+    }
+}
diff --git a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
new file mode 100644
index 000000000000..5d9743c35714
--- /dev/null
+++ b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
@@ -0,0 +1,29 @@
+<?php
+
+use App\Models\Gateway;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class ActivatePaytracePaymentDriver extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Gateway::query()->where('id', 46)->update(['visible' => true, 'provider' => 'Paytrace']);
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        //
+    }
+}
diff --git a/database/seeders/PaymentLibrariesSeeder.php b/database/seeders/PaymentLibrariesSeeder.php
index b9ff0f84146f..e6d31f414fe4 100644
--- a/database/seeders/PaymentLibrariesSeeder.php
+++ b/database/seeders/PaymentLibrariesSeeder.php
@@ -70,7 +70,7 @@ class PaymentLibrariesSeeder extends Seeder
             ['id' => 43, 'name' => 'Fasapay', 'provider' => 'Fasapay', 'key' => '1b2cef0e8c800204a29f33953aaf3360', 'fields' => ''],
             ['id' => 44, 'name' => 'Komoju', 'provider' => 'Komoju', 'key' => '7ea2d40ecb1eb69ef8c3d03e5019028a', 'fields' => '{"apiKey":"","accountId":"","paymentMethod":"credit_card","testMode":false,"locale":"en"}'],
             ['id' => 45, 'name' => 'Paysafecard', 'provider' => 'Paysafecard', 'key' => '70ab90cd6c5c1ab13208b3cef51c0894', 'fields' => '{"username":"","password":"","testMode":false}'],
-            ['id' => 46, 'name' => 'Paytrace', 'provider' => 'Paytrace_CreditCard', 'key' => 'bbd736b3254b0aabed6ad7fda1298c88', 'fields' => '{"username":"","password":"","testMode":false,"endpoint":"https:\/\/paytrace.com\/api\/default.pay"}'],
+            ['id' => 46, 'name' => 'Paytrace', 'provider' => 'Paytrace', 'key' => 'bbd736b3254b0aabed6ad7fda1298c88', 'fields' => '{"username":"","password":"","testMode":false,"endpoint":"https:\/\/paytrace.com\/api\/default.pay"}'],
             ['id' => 47, 'name' => 'Secure Trading', 'provider' => 'SecureTrading', 'key' => '231cb401487b9f15babe04b1ac4f7a27', 'fields' => '{"siteReference":"","username":"","password":"","applyThreeDSecure":false,"accountType":"ECOM"}'],
             ['id' => 48, 'name' => 'SecPay', 'provider' => 'SecPay', 'key' => 'bad8699d581d9fa040e59c0bb721a76c', 'fields' => '{"mid":"","vpnPswd":"","remotePswd":"","usageType":"","confirmEmail":"","testStatus":"true","mailCustomer":"true","additionalOptions":""}'],
             ['id' => 49, 'name' => 'WePay', 'provider' => 'WePay', 'is_offsite' => false, 'sort_order' => 3, 'key' => '8fdeed552015b3c7b44ed6c8ebd9e992', 'fields' => '{"accountId":"","accessToken":"","type":"goods","testMode":false,"feePayer":"payee"}'],
@@ -96,7 +96,7 @@ class PaymentLibrariesSeeder extends Seeder
 
         Gateway::query()->update(['visible' => 0]);
 
-        Gateway::whereIn('id', [1,15,20,39,55,50])->update(['visible' => 1]);
+        Gateway::whereIn('id', [1,15,20,39,46,55,50])->update(['visible' => 1]);
 
         if (Ninja::isHosted()) {
             Gateway::whereIn('id', [20])->update(['visible' => 0]);
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
new file mode 100644
index 000000000000..061901fb3dd2
--- /dev/null
+++ b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
@@ -0,0 +1,162 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' => ctrans('texts.credit_card')])
+
+@section('gateway_head')
+@endsection
+
+@section('gateway_content')
+    
+    @if(!Request::isSecure())
+        <p class="alert alert-failure">{{ ctrans('texts.https_required') }}</p>
+    @endif
+
+    <div class="alert alert-failure mb-4" hidden id="errors"></div>
+
+    <div class="w-screen items-center">
+
+        <div id='pt_hpf_form'><!--iframe sensitive data payment fields inserted here--></div>
+
+    </div>
+
+    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}" id="ProtectForm">
+
+    <div class="bg-white px-4 py-5 flex justify-end">
+        <button
+            type="submit"
+            id="{{ $id ?? 'pay-now' }}"
+            class="button button-primary bg-primary {{ $class ?? '' }}">
+            <span>{{ ctrans('texts.add_payment_method') }}</span>
+        </button>
+    </div>
+
+    </form>
+@endsection
+
+@section('gateway_footer')
+
+<script src='https://protect.paytrace.com/js/protect.min.js'></script>
+
+<script>
+
+  // Minimal Protect.js setup call
+  PTPayment.setup({
+   styles:
+  {
+   'code': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'border_style':'dotted',
+    'font_size':'13pt',
+    'input_border_radius':'10px',
+    'input_border_width':'2px',
+    'input_font':'serif, cursive, fantasy',
+    'input_font_weight':'700',
+    'input_margin':'5px 0px 5px 20px',
+    'input_padding':'0px 5px 0px 5px',
+    'label_color':'#5D99CA',
+    'label_size':'16px',
+    'label_width':'150px',
+    'label_font':'sans-serif, arial, serif',
+    'label_font_weight':'bold',
+    'label_margin':'5px 0px 0px 20px',
+    'label_padding':'2px 5px 2px 5px',
+    'label_border_style':'dotted',
+    'label_border_color':'#EF9F6D',
+    'label_border_radius':'10px',
+    'label_border_width':'2px',
+    'background_color':'white',
+    'height':'25px',
+    'width':'110px',
+    'padding_bottom':'2px'
+   },
+   'cc': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'border_style':'solid',
+    'font_size':'13pt',
+    'input_border_radius':'20px',
+    'input_border_width':'2px',
+    'input_font':'Times New Roman, arial, fantasy',
+    'input_font_weight':'400',
+    'input_margin':'5px 0px 5px 0px',
+    'input_padding':'0px 5px 0px 5px',
+    'label_color':'#5D99CA',
+    'label_size':'16px',
+    'label_width':'150px',
+    'label_font':'Times New Roman, sans-serif, serif',
+    'label_font_weight':'light',
+    'label_margin':'5px 0px 0px 0px',
+    'label_padding':'0px 5px 0px 5px',
+    'label_border_style':'solid',
+    'label_border_color':'#EF9F6D',
+    'label_border_radius':'20px',
+    'label_border_width':'2px',
+    'background_color':'white',
+    'height':'25px',
+    'width':'320px',
+    'padding_bottom':'0px'
+   },
+   'exp': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'border_style':'dashed',
+    'font_size':'12pt',
+    'input_border_radius':'0px',
+    'input_border_width':'2px',
+    'input_font':'arial, cursive, fantasy',
+    'input_font_weight':'400',
+    'input_margin':'5px 0px 5px 0px',
+    'input_padding':'0px 5px 0px 5px',
+    'label_color':'#5D99CA',
+    'label_size':'16px',
+    'label_width':'150px',
+    'label_font':'arial, fantasy, serif',
+    'label_font_weight':'normal',
+    'label_margin':'5px 0px 0px 0px',
+    'label_padding':'2px 5px 2px 5px',
+    'label_border_style':'dashed',
+    'label_border_color':'#EF9F6D',
+    'label_border_radius':'0px',
+    'label_border_width':'2px',
+    'background_color':'white',
+    'height':'25px',
+    'width':'85px',
+    'padding_bottom':'2px',
+    'type':'dropdown'
+   },
+   'body': {
+    'background_color':'white'
+   }
+  },    
+    authorization: { clientKey: "{!! $client_key !!}" }
+  }).then(function(instance){
+      //use instance object to process and tokenize sensitive data payment fields.
+PTPayment.theme('above the line');
+
+  });
+
+
+
+  // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
+document.getElementById("ProtectForm").addEventListener("submit",function(e){
+ e.preventDefault();
+ e.stopPropagation();
+
+// To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
+PTPayment.validate(function(validationErrors) {
+ if (validationErrors.length >= 1) {
+  if (validationErrors[0]['responseCode'] == '35') {
+   // Handle validation Errors here
+   // This is an example of using dynamic styling to show the Credit card number entered is invalid
+   PTPayment.style({'cc': {'border_color': 'red'}});
+  }
+ } else {
+   // no error so tokenize
+   instance.process()
+   .then( (r) => submitPayment(r) )
+   .catch( (err) => handleError(err) );
+ }
+});// end of PTPayment.validate
+});// end of add event listener submit
+</script>
+
+@endsection
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
new file mode 100644
index 000000000000..e69de29bb2d1
diff --git a/resources/views/vendor/livewire/simple-bootstrap.blade.php b/resources/views/vendor/livewire/simple-bootstrap.blade.php
new file mode 100644
index 000000000000..dbc374434911
--- /dev/null
+++ b/resources/views/vendor/livewire/simple-bootstrap.blade.php
@@ -0,0 +1,29 @@
+<div>
+    @if ($paginator->hasPages())
+        <nav>
+            <ul class="pagination">
+                {{-- Previous Page Link --}}
+                @if ($paginator->onFirstPage())
+                    <li class="page-item disabled" aria-disabled="true">
+                        <span class="page-link">@lang('pagination.previous')</span>
+                    </li>
+                @else
+                    <li class="page-item">
+                        <button type="button" class="page-link" wire:click="previousPage" wire:loading.attr="disabled" rel="prev">@lang('pagination.previous')</button>
+                    </li>
+                @endif
+
+                {{-- Next Page Link --}}
+                @if ($paginator->hasMorePages())
+                    <li class="page-item">
+                        <button type="button" class="page-link" wire:click="nextPage" wire:loading.attr="disabled" rel="next">@lang('pagination.next')</button>
+                    </li>
+                @else
+                    <li class="page-item disabled" aria-disabled="true">
+                        <span class="page-link">@lang('pagination.next')</span>
+                    </li>
+                @endif
+            </ul>
+        </nav>
+    @endif
+</div>

From df7d20fa76d819eaaf88a5765cc504cd4d53b1a6 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 07:53:11 +1000
Subject: [PATCH 02/60] Scaffolding Paytrace

---
 .../gateways/paytrace/authorize.blade.php     | 99 ++-----------------
 1 file changed, 7 insertions(+), 92 deletions(-)

diff --git a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
index 061901fb3dd2..794117356a92 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
@@ -39,103 +39,12 @@
 
   // Minimal Protect.js setup call
   PTPayment.setup({
-   styles:
-  {
-   'code': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'border_style':'dotted',
-    'font_size':'13pt',
-    'input_border_radius':'10px',
-    'input_border_width':'2px',
-    'input_font':'serif, cursive, fantasy',
-    'input_font_weight':'700',
-    'input_margin':'5px 0px 5px 20px',
-    'input_padding':'0px 5px 0px 5px',
-    'label_color':'#5D99CA',
-    'label_size':'16px',
-    'label_width':'150px',
-    'label_font':'sans-serif, arial, serif',
-    'label_font_weight':'bold',
-    'label_margin':'5px 0px 0px 20px',
-    'label_padding':'2px 5px 2px 5px',
-    'label_border_style':'dotted',
-    'label_border_color':'#EF9F6D',
-    'label_border_radius':'10px',
-    'label_border_width':'2px',
-    'background_color':'white',
-    'height':'25px',
-    'width':'110px',
-    'padding_bottom':'2px'
-   },
-   'cc': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'border_style':'solid',
-    'font_size':'13pt',
-    'input_border_radius':'20px',
-    'input_border_width':'2px',
-    'input_font':'Times New Roman, arial, fantasy',
-    'input_font_weight':'400',
-    'input_margin':'5px 0px 5px 0px',
-    'input_padding':'0px 5px 0px 5px',
-    'label_color':'#5D99CA',
-    'label_size':'16px',
-    'label_width':'150px',
-    'label_font':'Times New Roman, sans-serif, serif',
-    'label_font_weight':'light',
-    'label_margin':'5px 0px 0px 0px',
-    'label_padding':'0px 5px 0px 5px',
-    'label_border_style':'solid',
-    'label_border_color':'#EF9F6D',
-    'label_border_radius':'20px',
-    'label_border_width':'2px',
-    'background_color':'white',
-    'height':'25px',
-    'width':'320px',
-    'padding_bottom':'0px'
-   },
-   'exp': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'border_style':'dashed',
-    'font_size':'12pt',
-    'input_border_radius':'0px',
-    'input_border_width':'2px',
-    'input_font':'arial, cursive, fantasy',
-    'input_font_weight':'400',
-    'input_margin':'5px 0px 5px 0px',
-    'input_padding':'0px 5px 0px 5px',
-    'label_color':'#5D99CA',
-    'label_size':'16px',
-    'label_width':'150px',
-    'label_font':'arial, fantasy, serif',
-    'label_font_weight':'normal',
-    'label_margin':'5px 0px 0px 0px',
-    'label_padding':'2px 5px 2px 5px',
-    'label_border_style':'dashed',
-    'label_border_color':'#EF9F6D',
-    'label_border_radius':'0px',
-    'label_border_width':'2px',
-    'background_color':'white',
-    'height':'25px',
-    'width':'85px',
-    'padding_bottom':'2px',
-    'type':'dropdown'
-   },
-   'body': {
-    'background_color':'white'
-   }
-  },    
+  
     authorization: { clientKey: "{!! $client_key !!}" }
   }).then(function(instance){
       //use instance object to process and tokenize sensitive data payment fields.
 PTPayment.theme('above the line');
 
-  });
-
-
-
   // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
 document.getElementById("ProtectForm").addEventListener("submit",function(e){
  e.preventDefault();
@@ -157,6 +66,12 @@ PTPayment.validate(function(validationErrors) {
  }
 });// end of PTPayment.validate
 });// end of add event listener submit
+
+  });
+
+
+
+
 </script>
 
 @endsection

From 75ac7ec48cbc19f612d5f74be6a8773c0d7e291b Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 09:21:32 +1000
Subject: [PATCH 03/60] minor fixes

---
 app/Console/Commands/CreateAccount.php | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/Console/Commands/CreateAccount.php b/app/Console/Commands/CreateAccount.php
index b210981e16ba..b6c51e992858 100644
--- a/app/Console/Commands/CreateAccount.php
+++ b/app/Console/Commands/CreateAccount.php
@@ -91,7 +91,8 @@ class CreateAccount extends Command
         $account = Account::factory()->create();
         $company = Company::factory()->create([
             'account_id' => $account->id,
-            'domain' => config('ninja.app_url'),
+            'portal_domain' => config('ninja.app_url'),
+            'portal_mode' => 'domain',
         ]);
 
         $account->default_company_id = $company->id;

From 0d52d57d411f69a1c6d17e40173face4f0529eb5 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 10:43:39 +1000
Subject: [PATCH 04/60] Paytrace

---
 app/PaymentDrivers/PaytracePaymentDriver.php  |  12 +-
 .../gateways/paytrace/authorize.blade.php     | 128 ++++++++++++++----
 2 files changed, 110 insertions(+), 30 deletions(-)

diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index 94049366d250..8e95e6f4f701 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -115,7 +115,17 @@ class PaytracePaymentDriver extends BaseDriver
         {
             $auth_data = json_decode($response);
 
-            return $auth_data->access_token;
+            $headers = [];
+            $headers[] = 'Content-type: application/json';
+            $headers[] = 'Authorization: Bearer '.$auth_data->access_token;
+
+            $response = CurlUtils::post('https://api.paytrace.com/v1/payment_fields/token/create', [], $headers);
+
+            $response = json_decode($response);
+
+            if($response)
+                return $response->clientKey;
+
         }
 
         return false;
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
index 794117356a92..ac3968e7808a 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
@@ -10,6 +10,7 @@
     @endif
 
     <div class="alert alert-failure mb-4" hidden id="errors"></div>
+    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}" id="ProtectForm">
 
     <div class="w-screen items-center">
 
@@ -17,7 +18,11 @@
 
     </div>
 
-    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}" id="ProtectForm">
+
+            <input type="txt" id=HPF_Token name= HPF_Token hidden>
+            <input type="txt" id=enc_key name = enc_key hidden>
+            <input type="txt" id=amount name = amount value="Amount"><br><br>
+            <input type="submit" value="Submit" id="SubmitButton"/>
 
     <div class="bg-white px-4 py-5 flex justify-end">
         <button
@@ -38,40 +43,105 @@
 <script>
 
   // Minimal Protect.js setup call
-  PTPayment.setup({
-  
-    authorization: { clientKey: "{!! $client_key !!}" }
-  }).then(function(instance){
-      //use instance object to process and tokenize sensitive data payment fields.
-PTPayment.theme('above the line');
-
-  // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
-document.getElementById("ProtectForm").addEventListener("submit",function(e){
- e.preventDefault();
- e.stopPropagation();
-
-// To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
-PTPayment.validate(function(validationErrors) {
- if (validationErrors.length >= 1) {
-  if (validationErrors[0]['responseCode'] == '35') {
-   // Handle validation Errors here
-   // This is an example of using dynamic styling to show the Credit card number entered is invalid
-   PTPayment.style({'cc': {'border_color': 'red'}});
+PTPayment.setup({
+  styles:
+  {
+   'code': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'label_color':'#EF9F6D',
+    'label_size':'20px',
+    'background_color':'white',
+    'border_style':'dotted',
+    'font_size':'15pt',
+    'height':'30px',
+    'width':'100px'
+ },
+   'cc': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'label_color':'#EF9F6D',
+    'label_size':'20px',
+    'background_color':'white',
+    'border_style':'solid',
+    'font_size':'15pt',
+    'height':'30px',
+    'width':'300px'
+ },
+   'exp': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'label_color':'#EF9F6D',
+    'label_size':'20px',
+    'background_color':'white',
+    'border_style':'dashed',
+    'font_size':'15pt',
+    'height':'30px',
+    'width':'85px',
+    'type':'dropdown'
   }
- } else {
-   // no error so tokenize
-   instance.process()
-   .then( (r) => submitPayment(r) )
-   .catch( (err) => handleError(err) );
- }
-});// end of PTPayment.validate
-});// end of add event listener submit
+ },
+  authorization: { 'clientKey': "{!! $client_key !!}" }
+}).then(function(instance){
 
-  });
+
+ PTPayment.getControl("securityCode").label.text("CSC");
+                  PTPayment.getControl("creditCard").label.text("CC#");
+                  PTPayment.getControl("expiration").label.text("Exp Date");
+                  //PTPayment.style({'cc': {'label_color': 'red'}});
+                  //PTPayment.style({'code': {'label_color': 'red'}});
+                  //PTPayment.style({'exp': {'label_color': 'red'}});
+                  //PTPayment.style({'exp':{'type':'dropdown'}});
+
+                  //PTPayment.theme('horizontal');
+                  // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
+                  document.getElementById("ProtectForm").addEventListener("submit",function(e){
+                   e.preventDefault();
+                   e.stopPropagation();
+
+                  // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
+                  PTPayment.validate(function(validationErrors) {
+                   if (validationErrors.length >= 1) {
+                    if (validationErrors[0]['responseCode'] == '35') {
+                     // Handle validation Errors here
+                     // This is an example of using dynamic styling to show the Credit card number entered is invalid
+                     instance.style({'cc': {'border_color': 'red'}});
+                    }
+                   } else {
+                     // no error so tokenize
+                     instance.process()
+                     .then( (r) => {
+                        submitPayment(r);
+                        }, (err) => {
+                        handleError(err);
+                        });
+                   }
+              });
+
+              });
 
 
 
 
+});
+
+
+function handleError(err){
+
+
+  document.write(JSON.stringify(err));
+}
+
+function submitPayment(r){
+
+  var hpf_token = document.getElementById("HPF_Token");
+  var enc_key = document.getElementById("enc_key");
+  hpf_token.value = r.message.hpf_token;
+  enc_key.value = r.message.enc_key;
+  document.getElementById("ProtectForm").submit();
+
+}
+
 </script>
 
 @endsection

From 87e1ba48e94ac1ebede7fe9a338caa3856aad2d5 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 14:23:33 +1000
Subject: [PATCH 05/60] Paytrace integration

---
 .../Payments/PaymentWebhookRequest.php        |  4 +-
 app/PaymentDrivers/PayTrace/CreditCard.php    | 52 +++++++++++-
 app/PaymentDrivers/PaytracePaymentDriver.php  | 32 ++++++--
 .../gateways/paytrace/authorize.blade.php     | 79 +++++++++----------
 4 files changed, 117 insertions(+), 50 deletions(-)

diff --git a/app/Http/Requests/Payments/PaymentWebhookRequest.php b/app/Http/Requests/Payments/PaymentWebhookRequest.php
index ea11d0af2056..50bc276c14ae 100644
--- a/app/Http/Requests/Payments/PaymentWebhookRequest.php
+++ b/app/Http/Requests/Payments/PaymentWebhookRequest.php
@@ -74,9 +74,9 @@ class PaymentWebhookRequest extends Request
     {
         // For testing purposes we'll slow down the webhook processing by 2 seconds
         // to make sure webhook request doesn't came before our processing.
-        if (app()->environment() !== 'production') {
+        //if (app()->environment() !== 'production') {
             sleep(2);
-        }
+        //}
 
         // Some gateways, like Checkout, we can dynamically pass payment hash,
         // which we will resolve here and get payment information from it.
diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index 58937195e553..bc80c3a6a508 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -41,6 +41,7 @@ class CreditCard
     {
         
         $data['client_key'] = $this->paytrace_driver->getAuthToken();
+        $data['gateway'] = $this->paytrace_driver;
 
         return render('gateways.paytrace.authorize', $data);
     }
@@ -49,8 +50,57 @@ class CreditCard
  	public function authorizeResponse($request)
  	{
         $data = $request->all();
+        
+        nlog($data);
 
-        return response()->json([], 200);
+        $post_data = [
+            'customer_id' => Str::random(32),
+            'hpf_token' => $data['HPF_Token'],
+            'enc_key' => $data['enc_key'],
+            'integrator_id' => '959195xd1CuC',
+            'billing_address' => [
+                'name' => $this->paytrace_driver->client->present()->name(),
+                'street_address' => $this->paytrace_driver->client->address1,
+                'city' => $this->paytrace_driver->client->city,
+                'state' => $this->paytrace_driver->client->state,
+                'zip' => $this->paytrace_driver->client->postal_code
+            ],
+        ];
+        
+        nlog($post_data);
+
+        //  "_token" => "Vl1xHflBYQt9YFSaNCPTJKlY5x3rwcFE9kvkw71I"
+        //   "company_gateway_id" => "1"
+        //   "HPF_Token" => "e484a92c-90ed-4468-ac4d-da66824c75de"
+        //   "enc_key" => "zqz6HMHCXALWdX5hyBqrIbSwU7TBZ0FTjjLB3Cp0FQY="
+        //   "amount" => "Amount"
+        //   "q" => "/client/payment_methods"
+        //   "method" => "1"
+        // ]
+
+        // "customer_id":"customer789",
+        // "hpf_token":"e369847e-3027-4174-9161-fa0d4e98d318",
+        // "enc_key":"lI785yOBMet4Rt9o4NLXEyV84WBU3tdStExcsfoaOoo=",
+        // "integrator_id":"xxxxxxxxxx",
+        // "billing_address":{
+        //     "name":"Mark Smith",
+        //     "street_address":"8320 E. West St.",
+        //     "city":"Spokane",
+        //     "state":"WA",
+        //     "zip":"85284"
+        // }
+        $response = $this->paytrace_driver->gatewayRequest('/v1/customer/pt_protect_create', $post_data);
+
+        // dd($response);
+
+  // +"success": true
+  // +"response_code": 160
+  // +"status_message": "The customer profile for PLS5U60OoLUfQXzcmtJYNefPA0gTthzT/11 was successfully created."
+  // +"customer_id": "PLS5U60OoLUfQXzcmtJYNefPA0gTthzT"
+
+
+        // make a cc card out of that bra
+        return redirect()->route('client.payment_methods.index');
 
  	}  
 
diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index 8e95e6f4f701..025ab5d0013f 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -98,8 +98,7 @@ class PaytracePaymentDriver extends BaseDriver
     }
 
     /*Helpers*/
-
-    public function getAuthToken()
+    private function generateAuthHeaders()
     {
 
         $url = 'https://api.paytrace.com/oauth/token';
@@ -111,14 +110,21 @@ class PaytracePaymentDriver extends BaseDriver
 
         $response = CurlUtils::post($url, $data, $headers = false);
 
-        if($response)
-        {
-            $auth_data = json_decode($response);
+        $auth_data = json_decode($response);
 
             $headers = [];
             $headers[] = 'Content-type: application/json';
             $headers[] = 'Authorization: Bearer '.$auth_data->access_token;
 
+        return $headers;
+
+    }
+
+    public function getAuthToken()
+    {
+
+            $headers = $this->generateAuthHeaders();
+
             $response = CurlUtils::post('https://api.paytrace.com/v1/payment_fields/token/create', [], $headers);
 
             $response = json_decode($response);
@@ -126,7 +132,21 @@ class PaytracePaymentDriver extends BaseDriver
             if($response)
                 return $response->clientKey;
 
-        }
+        return false;
+    }
+
+    public function gatewayRequest($uri, $data, $headers = false)
+    {
+        $base_url = "https://api.paytrace.com{$uri}";
+
+        $headers = $this->generateAuthHeaders();
+
+        $response = CurlUtils::post($base_url, json_encode($data), $headers);
+
+        $response = json_decode($response);
+
+        if($response)
+            return $response;
 
         return false;
     }
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
index ac3968e7808a..401a35cdb43f 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
@@ -10,7 +10,8 @@
     @endif
 
     <div class="alert alert-failure mb-4" hidden id="errors"></div>
-    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}" id="ProtectForm">
+    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"  method="post" id="server_response">
+        @csrf
 
     <div class="w-screen items-center">
 
@@ -18,11 +19,9 @@
 
     </div>
 
-
-            <input type="txt" id=HPF_Token name= HPF_Token hidden>
-            <input type="txt" id=enc_key name = enc_key hidden>
-            <input type="txt" id=amount name = amount value="Amount"><br><br>
-            <input type="submit" value="Submit" id="SubmitButton"/>
+    <input type="hidden" name="company_gateway_id" value="{{ $gateway->company_gateway->id }}">
+    <input type="txt" id=HPF_Token name= HPF_Token hidden>
+    <input type="txt" id=enc_key name= enc_key hidden>
 
     <div class="bg-white px-4 py-5 flex justify-end">
         <button
@@ -85,43 +84,40 @@ PTPayment.setup({
 }).then(function(instance){
 
 
- PTPayment.getControl("securityCode").label.text("CSC");
-                  PTPayment.getControl("creditCard").label.text("CC#");
-                  PTPayment.getControl("expiration").label.text("Exp Date");
-                  //PTPayment.style({'cc': {'label_color': 'red'}});
-                  //PTPayment.style({'code': {'label_color': 'red'}});
-                  //PTPayment.style({'exp': {'label_color': 'red'}});
-                  //PTPayment.style({'exp':{'type':'dropdown'}});
-
-                  //PTPayment.theme('horizontal');
-                  // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
-                  document.getElementById("ProtectForm").addEventListener("submit",function(e){
-                   e.preventDefault();
-                   e.stopPropagation();
-
-                  // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
-                  PTPayment.validate(function(validationErrors) {
-                   if (validationErrors.length >= 1) {
-                    if (validationErrors[0]['responseCode'] == '35') {
-                     // Handle validation Errors here
-                     // This is an example of using dynamic styling to show the Credit card number entered is invalid
-                     instance.style({'cc': {'border_color': 'red'}});
-                    }
-                   } else {
-                     // no error so tokenize
-                     instance.process()
-                     .then( (r) => {
-                        submitPayment(r);
-                        }, (err) => {
-                        handleError(err);
-                        });
-                   }
-              });
-
-              });
+    PTPayment.getControl("securityCode").label.text("CSC");
+    PTPayment.getControl("creditCard").label.text("CC#");
+    PTPayment.getControl("expiration").label.text("Exp Date");
+    //PTPayment.style({'cc': {'label_color': 'red'}});
+    //PTPayment.style({'code': {'label_color': 'red'}});
+    //PTPayment.style({'exp': {'label_color': 'red'}});
+    //PTPayment.style({'exp':{'type':'dropdown'}});
 
+    //PTPayment.theme('horizontal');
+    // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
+    document.getElementById("server_response").addEventListener("submit",function(e){
+    e.preventDefault();
+    e.stopPropagation();
 
+    // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
+    PTPayment.validate(function(validationErrors) {
+    if (validationErrors.length >= 1) {
+    if (validationErrors[0]['responseCode'] == '35') {
+     // Handle validation Errors here
+     // This is an example of using dynamic styling to show the Credit card number entered is invalid
+     instance.style({'cc': {'border_color': 'red'}});
+    }
+    } else {
+     // no error so tokenize
+     instance.process()
+     .then( (r) => {
+        submitPayment(r);
+        }, (err) => {
+        handleError(err);
+        });
+    }
+    });
 
+    });
 
 });
 
@@ -138,7 +134,8 @@ function submitPayment(r){
   var enc_key = document.getElementById("enc_key");
   hpf_token.value = r.message.hpf_token;
   enc_key.value = r.message.enc_key;
-  document.getElementById("ProtectForm").submit();
+
+  document.getElementById("server_response").submit();
 
 }
 

From f0b232c1a258b28abd915077b636a79d1caa5def Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 15:34:20 +1000
Subject: [PATCH 06/60] Authorize a card with Paytrace

---
 app/PaymentDrivers/PayTrace/CreditCard.php    | 45 +++++++++++++++----
 app/PaymentDrivers/PaytracePaymentDriver.php  | 12 ++---
 .../gateways/paytrace/authorize.blade.php     | 23 +++++-----
 3 files changed, 56 insertions(+), 24 deletions(-)

diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index bc80c3a6a508..4bea3babc8f9 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -51,8 +51,6 @@ class CreditCard
  	{
         $data = $request->all();
         
-        nlog($data);
-
         $post_data = [
             'customer_id' => Str::random(32),
             'hpf_token' => $data['HPF_Token'],
@@ -67,8 +65,6 @@ class CreditCard
             ],
         ];
         
-        nlog($post_data);
-
         //  "_token" => "Vl1xHflBYQt9YFSaNCPTJKlY5x3rwcFE9kvkw71I"
         //   "company_gateway_id" => "1"
         //   "HPF_Token" => "e484a92c-90ed-4468-ac4d-da66824c75de"
@@ -93,10 +89,30 @@ class CreditCard
 
         // dd($response);
 
-  // +"success": true
-  // +"response_code": 160
-  // +"status_message": "The customer profile for PLS5U60OoLUfQXzcmtJYNefPA0gTthzT/11 was successfully created."
-  // +"customer_id": "PLS5U60OoLUfQXzcmtJYNefPA0gTthzT"
+          // +"success": true
+          // +"response_code": 160
+          // +"status_message": "The customer profile for PLS5U60OoLUfQXzcmtJYNefPA0gTthzT/11 was successfully created."
+          // +"customer_id": "PLS5U60OoLUfQXzcmtJYNefPA0gTthzT"
+
+        // if(!$response->success)
+            //handle failure
+            
+        $cgt = [];
+        $cgt['token'] = $response->customer_id;
+        $cgt['payment_method_id'] = GatewayType::CREDIT_CARD;
+
+        $profile = $this->getCustomerProfile($response->customer_id);
+
+        $payment_meta = new \stdClass;
+        $payment_meta->exp_month = $profile->credit_card->expiration_month;
+        $payment_meta->exp_year = $profile->credit_card->expiration_year;
+        $payment_meta->brand = 'CC';
+        $payment_meta->last4 = $profile->credit_card->masked_number;
+        $payment_meta->type = GatewayType::CREDIT_CARD;
+
+        $cgt['payment_meta'] = $payment_meta;
+
+        $token = $this->paytrace_driver->storeGatewayToken($cgt, []);
 
 
         // make a cc card out of that bra
@@ -104,6 +120,19 @@ class CreditCard
 
  	}  
 
+
+    private function getCustomerProfile($customer_id)
+    {
+        $profile = $this->paytrace_driver->gatewayRequest('/v1/customer/export', [
+            'integrator_id' => '959195xd1CuC',
+            'customer_id' => $customer_id,
+            // 'include_bin' => true,
+        ]);
+
+        return $profile->customers[0];
+        
+    }
+
     public function paymentView($data)
     {
 
diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index 025ab5d0013f..ccb2a3d9688e 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -123,20 +123,21 @@ class PaytracePaymentDriver extends BaseDriver
     public function getAuthToken()
     {
 
-            $headers = $this->generateAuthHeaders();
+        $headers = $this->generateAuthHeaders();
 
-            $response = CurlUtils::post('https://api.paytrace.com/v1/payment_fields/token/create', [], $headers);
+        $response = CurlUtils::post('https://api.paytrace.com/v1/payment_fields/token/create', [], $headers);
 
-            $response = json_decode($response);
+        $response = json_decode($response);
 
-            if($response)
-                return $response->clientKey;
+        if($response)
+            return $response->clientKey;
 
         return false;
     }
 
     public function gatewayRequest($uri, $data, $headers = false)
     {
+        
         $base_url = "https://api.paytrace.com{$uri}";
 
         $headers = $this->generateAuthHeaders();
@@ -149,5 +150,6 @@ class PaytracePaymentDriver extends BaseDriver
             return $response;
 
         return false;
+
     }
 }
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
index 401a35cdb43f..2d8ce5482e6b 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
@@ -84,9 +84,9 @@ PTPayment.setup({
 }).then(function(instance){
 
 
-    PTPayment.getControl("securityCode").label.text("CSC");
-    PTPayment.getControl("creditCard").label.text("CC#");
-    PTPayment.getControl("expiration").label.text("Exp Date");
+    PTPayment.getControl("securityCode").label.text("{!! ctrans('texts.cvv')!!}");
+    PTPayment.getControl("creditCard").label.text("{!! ctrans('texts.card_number')!!}");
+    PTPayment.getControl("expiration").label.text("{!! ctrans('texts.expires')!!}");
     //PTPayment.style({'cc': {'label_color': 'red'}});
     //PTPayment.style({'code': {'label_color': 'red'}});
     //PTPayment.style({'exp': {'label_color': 'red'}});
@@ -100,12 +100,15 @@ PTPayment.setup({
 
     // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
     PTPayment.validate(function(validationErrors) {
+
     if (validationErrors.length >= 1) {
-    if (validationErrors[0]['responseCode'] == '35') {
-     // Handle validation Errors here
-     // This is an example of using dynamic styling to show the Credit card number entered is invalid
-     instance.style({'cc': {'border_color': 'red'}});
-    }
+
+        let errors = document.getElementById('errors');
+
+        errors.textContent = '';
+        errors.textContent = validationErrors[0].description;
+        errors.hidden = false;
+
     } else {
      // no error so tokenize
      instance.process()
@@ -123,9 +126,7 @@ PTPayment.setup({
 
 
 function handleError(err){
-
-
-  document.write(JSON.stringify(err));
+    document.write(JSON.stringify(err));
 }
 
 function submitPayment(r){

From 15dd0970d2d9c79bd05ec645af65b23d5130dbfc Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 16:27:02 +1000
Subject: [PATCH 07/60] Paytrace

---
 app/PaymentDrivers/PayTrace/CreditCard.php    |  41 +++-
 .../ninja2020/gateways/paytrace/pay.blade.php | 208 ++++++++++++++++++
 2 files changed, 248 insertions(+), 1 deletion(-)

diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index 4bea3babc8f9..6e97b1baa11f 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -23,12 +23,14 @@ use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\PayFastPaymentDriver;
 use App\PaymentDrivers\PaytracePaymentDriver;
+use App\Utils\Traits\MakesHash;
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Cache;
 use Illuminate\Support\Str;
 
 class CreditCard
 {
+    use MakesHash;
 
     public $paytrace_driver;
 
@@ -135,7 +137,14 @@ class CreditCard
 
     public function paymentView($data)
     {
+        $data['client_key'] = $this->paytrace_driver->getAuthToken();
+        $data['gateway'] = $this->paytrace_driver;
 
+        //do i store the card?
+        //
+        //do i use a token?
+        //
+        //is it a new card?
 
         return render('gateways.paytrace.pay', $data);
 
@@ -146,7 +155,16 @@ class CreditCard
     {
         $response_array = $request->all();
 
+        if($request->token)
+            $this->processTokenPayment($request);
 
+        if ($request->has('store_card') && $request->input('store_card') === true) {
+
+            //create customer
+            
+        }
+
+        // charge CC
 
         // if($response_array['payment_status'] == 'COMPLETE') {
 
@@ -159,12 +177,33 @@ class CreditCard
         // }
     }
 
+
+    public function processTokenPayment($request)
+    {
+
+        $data = [
+            'customer_id' => $request->token,
+            'integrator_id' => '959195xd1CuC',
+            'amount' => $request->input('amount_with_fee'),
+        ];
+
+        $response = $this->paytrace_driver->gatewayRequest('/v1/transactions/sale/by_customer', $data);
+
+        if($response->success){
+            $this->paytrace_driver->logSuccessfulGatewayResponse(['response' => $response, 'data' => $this->paytrace_driver->payment_hash], SystemLog::TYPE_PAYTRACE);
+
+            return $this->processSuccessfulPayment($response);
+        }
+
+        return $this->processUnsuccessfulPayment($response);
+    }
+
     private function processSuccessfulPayment($response_array)
     {
 
 
 
-        // $payment = $this->paytrace_driver->createPayment($payment_record, Payment::STATUS_COMPLETED);
+        $payment = $this->paytrace_driver->createPayment($payment_record, Payment::STATUS_COMPLETED);
 
 
     }
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
index e69de29bb2d1..5217115ad0e5 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
@@ -0,0 +1,208 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.payment_type_credit_card'), 'card_title' => ctrans('texts.payment_type_credit_card')])
+
+@section('gateway_head')
+
+@endsection
+
+@section('gateway_content')
+    <form action="{{ route('client.payments.response') }}" method="post" id="server_response">
+        @csrf
+        <input type="hidden" name="payment_hash" value="{{ $payment_hash }}">
+        <input type="hidden" name="company_gateway_id" value="{{ $gateway->company_gateway->id }}">
+        <input type="hidden" name="payment_method_id" value="1">
+        <input type="hidden" name="token" id="token"/>
+        <input type="hidden" name="store_card" id="store_card"/>
+        <input type="hidden" name="amount_with_fee" id="amount_with_fee" value="{{ $total['amount_with_fee'] }}"/>
+        <input type="txt" id=HPF_Token name= HPF_Token hidden>
+        <input type="txt" id=enc_key name= enc_key hidden>
+    </form>
+
+    <div class="alert alert-failure mb-4" hidden id="errors"></div>
+
+    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.payment_type')])
+        {{ ctrans('texts.credit_card') }}
+    @endcomponent
+
+    @include('portal.ninja2020.gateways.includes.payment_details')
+
+    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.pay_with')])
+        @if(count($tokens) > 0)
+            @foreach($tokens as $token)
+                <label class="mr-4">
+                    <input
+                        type="radio"
+                        data-token="{{ $token->hashed_id }}"
+                        name="payment-type"
+                        class="form-radio cursor-pointer toggle-payment-with-token"/>
+                    <span class="ml-1 cursor-pointer">{{ optional($token->meta)->last4 }}</span>
+                </label>
+            @endforeach
+        @endisset
+
+        <label>
+            <input
+                type="radio"
+                id="toggle-payment-with-credit-card"
+                class="form-radio cursor-pointer"
+                name="payment-type"
+                checked/>
+            <span class="ml-1 cursor-pointer">{{ __('texts.new_card') }}</span>
+        </label>
+    @endcomponent
+
+    @include('portal.ninja2020.gateways.includes.save_card')
+
+
+    <div class="w-screen items-center" id="paytrace--credit-card-container">
+
+        <div id='pt_hpf_form'><!--iframe sensitive data payment fields inserted here--></div>
+
+    </div>
+    @include('portal.ninja2020.gateways.includes.pay_now')
+
+@endsection
+
+@section('gateway_footer')
+
+<script src='https://protect.paytrace.com/js/protect.min.js'></script>
+
+<script>
+
+    let token_payment = true;
+
+    Array
+    .from(document.getElementsByClassName('toggle-payment-with-token'))
+    .forEach((element) => element.addEventListener('click', (e) => {
+        document
+            .getElementById('save-card--container').style.display = 'none';
+        document
+            .getElementById('paytrace--credit-card-container').style.display = 'none';
+
+        document
+            .getElementById('token').value = e.target.dataset.token;
+    }));
+
+    var tokens = document.getElementsByClassName('toggle-payment-with-token');
+    tokens[0].click();
+
+    let payWithCreditCardToggle = document.getElementById('toggle-payment-with-credit-card');
+
+    if (payWithCreditCardToggle) {
+        payWithCreditCardToggle
+            .addEventListener('click', () => {
+                document
+                    .getElementById('save-card--container').style.display = 'grid';
+                document
+                    .getElementById('paytrace--credit-card-container').style.display = 'grid';
+
+                document
+                    .getElementById('token').value = null;
+
+                    token_payment = false;
+            });
+    }
+
+
+
+  // Minimal Protect.js setup call
+PTPayment.setup({
+  styles:
+  {
+   'code': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'label_color':'#EF9F6D',
+    'label_size':'20px',
+    'background_color':'white',
+    'border_style':'dotted',
+    'font_size':'15pt',
+    'height':'30px',
+    'width':'100px'
+ },
+   'cc': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'label_color':'#EF9F6D',
+    'label_size':'20px',
+    'background_color':'white',
+    'border_style':'solid',
+    'font_size':'15pt',
+    'height':'30px',
+    'width':'300px'
+ },
+   'exp': {
+    'font_color':'#5D99CA',
+    'border_color':'#EF9F6D',
+    'label_color':'#EF9F6D',
+    'label_size':'20px',
+    'background_color':'white',
+    'border_style':'dashed',
+    'font_size':'15pt',
+    'height':'30px',
+    'width':'85px',
+    'type':'dropdown'
+  }
+ },
+  authorization: { 'clientKey': "{!! $client_key !!}" }
+}).then(function(instance){
+
+
+    PTPayment.getControl("securityCode").label.text("{!! ctrans('texts.cvv')!!}");
+    PTPayment.getControl("creditCard").label.text("{!! ctrans('texts.card_number')!!}");
+    PTPayment.getControl("expiration").label.text("{!! ctrans('texts.expires')!!}");
+    //PTPayment.style({'cc': {'label_color': 'red'}});
+    //PTPayment.style({'code': {'label_color': 'red'}});
+    //PTPayment.style({'exp': {'label_color': 'red'}});
+    //PTPayment.style({'exp':{'type':'dropdown'}});
+
+    //PTPayment.theme('horizontal');
+    // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
+    document.getElementById("server_response").addEventListener("submit",function(e){
+    e.preventDefault();
+    e.stopPropagation();
+
+    // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
+    PTPayment.validate(function(validationErrors) {
+
+    if (validationErrors.length >= 1 && token_payment == false) {
+
+        let errors = document.getElementById('errors');
+
+        errors.textContent = '';
+        errors.textContent = validationErrors[0].description;
+        errors.hidden = false;
+
+    } else {
+     // no error so tokenize
+     instance.process()
+     .then( (r) => {
+        submitPayment(r);
+        }, (err) => {
+        handleError(err);
+        });
+    }
+    });
+
+    });
+
+});
+
+
+function handleError(err){
+    console.log(err);
+    document.write(JSON.stringify(err));
+}
+
+function submitPayment(r){
+
+  var hpf_token = document.getElementById("HPF_Token");
+  var enc_key = document.getElementById("enc_key");
+  hpf_token.value = r.message.hpf_token;
+  enc_key.value = r.message.enc_key;
+
+  document.getElementById("server_response").submit();
+
+}
+
+</script>
+@endsection

From 211e6560fc8842aeab218e3aaa0ca48580f304c9 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 17:04:44 +1000
Subject: [PATCH 08/60] Paytrace payment proces

---
 app/PaymentDrivers/BaseDriver.php          |  53 +++++++
 app/PaymentDrivers/PayTrace/CreditCard.php | 170 ++++++++++-----------
 2 files changed, 138 insertions(+), 85 deletions(-)

diff --git a/app/PaymentDrivers/BaseDriver.php b/app/PaymentDrivers/BaseDriver.php
index ef59a3d0d82c..009fa10c37d3 100644
--- a/app/PaymentDrivers/BaseDriver.php
+++ b/app/PaymentDrivers/BaseDriver.php
@@ -431,6 +431,59 @@ class BaseDriver extends AbstractPaymentDriver
         return false;
     }
 
+    /*Generic Global unsuccessful transaction method*/
+    public function processUnsuccessfulTransaction($response)
+    {
+        $error = $response['error'];
+        $error_code = $response['error_code'];
+
+        $this->unWindGatewayFees($this->payment_hash);
+
+        PaymentFailureMailer::dispatch($this->client, $error, $this->client->company, $this->payment_hash->data->amount_with_fee);
+
+        $nmo = new NinjaMailerObject;
+        $nmo->mailable = new NinjaMailer( (new ClientPaymentFailureObject($this->client, $error, $this->client->company, $this->payment_hash))->build() );
+        $nmo->company = $this->client->company;
+        $nmo->settings = $this->client->company->settings;
+
+        $invoices = Invoice::whereIn('id', $this->transformKeys(array_column($this->payment_hash->invoices(), 'invoice_id')))->withTrashed()->get();
+
+        $invoices->each(function ($invoice){
+
+            $invoice->service()->deletePdf();
+
+        });
+
+        $invoices->first()->invitations->each(function ($invitation) use ($nmo){
+
+            if ($invitation->contact->send_email && $invitation->contact->email) {
+
+                $nmo->to_user = $invitation->contact;
+                NinjaMailerJob::dispatch($nmo);
+
+            }
+
+        });
+
+        $message = [
+            'server_response' => $response,
+            'data' => $this->payment_hash->data,
+        ];
+
+        SystemLogger::dispatch(
+            $message,
+            SystemLog::CATEGORY_GATEWAY_RESPONSE,
+            SystemLog::EVENT_GATEWAY_FAILURE,
+            $this::SYSTEM_LOG_TYPE,
+            $this->client,
+            $this->client->company,
+        );
+
+        throw new PaymentFailed($error, $error_code);
+    }
+
+
+
     public function checkRequirements()
     {
         if ($this->company_gateway->require_billing_address) {
diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index 6e97b1baa11f..a2595952d35b 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -48,57 +48,57 @@ class CreditCard
         return render('gateways.paytrace.authorize', $data);
     }
 
+    // +"success": true
+    // +"response_code": 160
+    // +"status_message": "The customer profile for PLS5U60OoLUfQXzcmtJYNefPA0gTthzT/11 was successfully created."
+    // +"customer_id": "PLS5U60OoLUfQXzcmtJYNefPA0gTthzT"
 
+    //if(!$response->success)
+    //handle failure
+        
  	public function authorizeResponse($request)
  	{
         $data = $request->all();
         
+        $response = $this->createCustomer($data);   
+
+        return redirect()->route('client.payment_methods.index');
+
+ 	}  
+    
+    //  "_token" => "Vl1xHflBYQt9YFSaNCPTJKlY5x3rwcFE9kvkw71I"
+    //   "company_gateway_id" => "1"
+    //   "HPF_Token" => "e484a92c-90ed-4468-ac4d-da66824c75de"
+    //   "enc_key" => "zqz6HMHCXALWdX5hyBqrIbSwU7TBZ0FTjjLB3Cp0FQY="
+    //   "amount" => "Amount"
+    //   "q" => "/client/payment_methods"
+    //   "method" => "1"
+    // ]
+
+    // "customer_id":"customer789",
+    // "hpf_token":"e369847e-3027-4174-9161-fa0d4e98d318",
+    // "enc_key":"lI785yOBMet4Rt9o4NLXEyV84WBU3tdStExcsfoaOoo=",
+    // "integrator_id":"xxxxxxxxxx",
+    // "billing_address":{
+    //     "name":"Mark Smith",
+    //     "street_address":"8320 E. West St.",
+    //     "city":"Spokane",
+    //     "state":"WA",
+    //     "zip":"85284"
+    // }
+    
+    private function createCustomer($data)
+    {
         $post_data = [
             'customer_id' => Str::random(32),
             'hpf_token' => $data['HPF_Token'],
             'enc_key' => $data['enc_key'],
             'integrator_id' => '959195xd1CuC',
-            'billing_address' => [
-                'name' => $this->paytrace_driver->client->present()->name(),
-                'street_address' => $this->paytrace_driver->client->address1,
-                'city' => $this->paytrace_driver->client->city,
-                'state' => $this->paytrace_driver->client->state,
-                'zip' => $this->paytrace_driver->client->postal_code
-            ],
+            'billing_address' => $this->buildBillingAddress(),
         ];
-        
-        //  "_token" => "Vl1xHflBYQt9YFSaNCPTJKlY5x3rwcFE9kvkw71I"
-        //   "company_gateway_id" => "1"
-        //   "HPF_Token" => "e484a92c-90ed-4468-ac4d-da66824c75de"
-        //   "enc_key" => "zqz6HMHCXALWdX5hyBqrIbSwU7TBZ0FTjjLB3Cp0FQY="
-        //   "amount" => "Amount"
-        //   "q" => "/client/payment_methods"
-        //   "method" => "1"
-        // ]
 
-        // "customer_id":"customer789",
-        // "hpf_token":"e369847e-3027-4174-9161-fa0d4e98d318",
-        // "enc_key":"lI785yOBMet4Rt9o4NLXEyV84WBU3tdStExcsfoaOoo=",
-        // "integrator_id":"xxxxxxxxxx",
-        // "billing_address":{
-        //     "name":"Mark Smith",
-        //     "street_address":"8320 E. West St.",
-        //     "city":"Spokane",
-        //     "state":"WA",
-        //     "zip":"85284"
-        // }
         $response = $this->paytrace_driver->gatewayRequest('/v1/customer/pt_protect_create', $post_data);
 
-        // dd($response);
-
-          // +"success": true
-          // +"response_code": 160
-          // +"status_message": "The customer profile for PLS5U60OoLUfQXzcmtJYNefPA0gTthzT/11 was successfully created."
-          // +"customer_id": "PLS5U60OoLUfQXzcmtJYNefPA0gTthzT"
-
-        // if(!$response->success)
-            //handle failure
-            
         $cgt = [];
         $cgt['token'] = $response->customer_id;
         $cgt['payment_method_id'] = GatewayType::CREDIT_CARD;
@@ -116,12 +116,8 @@ class CreditCard
 
         $token = $this->paytrace_driver->storeGatewayToken($cgt, []);
 
-
-        // make a cc card out of that bra
-        return redirect()->route('client.payment_methods.index');
-
- 	}  
-
+        return $response;
+    }
 
     private function getCustomerProfile($customer_id)
     {
@@ -135,50 +131,59 @@ class CreditCard
         
     }
 
+    private function buildBillingAddress()
+    {
+        return [
+                'name' => $this->paytrace_driver->client->present()->name(),
+                'street_address' => $this->paytrace_driver->client->address1,
+                'city' => $this->paytrace_driver->client->city,
+                'state' => $this->paytrace_driver->client->state,
+                'zip' => $this->paytrace_driver->client->postal_code
+            ];
+    }
+
     public function paymentView($data)
     {
+
         $data['client_key'] = $this->paytrace_driver->getAuthToken();
         $data['gateway'] = $this->paytrace_driver;
 
-        //do i store the card?
-        //
-        //do i use a token?
-        //
-        //is it a new card?
-
         return render('gateways.paytrace.pay', $data);
 
     }
 
-
     public function paymentResponse(Request $request)
     {
         $response_array = $request->all();
 
         if($request->token)
-            $this->processTokenPayment($request);
+            $this->processTokenPayment($request->token, $request);
 
         if ($request->has('store_card') && $request->input('store_card') === true) {
 
-            //create customer
+            $response = $this->createCustomer($request->all());
             
+            $this->processTokenPayment($response->customer_id, $request);
         }
 
-        // charge CC
+        //process a regular charge here:
+        $data = [
+            'hpf_token' => $data['HPF_Token'],
+            'enc_key' => $data['enc_key'],
+            'integrator_id' => '959195xd1CuC',
+            'billing_address' => $this->buildBillingAddress(),
+        ];        
 
-        // if($response_array['payment_status'] == 'COMPLETE') {
+        $response = $this->paytrace_driver->gatewayRequest('/v1/transactions/sale/pt_protect', $data);
 
-        //     $this->payfast->logSuccessfulGatewayResponse(['response' => $response_array, 'data' => $this->paytrace_driver->payment_hash], SystemLog::TYPE_PAYFAST);
+        if($response->success)
+            return $this->processSuccessfulPayment($response);
+
+        return $this->processUnsuccessfulPayment($response);
 
-        //     return $this->processSuccessfulPayment($response_array);
-        // }
-        // else {
-        //     $this->processUnsuccessfulPayment($response_array);
-        // }
     }
 
-
-    public function processTokenPayment($request)
+    public function processTokenPayment($token, $request)
     {
 
         $data = [
@@ -198,42 +203,37 @@ class CreditCard
         return $this->processUnsuccessfulPayment($response);
     }
 
-    private function processSuccessfulPayment($response_array)
+    private function processSuccessfulPayment($response)
     {
+        $amount = array_sum(array_column($this->paytrace_driver->payment_hash->invoices(), 'amount')) + $this->paytrace_driver->payment_hash->fee_total;
 
+        $response = $response_array;
 
+        $payment_record = [];
+        $payment_record['amount'] = $amount;
+        $payment_record['payment_type'] = PaymentType::CREDIT_CARD_OTHER;
+        $payment_record['gateway_type_id'] = GatewayType::CREDIT_CARD;
+        $payment_record['transaction_reference'] = $response->transaction_id;
 
         $payment = $this->paytrace_driver->createPayment($payment_record, Payment::STATUS_COMPLETED);
 
+        return redirect()->route('client.payments.show', ['payment' => $this->encodePrimaryKey($payment->id)]);
 
     }
 
-    private function processUnsuccessfulPayment($server_response)
+    private function processUnsuccessfulPayment($response)
     {
-        // PaymentFailureMailer::dispatch($this->paytrace_driver->client, $server_response->cancellation_reason, $this->paytrace_driver->client->company, $server_response->amount);
 
-        // PaymentFailureMailer::dispatch(
-        //     $this->paytrace_driver->client,
-        //     $server_response,
-        //     $this->paytrace_driver->client->company,
-        //     $server_response['amount_gross']
-        // );
+        $error = $response->status_message;
+        $error_code = property_exists($response, 'approval_message') ? $response->approval_message : 'Undefined code';
 
-        // $message = [
-        //     'server_response' => $server_response,
-        //     'data' => $this->paytrace_driver->payment_hash->data,
-        // ];
+        $data = [
+            'response' => $response,
+            'error' => $error,
+            'error_code' => $error_code,
+        ];
 
-        // SystemLogger::dispatch(
-        //     $message,
-        //     SystemLog::CATEGORY_GATEWAY_RESPONSE,
-        //     SystemLog::EVENT_GATEWAY_FAILURE,
-        //     SystemLog::TYPE_PAYFAST,
-        //     $this->payfast->client,
-        //     $this->payfast->client->company,
-        // );
-
-        // throw new PaymentFailed('Failed to process the payment.', 500);
+        return $this->paytrace_driver->processUnsuccessfulTransaction($data);
     }
 
 }
\ No newline at end of file

From 1affdd77542e915150a9b9f648a5dafe1ac96cd4 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 17:44:35 +1000
Subject: [PATCH 09/60] Pay with CC paytrace

---
 app/PaymentDrivers/BaseDriver.php             |  2 +-
 app/PaymentDrivers/PayTrace/CreditCard.php    | 27 +++++++++++++++----
 .../ninja2020/gateways/paytrace/pay.blade.php | 14 ++++------
 3 files changed, 28 insertions(+), 15 deletions(-)

diff --git a/app/PaymentDrivers/BaseDriver.php b/app/PaymentDrivers/BaseDriver.php
index 009fa10c37d3..57613fcb8872 100644
--- a/app/PaymentDrivers/BaseDriver.php
+++ b/app/PaymentDrivers/BaseDriver.php
@@ -479,7 +479,7 @@ class BaseDriver extends AbstractPaymentDriver
             $this->client->company,
         );
 
-        throw new PaymentFailed($error, $error_code);
+        throw new PaymentFailed($error, 500);
     }
 
 
diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index a2595952d35b..adde39177b15 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -17,6 +17,7 @@ use App\Jobs\Mail\PaymentFailureMailer;
 use App\Jobs\Util\SystemLogger;
 use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
+use App\Models\Invoice;
 use App\Models\Payment;
 use App\Models\PaymentHash;
 use App\Models\PaymentType;
@@ -168,10 +169,12 @@ class CreditCard
 
         //process a regular charge here:
         $data = [
-            'hpf_token' => $data['HPF_Token'],
-            'enc_key' => $data['enc_key'],
+            'hpf_token' => $response_array['HPF_Token'],
+            'enc_key' => $response_array['enc_key'],
             'integrator_id' => '959195xd1CuC',
             'billing_address' => $this->buildBillingAddress(),
+            'amount' => $request->input('amount_with_fee'),
+            'invoice_id' => $this->harvestInvoiceId(),
         ];        
 
         $response = $this->paytrace_driver->gatewayRequest('/v1/transactions/sale/pt_protect', $data);
@@ -202,13 +205,22 @@ class CreditCard
 
         return $this->processUnsuccessfulPayment($response);
     }
+    
+    private function harvestInvoiceId()
+    {
+        $_invoice = collect($this->paytrace_driver->payment_hash->data->invoices)->first();
+        $invoice = Invoice::withTrashed()->find($this->decodePrimaryKey($_invoice->invoice_id));
+
+        if($invoice)
+            return ctrans('texts.invoice_number') . "# " . $invoice->number;
+
+        return ctrans('texts.invoice_number') . "####";
+    }
 
     private function processSuccessfulPayment($response)
     {
         $amount = array_sum(array_column($this->paytrace_driver->payment_hash->invoices(), 'amount')) + $this->paytrace_driver->payment_hash->fee_total;
 
-        $response = $response_array;
-
         $payment_record = [];
         $payment_record['amount'] = $amount;
         $payment_record['payment_type'] = PaymentType::CREDIT_CARD_OTHER;
@@ -223,8 +235,12 @@ class CreditCard
 
     private function processUnsuccessfulPayment($response)
     {
-
+        
         $error = $response->status_message;
+
+        if(property_exists($response, 'approval_message') && $response->approval_message)
+            $error .= " - {$response->approval_message}";
+
         $error_code = property_exists($response, 'approval_message') ? $response->approval_message : 'Undefined code';
 
         $data = [
@@ -234,6 +250,7 @@ class CreditCard
         ];
 
         return $this->paytrace_driver->processUnsuccessfulTransaction($data);
+
     }
 
 }
\ No newline at end of file
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
index 5217115ad0e5..aa9eb9162e29 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
@@ -15,7 +15,7 @@
         <input type="hidden" name="amount_with_fee" id="amount_with_fee" value="{{ $total['amount_with_fee'] }}"/>
         <input type="txt" id=HPF_Token name= HPF_Token hidden>
         <input type="txt" id=enc_key name= enc_key hidden>
-    </form>
+
 
     <div class="alert alert-failure mb-4" hidden id="errors"></div>
 
@@ -52,14 +52,13 @@
 
     @include('portal.ninja2020.gateways.includes.save_card')
 
-
     <div class="w-screen items-center" id="paytrace--credit-card-container">
 
         <div id='pt_hpf_form'><!--iframe sensitive data payment fields inserted here--></div>
 
     </div>
-    @include('portal.ninja2020.gateways.includes.pay_now')
-
+    @include('portal.ninja2020.gateways.includes.pay_now', ['type' => 'submit'])
+    </form>
 @endsection
 
 @section('gateway_footer')
@@ -82,9 +81,6 @@
             .getElementById('token').value = e.target.dataset.token;
     }));
 
-    var tokens = document.getElementsByClassName('toggle-payment-with-token');
-    tokens[0].click();
-
     let payWithCreditCardToggle = document.getElementById('toggle-payment-with-credit-card');
 
     if (payWithCreditCardToggle) {
@@ -97,12 +93,12 @@
 
                 document
                     .getElementById('token').value = null;
-
                     token_payment = false;
             });
     }
 
-
+    var tokens = document.getElementsByClassName('toggle-payment-with-token');
+    tokens[0].click();
 
   // Minimal Protect.js setup call
 PTPayment.setup({

From 78270a9147116e4f1aa233b3a23b2fabc5dd23ce Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 18:18:14 +1000
Subject: [PATCH 10/60] token billing and refunds with paytrace

---
 app/PaymentDrivers/BaseDriver.php             |  8 +-
 app/PaymentDrivers/PaytracePaymentDriver.php  | 83 ++++++++++++++++++-
 app/PaymentDrivers/Stripe/Charge.php          |  2 +-
 ...95537_activate_paytrace_payment_driver.php | 14 +++-
 database/seeders/PaymentLibrariesSeeder.php   |  2 +-
 5 files changed, 101 insertions(+), 8 deletions(-)

diff --git a/app/PaymentDrivers/BaseDriver.php b/app/PaymentDrivers/BaseDriver.php
index 57613fcb8872..2ad64c1ae8c3 100644
--- a/app/PaymentDrivers/BaseDriver.php
+++ b/app/PaymentDrivers/BaseDriver.php
@@ -431,8 +431,8 @@ class BaseDriver extends AbstractPaymentDriver
         return false;
     }
 
-    /*Generic Global unsuccessful transaction method*/
-    public function processUnsuccessfulTransaction($response)
+    /*Generic Global unsuccessful transaction method when the client is present*/
+    public function processUnsuccessfulTransaction($response, $client_present = true)
     {
         $error = $response['error'];
         $error_code = $response['error_code'];
@@ -479,7 +479,9 @@ class BaseDriver extends AbstractPaymentDriver
             $this->client->company,
         );
 
-        throw new PaymentFailed($error, 500);
+        if($client_present)
+            throw new PaymentFailed($error, 500);
+
     }
 
 
diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index ccb2a3d9688e..ca865da581cf 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -15,6 +15,7 @@ use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
 use App\Models\Payment;
 use App\Models\PaymentHash;
+use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\PayTrace\CreditCard;
 use App\Utils\CurlUtils;
@@ -85,12 +86,90 @@ class PaytracePaymentDriver extends BaseDriver
 
     public function refund(Payment $payment, $amount, $return_client_response = false)
     {
-        return $this->payment_method->yourRefundImplementationHere(); //this is your custom implementation from here
+        $cgt = ClientGatewayToken::where('company_gateway_id', $payment->company_gateway_id)
+                                 ->where('gateway_type_id', $payment->gateway_type_id)
+                                 ->first();
+
+        $data = [
+            'amount' => $amount,
+            'customer_id' => $cgt->token,
+            'integrator_id' => '959195xd1CuC'
+        ];
+
+        $response = $this->gatewayRequest('/v1/transactions/refund/to_customer', $data);
+
+
+        if($response && $response->success)
+        {
+
+            SystemLogger::dispatch(['server_response' => $response, 'data' => $data], SystemLog::CATEGORY_GATEWAY_RESPONSE, SystemLog::EVENT_GATEWAY_SUCCESS, SystemLog::TYPE_PAYTRACE, $this->client, $this->client->company);
+
+                return [
+                    'transaction_reference' => $response->transaction_id,
+                    'transaction_response' => json_encode($response),
+                    'success' => true,
+                    'description' => $response->status_message,
+                    'code' => $response->response_code,
+                ];
+
+        }
+
+
+        SystemLogger::dispatch(['server_response' => $response, 'data' => $data], SystemLog::CATEGORY_GATEWAY_RESPONSE, SystemLog::EVENT_GATEWAY_FAILURE, SystemLog::TYPE_PAYTRACE, $this->client, $this->client->company);
+
+        return [
+            'transaction_reference' => null,
+            'transaction_response' => json_encode($response),
+            'success' => false,
+            'description' => $response->status_message,
+            'code' => 422,
+        ];
+
     }
 
     public function tokenBilling(ClientGatewayToken $cgt, PaymentHash $payment_hash)
     {
-        return $this->payment_method->yourTokenBillingImplmentation(); //this is your custom implementation from here
+        $amount = array_sum(array_column($payment_hash->invoices(), 'amount')) + $payment_hash->fee_total;
+
+        $data = [
+            'customer_id' => $cgt->token,
+            'integrator_id' => '959195xd1CuC',
+            'amount' => $amount,
+        ];
+
+        $response = $this->gatewayRequest('/v1/transactions/sale/by_customer', $data);
+
+        if($response && $response->success)
+        {
+            $data = [
+                'gateway_type_id' => $cgt->gateway_type_id,
+                'payment_type' => PaymentType::CREDIT_CARD_OTHER,
+                'transaction_reference' => $response->transaction_id,
+                'amount' => $amount,
+            ];
+
+            $payment = $this->createPayment($data);
+            $payment->meta = $cgt->meta;
+            $payment->save();
+
+            $payment_hash->payment_id = $payment->id;
+            $payment_hash->save();
+
+            return $payment;
+        }
+
+        $error = $response->status_message;
+
+        if(property_exists($response, 'approval_message') && $response->approval_message)
+            $error .= " - {$response->approval_message}";
+
+        $data = [
+            'response' => $response,
+            'error' => $error,
+            'error_code' => 500,
+        ];
+
+        $this->processUnsuccessfulTransaction($data, false);
     }
 
     public function processWebhookRequest(PaymentWebhookRequest $request, Payment $payment = null)
diff --git a/app/PaymentDrivers/Stripe/Charge.php b/app/PaymentDrivers/Stripe/Charge.php
index 2e8c06d7d1bc..2ae298a335e2 100644
--- a/app/PaymentDrivers/Stripe/Charge.php
+++ b/app/PaymentDrivers/Stripe/Charge.php
@@ -74,7 +74,7 @@ class Charge
               'confirm' => true,
               'description' => $description,
             ];
-nlog($data);
+
             $response = $this->stripe->createPaymentIntent($data, $this->stripe->stripe_connect_auth);
             // $response = $local_stripe->paymentIntents->create($data);
 
diff --git a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
index 5d9743c35714..6751e988edac 100644
--- a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
+++ b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
@@ -14,7 +14,19 @@ class ActivatePaytracePaymentDriver extends Migration
      */
     public function up()
     {
-        Gateway::query()->where('id', 46)->update(['visible' => true, 'provider' => 'Paytrace']);
+
+        $paytrace = Gateway::find(46);
+
+        if($paytrace)
+        {
+            $fields = $paytrace->fields;
+            $fields->integratorId = "";
+
+            $paytrace->fields = $fields;
+            $paytrace->provider = 'Paytrace';
+            $paytrace->visible = true;
+            $paytrace->save();
+        }
     }
 
     /**
diff --git a/database/seeders/PaymentLibrariesSeeder.php b/database/seeders/PaymentLibrariesSeeder.php
index e6d31f414fe4..e851317a05f2 100644
--- a/database/seeders/PaymentLibrariesSeeder.php
+++ b/database/seeders/PaymentLibrariesSeeder.php
@@ -70,7 +70,7 @@ class PaymentLibrariesSeeder extends Seeder
             ['id' => 43, 'name' => 'Fasapay', 'provider' => 'Fasapay', 'key' => '1b2cef0e8c800204a29f33953aaf3360', 'fields' => ''],
             ['id' => 44, 'name' => 'Komoju', 'provider' => 'Komoju', 'key' => '7ea2d40ecb1eb69ef8c3d03e5019028a', 'fields' => '{"apiKey":"","accountId":"","paymentMethod":"credit_card","testMode":false,"locale":"en"}'],
             ['id' => 45, 'name' => 'Paysafecard', 'provider' => 'Paysafecard', 'key' => '70ab90cd6c5c1ab13208b3cef51c0894', 'fields' => '{"username":"","password":"","testMode":false}'],
-            ['id' => 46, 'name' => 'Paytrace', 'provider' => 'Paytrace', 'key' => 'bbd736b3254b0aabed6ad7fda1298c88', 'fields' => '{"username":"","password":"","testMode":false,"endpoint":"https:\/\/paytrace.com\/api\/default.pay"}'],
+            ['id' => 46, 'name' => 'Paytrace', 'provider' => 'Paytrace', 'key' => 'bbd736b3254b0aabed6ad7fda1298c88', 'fields' => '{"username":"","password":"","integratorId":"",testMode":false,"endpoint":"https:\/\/paytrace.com\/api\/default.pay"}'],
             ['id' => 47, 'name' => 'Secure Trading', 'provider' => 'SecureTrading', 'key' => '231cb401487b9f15babe04b1ac4f7a27', 'fields' => '{"siteReference":"","username":"","password":"","applyThreeDSecure":false,"accountType":"ECOM"}'],
             ['id' => 48, 'name' => 'SecPay', 'provider' => 'SecPay', 'key' => 'bad8699d581d9fa040e59c0bb721a76c', 'fields' => '{"mid":"","vpnPswd":"","remotePswd":"","usageType":"","confirmEmail":"","testStatus":"true","mailCustomer":"true","additionalOptions":""}'],
             ['id' => 49, 'name' => 'WePay', 'provider' => 'WePay', 'is_offsite' => false, 'sort_order' => 3, 'key' => '8fdeed552015b3c7b44ed6c8ebd9e992', 'fields' => '{"accountId":"","accessToken":"","type":"goods","testMode":false,"feePayer":"payee"}'],

From 40bbad8ecaefc6e423faf07a6b99551d6bb0c173 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 20:30:21 +1000
Subject: [PATCH 11/60] Minor fixes

---
 app/PaymentDrivers/PaytracePaymentDriver.php                    | 2 --
 .../2021_07_20_095537_activate_paytrace_payment_driver.php      | 2 +-
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index ca865da581cf..752030201c68 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -98,7 +98,6 @@ class PaytracePaymentDriver extends BaseDriver
 
         $response = $this->gatewayRequest('/v1/transactions/refund/to_customer', $data);
 
-
         if($response && $response->success)
         {
 
@@ -114,7 +113,6 @@ class PaytracePaymentDriver extends BaseDriver
 
         }
 
-
         SystemLogger::dispatch(['server_response' => $response, 'data' => $data], SystemLog::CATEGORY_GATEWAY_RESPONSE, SystemLog::EVENT_GATEWAY_FAILURE, SystemLog::TYPE_PAYTRACE, $this->client, $this->client->company);
 
         return [
diff --git a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
index 6751e988edac..51b15fa032bc 100644
--- a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
+++ b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
@@ -19,7 +19,7 @@ class ActivatePaytracePaymentDriver extends Migration
 
         if($paytrace)
         {
-            $fields = $paytrace->fields;
+            $fields = json_decode($paytrace->fields);
             $fields->integratorId = "";
 
             $paytrace->fields = $fields;

From 00d1273bd9fe9bc006f373171911e0e7042a73c6 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 21 Jul 2021 20:35:22 +1000
Subject: [PATCH 12/60] Fixes for gateway abilities

---
 app/Models/Gateway.php                                       | 5 +++++
 .../2021_07_20_095537_activate_paytrace_payment_driver.php   | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/Models/Gateway.php b/app/Models/Gateway.php
index fa95888fb63d..af8ba30d8e6b 100644
--- a/app/Models/Gateway.php
+++ b/app/Models/Gateway.php
@@ -81,6 +81,9 @@ class Gateway extends StaticModel
             case 1:
                 return [GatewayType::CREDIT_CARD => ['refund' => true, 'token_billing' => true]];//Authorize.net
                 break;
+            case 1:
+                return [GatewayType::CREDIT_CARD => ['refund' => false, 'token_billing' => false]];//Payfast
+                break;
             case 15:
                 return [GatewayType::PAYPAL => ['refund' => true, 'token_billing' => false]]; //Paypal
                 break;
@@ -95,6 +98,8 @@ class Gateway extends StaticModel
             case 39:
                 return [GatewayType::CREDIT_CARD => ['refund' => true, 'token_billing' => true]]; //Checkout
                 break;
+            case 46:
+                return [GatewayType::CREDIT_CARD => ['refund' => true, 'token_billing' => true]]; //Paytrace
             case 49:
                 return [GatewayType::CREDIT_CARD => ['refund' => true, 'token_billing' => true],
                     GatewayType::BANK_TRANSFER => ['refund' => true, 'token_billing' => true]]; //WePay
diff --git a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
index 51b15fa032bc..5fdcec6f96fd 100644
--- a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
+++ b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
@@ -22,7 +22,7 @@ class ActivatePaytracePaymentDriver extends Migration
             $fields = json_decode($paytrace->fields);
             $fields->integratorId = "";
 
-            $paytrace->fields = $fields;
+            $paytrace->fields = json_encode($fields);
             $paytrace->provider = 'Paytrace';
             $paytrace->visible = true;
             $paytrace->save();

From 572957892623cac4f213d005c8e88b98f466e982 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Fri, 23 Jul 2021 11:25:33 +1000
Subject: [PATCH 13/60] minor fixes

---
 app/Mail/Engine/PaymentEmailEngine.php                       | 1 +
 app/Mail/SupportMessageSent.php                              | 5 +++--
 .../2021_07_20_095537_activate_paytrace_payment_driver.php   | 4 +---
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/Mail/Engine/PaymentEmailEngine.php b/app/Mail/Engine/PaymentEmailEngine.php
index d008f38f0bd1..93cb4d6cfbb7 100644
--- a/app/Mail/Engine/PaymentEmailEngine.php
+++ b/app/Mail/Engine/PaymentEmailEngine.php
@@ -133,6 +133,7 @@ class PaymentEmailEngine extends BaseEmailEngine
         $data['$email'] = ['value' => isset($this->contact) ? $this->contact->email : 'no contact email on record', 'label' => ctrans('texts.email')];
         $data['$client_name'] = ['value' => $this->client->present()->name() ?: '&nbsp;', 'label' => ctrans('texts.client_name')];
         $data['$client.name'] = &$data['$client_name'];
+        $data['$client'] = &$data['client_name'];
         $data['$client.address1'] = &$data['$address1'];
         $data['$client.address2'] = &$data['$address2'];
         $data['$client_address'] = ['value' => $this->client->present()->address() ?: '&nbsp;', 'label' => ctrans('texts.address')];
diff --git a/app/Mail/SupportMessageSent.php b/app/Mail/SupportMessageSent.php
index 429202661a17..5e513c9eb015 100644
--- a/app/Mail/SupportMessageSent.php
+++ b/app/Mail/SupportMessageSent.php
@@ -60,11 +60,12 @@ class SupportMessageSent extends Mailable
 
         $company = auth()->user()->company();
         $user = auth()->user();
+        $db = str_replace("db-ninja-", "", $company->db);
 
         if(Ninja::isHosted())
-            $subject = "{$priority}Hosted-{$company->db} :: Customer Support - {$plan} ".date('M jS, g:ia');
+            $subject = "{$priority}Hosted-{$company->db} :: {$plan} :: ".date('M jS, g:ia');
         else
-            $subject = "{$priority}Self Hosted :: Customer Support - [{$plan}] ".date('M jS, g:ia');
+            $subject = "{$priority}Self Hosted :: {$plan} :: ".date('M jS, g:ia');
 
         return $this->from(config('mail.from.address'), $user->present()->name()) 
                 ->replyTo($user->email, $user->present()->name())
diff --git a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
index 5fdcec6f96fd..e690af365e3c 100644
--- a/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
+++ b/database/migrations/2021_07_20_095537_activate_paytrace_payment_driver.php
@@ -15,9 +15,7 @@ class ActivatePaytracePaymentDriver extends Migration
     public function up()
     {
 
-        $paytrace = Gateway::find(46);
-
-        if($paytrace)
+        if($paytrace = Gateway::find(46))
         {
             $fields = json_decode($paytrace->fields);
             $fields->integratorId = "";

From 429570227da26eadd41db03f6b958eff3bb8d05f Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Fri, 23 Jul 2021 12:12:42 +1000
Subject: [PATCH 14/60] Confirmed paytrace working EXCEPT pay page

---
 app/Mail/Engine/PaymentEmailEngine.php        |  2 +-
 app/PaymentDrivers/PaytracePaymentDriver.php  | 18 +++++++++-------
 config/ninja.php                              |  4 ++++
 .../ninja2020/gateways/paytrace/pay.blade.php | 21 +++++++++++--------
 4 files changed, 28 insertions(+), 17 deletions(-)

diff --git a/app/Mail/Engine/PaymentEmailEngine.php b/app/Mail/Engine/PaymentEmailEngine.php
index 93cb4d6cfbb7..137be2392677 100644
--- a/app/Mail/Engine/PaymentEmailEngine.php
+++ b/app/Mail/Engine/PaymentEmailEngine.php
@@ -133,7 +133,7 @@ class PaymentEmailEngine extends BaseEmailEngine
         $data['$email'] = ['value' => isset($this->contact) ? $this->contact->email : 'no contact email on record', 'label' => ctrans('texts.email')];
         $data['$client_name'] = ['value' => $this->client->present()->name() ?: '&nbsp;', 'label' => ctrans('texts.client_name')];
         $data['$client.name'] = &$data['$client_name'];
-        $data['$client'] = &$data['client_name'];
+        $data['$client'] = &$data['$client_name'];
         $data['$client.address1'] = &$data['$address1'];
         $data['$client.address2'] = &$data['$address2'];
         $data['$client_address'] = ['value' => $this->client->present()->address() ?: '&nbsp;', 'label' => ctrans('texts.address')];
diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index 752030201c68..58a0dedd5b54 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -11,6 +11,7 @@
 
 namespace App\PaymentDrivers;
 
+use App\Jobs\Util\SystemLogger;
 use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
 use App\Models\Payment;
@@ -86,17 +87,18 @@ class PaytracePaymentDriver extends BaseDriver
 
     public function refund(Payment $payment, $amount, $return_client_response = false)
     {
-        $cgt = ClientGatewayToken::where('company_gateway_id', $payment->company_gateway_id)
-                                 ->where('gateway_type_id', $payment->gateway_type_id)
-                                 ->first();
+        // $cgt = ClientGatewayToken::where('company_gateway_id', $payment->company_gateway_id)
+        //                          ->where('gateway_type_id', $payment->gateway_type_id)
+        //                          ->first();
 
         $data = [
             'amount' => $amount,
-            'customer_id' => $cgt->token,
+            //'customer_id' => $cgt->token,
+            'transaction_id' => $payment->transaction_reference,
             'integrator_id' => '959195xd1CuC'
         ];
 
-        $response = $this->gatewayRequest('/v1/transactions/refund/to_customer', $data);
+        $response = $this->gatewayRequest('/v1/transactions/refund/for_transaction', $data);
 
         if($response && $response->success)
         {
@@ -181,8 +183,10 @@ class PaytracePaymentDriver extends BaseDriver
         $url = 'https://api.paytrace.com/oauth/token';
         $data = [
             'grant_type' => 'password',
-            'username' => $this->company_gateway->getConfigField('username'),
-            'password' => $this->company_gateway->getConfigField('password')
+            'username' => config('ninja.testvars.paytrace.username'),
+            'password' => config('ninja.testvars.paytrace.password'),
+            //'username' => $this->company_gateway->getConfigField('username'),
+            //'password' => $this->company_gateway->getConfigField('password')
         ];
 
         $response = CurlUtils::post($url, $data, $headers = false);
diff --git a/config/ninja.php b/config/ninja.php
index 878174e2f07a..ac835e3624f5 100644
--- a/config/ninja.php
+++ b/config/ninja.php
@@ -84,6 +84,10 @@ return [
         'test_email' => env('TEST_EMAIL', 'test@example.com'),
         'wepay' => env('WEPAY_KEYS', ''),
         'braintree' => env('BRAINTREE_KEYS', ''),
+        'paytrace' => [
+            'username' => env('PAYTRACE_U', ''),
+            'password' => env('PAYTRACE_P','')
+        ],
     ],
     'contact' => [
         'email' => env('MAIL_FROM_ADDRESS'),
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
index aa9eb9162e29..4535639e43d4 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
@@ -146,22 +146,14 @@ PTPayment.setup({
     PTPayment.getControl("securityCode").label.text("{!! ctrans('texts.cvv')!!}");
     PTPayment.getControl("creditCard").label.text("{!! ctrans('texts.card_number')!!}");
     PTPayment.getControl("expiration").label.text("{!! ctrans('texts.expires')!!}");
-    //PTPayment.style({'cc': {'label_color': 'red'}});
-    //PTPayment.style({'code': {'label_color': 'red'}});
-    //PTPayment.style({'exp': {'label_color': 'red'}});
-    //PTPayment.style({'exp':{'type':'dropdown'}});
 
-    //PTPayment.theme('horizontal');
-    // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
     document.getElementById("server_response").addEventListener("submit",function(e){
     e.preventDefault();
     e.stopPropagation();
 
-    // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
     PTPayment.validate(function(validationErrors) {
 
-    if (validationErrors.length >= 1 && token_payment == false) {
-
+    if (validationErrors.length >= 1 && !token_payment) {
         let errors = document.getElementById('errors');
 
         errors.textContent = '';
@@ -170,6 +162,11 @@ PTPayment.setup({
 
     } else {
      // no error so tokenize
+     if(token_payment){
+
+        tokenPayment();
+     } 
+     
      instance.process()
      .then( (r) => {
         submitPayment(r);
@@ -200,5 +197,11 @@ function submitPayment(r){
 
 }
 
+
+function tokenPayment(){
+
+      document.getElementById("server_response").submit();
+      return false;
+}
 </script>
 @endsection

From 043f0816f12e6d4531b36b47114481e50d24caf5 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Fri, 23 Jul 2021 14:13:33 +1000
Subject: [PATCH 15/60] Fixes for PayTrace

---
 database/seeders/PaymentLibrariesSeeder.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/database/seeders/PaymentLibrariesSeeder.php b/database/seeders/PaymentLibrariesSeeder.php
index e851317a05f2..328282dee23c 100644
--- a/database/seeders/PaymentLibrariesSeeder.php
+++ b/database/seeders/PaymentLibrariesSeeder.php
@@ -70,7 +70,7 @@ class PaymentLibrariesSeeder extends Seeder
             ['id' => 43, 'name' => 'Fasapay', 'provider' => 'Fasapay', 'key' => '1b2cef0e8c800204a29f33953aaf3360', 'fields' => ''],
             ['id' => 44, 'name' => 'Komoju', 'provider' => 'Komoju', 'key' => '7ea2d40ecb1eb69ef8c3d03e5019028a', 'fields' => '{"apiKey":"","accountId":"","paymentMethod":"credit_card","testMode":false,"locale":"en"}'],
             ['id' => 45, 'name' => 'Paysafecard', 'provider' => 'Paysafecard', 'key' => '70ab90cd6c5c1ab13208b3cef51c0894', 'fields' => '{"username":"","password":"","testMode":false}'],
-            ['id' => 46, 'name' => 'Paytrace', 'provider' => 'Paytrace', 'key' => 'bbd736b3254b0aabed6ad7fda1298c88', 'fields' => '{"username":"","password":"","integratorId":"",testMode":false,"endpoint":"https:\/\/paytrace.com\/api\/default.pay"}'],
+            ['id' => 46, 'name' => 'Paytrace', 'provider' => 'Paytrace', 'key' => 'bbd736b3254b0aabed6ad7fda1298c88', 'fields' => '{"username":"","password":"","integratorId":"","testMode":false,"endpoint":"https:\/\/paytrace.com\/api\/default.pay"}'],
             ['id' => 47, 'name' => 'Secure Trading', 'provider' => 'SecureTrading', 'key' => '231cb401487b9f15babe04b1ac4f7a27', 'fields' => '{"siteReference":"","username":"","password":"","applyThreeDSecure":false,"accountType":"ECOM"}'],
             ['id' => 48, 'name' => 'SecPay', 'provider' => 'SecPay', 'key' => 'bad8699d581d9fa040e59c0bb721a76c', 'fields' => '{"mid":"","vpnPswd":"","remotePswd":"","usageType":"","confirmEmail":"","testStatus":"true","mailCustomer":"true","additionalOptions":""}'],
             ['id' => 49, 'name' => 'WePay', 'provider' => 'WePay', 'is_offsite' => false, 'sort_order' => 3, 'key' => '8fdeed552015b3c7b44ed6c8ebd9e992', 'fields' => '{"accountId":"","accessToken":"","type":"goods","testMode":false,"feePayer":"payee"}'],

From 86ca60afa781e3114c755eeb2f5033013b71dc25 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Fri, 23 Jul 2021 14:15:51 +1000
Subject: [PATCH 16/60] Fixes for pay trace integration

---
 app/PaymentDrivers/PayTrace/CreditCard.php   | 8 ++++----
 app/PaymentDrivers/PaytracePaymentDriver.php | 8 +++-----
 2 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index adde39177b15..692469c86d48 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -94,7 +94,7 @@ class CreditCard
             'customer_id' => Str::random(32),
             'hpf_token' => $data['HPF_Token'],
             'enc_key' => $data['enc_key'],
-            'integrator_id' => '959195xd1CuC',
+            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
             'billing_address' => $this->buildBillingAddress(),
         ];
 
@@ -123,7 +123,7 @@ class CreditCard
     private function getCustomerProfile($customer_id)
     {
         $profile = $this->paytrace_driver->gatewayRequest('/v1/customer/export', [
-            'integrator_id' => '959195xd1CuC',
+            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
             'customer_id' => $customer_id,
             // 'include_bin' => true,
         ]);
@@ -171,7 +171,7 @@ class CreditCard
         $data = [
             'hpf_token' => $response_array['HPF_Token'],
             'enc_key' => $response_array['enc_key'],
-            'integrator_id' => '959195xd1CuC',
+            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
             'billing_address' => $this->buildBillingAddress(),
             'amount' => $request->input('amount_with_fee'),
             'invoice_id' => $this->harvestInvoiceId(),
@@ -191,7 +191,7 @@ class CreditCard
 
         $data = [
             'customer_id' => $request->token,
-            'integrator_id' => '959195xd1CuC',
+            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
             'amount' => $request->input('amount_with_fee'),
         ];
 
diff --git a/app/PaymentDrivers/PaytracePaymentDriver.php b/app/PaymentDrivers/PaytracePaymentDriver.php
index 58a0dedd5b54..9b103ca28eb9 100644
--- a/app/PaymentDrivers/PaytracePaymentDriver.php
+++ b/app/PaymentDrivers/PaytracePaymentDriver.php
@@ -133,7 +133,7 @@ class PaytracePaymentDriver extends BaseDriver
 
         $data = [
             'customer_id' => $cgt->token,
-            'integrator_id' => '959195xd1CuC',
+            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
             'amount' => $amount,
         ];
 
@@ -183,10 +183,8 @@ class PaytracePaymentDriver extends BaseDriver
         $url = 'https://api.paytrace.com/oauth/token';
         $data = [
             'grant_type' => 'password',
-            'username' => config('ninja.testvars.paytrace.username'),
-            'password' => config('ninja.testvars.paytrace.password'),
-            //'username' => $this->company_gateway->getConfigField('username'),
-            //'password' => $this->company_gateway->getConfigField('password')
+            'username' => $this->company_gateway->getConfigField('username'),
+            'password' => $this->company_gateway->getConfigField('password')
         ];
 
         $response = CurlUtils::post($url, $data, $headers = false);

From b324c4292bb9ec94cc3b6e91145886c4aae6a95a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 23 Jul 2021 13:42:13 +0200
Subject: [PATCH 17/60] Inject Mollie in CreateSingleAccount & ninja config

---
 app/Console/Commands/CreateSingleAccount.php | 21 ++++++++++++++++++++
 config/ninja.php                             |  1 +
 2 files changed, 22 insertions(+)

diff --git a/app/Console/Commands/CreateSingleAccount.php b/app/Console/Commands/CreateSingleAccount.php
index b53626595059..4a8b1236e4fd 100644
--- a/app/Console/Commands/CreateSingleAccount.php
+++ b/app/Console/Commands/CreateSingleAccount.php
@@ -742,6 +742,27 @@ class CreateSingleAccount extends Command
             $cg->fees_and_limits = $fees_and_limits;
             $cg->save();
         }
+
+        if (config('ninja.testvars.mollie') && ($this->gateway == 'all' || $this->gateway == 'mollie')) {
+            $cg = new CompanyGateway;
+            $cg->company_id = $company->id;
+            $cg->user_id = $user->id;
+            $cg->gateway_key = '1bd651fb213ca0c9d66ae3c336dc77e8';
+            $cg->require_cvv = true;
+            $cg->require_billing_address = true;
+            $cg->require_shipping_address = true;
+            $cg->update_details = true;
+            $cg->config = encrypt(config('ninja.testvars.mollie'));
+            $cg->save();
+
+            $gateway_types = $cg->driver(new Client)->gatewayTypes();
+
+            $fees_and_limits = new stdClass;
+            $fees_and_limits->{$gateway_types[0]} = new FeesAndLimits;
+
+            $cg->fees_and_limits = $fees_and_limits;
+            $cg->save();
+        }
     }
 
     private function createRecurringInvoice($client)
diff --git a/config/ninja.php b/config/ninja.php
index 878174e2f07a..c0d7d1721274 100644
--- a/config/ninja.php
+++ b/config/ninja.php
@@ -84,6 +84,7 @@ return [
         'test_email' => env('TEST_EMAIL', 'test@example.com'),
         'wepay' => env('WEPAY_KEYS', ''),
         'braintree' => env('BRAINTREE_KEYS', ''),
+        'mollie' => env('MOLLIE_KEYS', ''),
     ],
     'contact' => [
         'email' => env('MAIL_FROM_ADDRESS'),

From aa88f067e77ff01faf80e5e4513e192eb887d46b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 23 Jul 2021 13:46:28 +0200
Subject: [PATCH 18/60] Install mollie/mollie-api-php

---
 composer.json |  1 +
 composer.lock | 93 ++++++++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 93 insertions(+), 1 deletion(-)

diff --git a/composer.json b/composer.json
index 151dd8239ab6..8595adacbbc3 100644
--- a/composer.json
+++ b/composer.json
@@ -62,6 +62,7 @@
         "league/omnipay": "^3.1",
         "livewire/livewire": "^2.4",
         "maennchen/zipstream-php": "^1.2",
+        "mollie/mollie-api-php": "^2.36",
         "nwidart/laravel-modules": "^8.0",
         "omnipay/paypal": "^3.0",
         "payfast/payfast-php-sdk": "^1.1",
diff --git a/composer.lock b/composer.lock
index 15b58365b9a7..89eea29d9e7b 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "d2beb37ff5fbee59ad4bb792e944eb10",
+    "content-hash": "275a9dd3910b6ec79607b098406dc6c7",
     "packages": [
         {
             "name": "asm/php-ansible",
@@ -4386,6 +4386,97 @@
             },
             "time": "2019-07-17T11:01:58+00:00"
         },
+        {
+            "name": "mollie/mollie-api-php",
+            "version": "v2.36.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/mollie/mollie-api-php.git",
+                "reference": "19f69c116d47a3600f0ed629e0df925a43d3a8f5"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/mollie/mollie-api-php/zipball/19f69c116d47a3600f0ed629e0df925a43d3a8f5",
+                "reference": "19f69c116d47a3600f0ed629e0df925a43d3a8f5",
+                "shasum": ""
+            },
+            "require": {
+                "composer/ca-bundle": "^1.1",
+                "ext-curl": "*",
+                "ext-json": "*",
+                "ext-openssl": "*",
+                "php": ">=5.6"
+            },
+            "require-dev": {
+                "eloquent/liberator": "^2.0",
+                "friendsofphp/php-cs-fixer": "^3.0",
+                "guzzlehttp/guzzle": "^6.3 || ^7.0",
+                "phpunit/phpunit": "^5.7 || ^6.5 || ^7.1 || ^8.5"
+            },
+            "suggest": {
+                "mollie/oauth2-mollie-php": "Use OAuth to authenticate with the Mollie API. This is needed for some endpoints. Visit https://docs.mollie.com/ for more information."
+            },
+            "type": "library",
+            "autoload": {
+                "psr-4": {
+                    "Mollie\\Api\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "BSD-2-Clause"
+            ],
+            "authors": [
+                {
+                    "name": "Mollie B.V.",
+                    "email": "info@mollie.com"
+                }
+            ],
+            "description": "Mollie API client library for PHP. Mollie is a European Payment Service provider and offers international payment methods such as Mastercard, VISA, American Express and PayPal, and local payment methods such as iDEAL, Bancontact, SOFORT Banking, SEPA direct debit, Belfius Direct Net, KBC Payment Button and various gift cards such as Podiumcadeaukaart and fashioncheque.",
+            "homepage": "https://www.mollie.com/en/developers",
+            "keywords": [
+                "Apple Pay",
+                "CBC",
+                "Przelewy24",
+                "api",
+                "bancontact",
+                "banktransfer",
+                "belfius",
+                "belfius direct net",
+                "charges",
+                "creditcard",
+                "direct debit",
+                "fashioncheque",
+                "gateway",
+                "gift cards",
+                "ideal",
+                "inghomepay",
+                "intersolve",
+                "kbc",
+                "klarna",
+                "mistercash",
+                "mollie",
+                "paylater",
+                "payment",
+                "payments",
+                "paypal",
+                "paysafecard",
+                "podiumcadeaukaart",
+                "recurring",
+                "refunds",
+                "sepa",
+                "service",
+                "sliceit",
+                "sofort",
+                "sofortbanking",
+                "subscriptions"
+            ],
+            "support": {
+                "issues": "https://github.com/mollie/mollie-api-php/issues",
+                "source": "https://github.com/mollie/mollie-api-php/tree/v2.36.1"
+            },
+            "time": "2021-06-23T12:55:50+00:00"
+        },
         {
             "name": "moneyphp/money",
             "version": "v3.3.1",

From 99d0259365d803ee98a7858b18857240ed5fd417 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 23 Jul 2021 13:47:01 +0200
Subject: [PATCH 19/60] Scaffold MolliePaymentDriver

---
 app/PaymentDrivers/MolliePaymentDriver.php | 116 +++++++++++++++++++++
 1 file changed, 116 insertions(+)
 create mode 100644 app/PaymentDrivers/MolliePaymentDriver.php

diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
new file mode 100644
index 000000000000..03879c42fd1e
--- /dev/null
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -0,0 +1,116 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace App\PaymentDrivers;
+
+use App\Http\Requests\Payments\PaymentWebhookRequest;
+use App\Models\ClientGatewayToken;
+use App\Models\GatewayType;
+use App\Models\Payment;
+use App\Models\PaymentHash;
+use App\Models\SystemLog;
+use App\Utils\Traits\MakesHash;
+
+class MolliePaymentDriver extends BaseDriver
+{
+    use MakesHash;
+
+    /**
+     * @var boolean
+     */
+    public $refundable = true;
+
+    /**
+     * @var true
+     */
+    public $token_billing = true;
+
+    /**
+     * @var true
+     */
+    public $can_authorise_credit_card = true;
+
+    /**
+     * @var mixed
+     */
+    public $gateway;
+
+    /**
+     * @var mixed
+     */
+    public $payment_method;
+
+    /**
+     * @var string[]
+     */
+    public static $methods = [
+        GatewayType::CREDIT_CARD => CreditCard::class,
+    ];
+
+    const SYSTEM_LOG_TYPE = SystemLog::TYPE_STRIPE;
+
+    public function init()
+    {
+        return $this;
+    }
+
+    /* Returns an array of gateway types for the payment gateway */
+    public function gatewayTypes(): array
+    {
+        $types = [];
+
+        $types[] = GatewayType::CREDIT_CARD;
+
+        return $types;
+    }
+
+    public function setPaymentMethod($payment_method_id)
+    {
+        $class = self::$methods[$payment_method_id];
+        $this->payment_method = new $class($this);
+        return $this;
+    }
+
+    public function authorizeView(array $data)
+    {
+        return $this->payment_method->authorizeView($data);
+    }
+
+    public function authorizeResponse($request)
+    {
+        return $this->payment_method->authorizeResponse($request);
+    }
+
+    public function processPaymentView(array $data)
+    {
+        return $this->payment_method->paymentView($data);
+    }
+
+    public function processPaymentResponse($request)
+    {
+        return $this->payment_method->paymentResponse($request);
+    }
+
+    public function refund(Payment $payment, $amount, $return_client_response = false)
+    {
+        return $this->payment_method->yourRefundImplementationHere();
+    }
+
+    public function tokenBilling(ClientGatewayToken $cgt, PaymentHash $payment_hash)
+    {
+        return $this->payment_method->yourTokenBillingImplmentation();
+    }
+
+    public function processWebhookRequest(PaymentWebhookRequest $request, Payment $payment = null)
+    {
+    }
+}

From a29d4f20759ebfbb7c99356e5d1ff5a20cc4bed7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 23 Jul 2021 14:43:32 +0200
Subject: [PATCH 20/60] wip

---
 app/Models/SystemLog.php                      |   1 +
 app/PaymentDrivers/Mollie/CreditCard.php      |  63 ++++++
 app/PaymentDrivers/MolliePaymentDriver.php    |  17 +-
 public/css/app.css                            |   2 +-
 public/mix-manifest.json                      |   2 +-
 resources/lang/en/texts.php                   |   1 +
 .../gateways/mollie/credit_card/pay.blade.php | 183 ++++++++++++++++++
 7 files changed, 263 insertions(+), 6 deletions(-)
 create mode 100644 app/PaymentDrivers/Mollie/CreditCard.php
 create mode 100644 resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php

diff --git a/app/Models/SystemLog.php b/app/Models/SystemLog.php
index 7614c01ecccc..a851ed767cfb 100644
--- a/app/Models/SystemLog.php
+++ b/app/Models/SystemLog.php
@@ -68,6 +68,7 @@ class SystemLog extends Model
     const TYPE_BRAINTREE = 307;
     const TYPE_WEPAY = 309;
     const TYPE_PAYFAST = 310;
+    const TYPE_MOLLIE = 311;
     
 
     const TYPE_QUOTA_EXCEEDED = 400;
diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
new file mode 100644
index 000000000000..3f227c76e634
--- /dev/null
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -0,0 +1,63 @@
+<?php
+
+namespace App\PaymentDrivers\Mollie;
+
+use App\Exceptions\PaymentFailed;
+use App\Http\Requests\ClientPortal\Payments\PaymentResponseRequest;
+use App\PaymentDrivers\MolliePaymentDriver;
+use Illuminate\Contracts\View\Factory;
+use Illuminate\View\View;
+use Illuminate\Contracts\Container\BindingResolutionException;
+
+use function Symfony\Component\String\b;
+
+class CreditCard
+{
+    /**
+     * @var MolliePaymentDriver
+     */
+    protected $mollie;
+
+    public function __construct(MolliePaymentDriver $mollie)
+    {
+        $this->mollie = $mollie;
+
+        $this->mollie->init();
+    }
+
+    /**
+     * Show the page for credit card payments.
+     * 
+     * @param array $data 
+     * @return Factory|View 
+     */
+    public function paymentView(array $data)
+    {
+        $data['gateway'] = $this->mollie;
+
+        return render('gateways.mollie.credit_card.pay', $data);
+    }
+
+    public function paymentResponse(PaymentResponseRequest $request)
+    {
+        try {
+            $payment = $this->mollie->gateway->payments->create([
+                "amount" => [
+                    "currency" => "USD",
+                    "value" => "10.00"
+                ],
+                "description" => "Order #12345",
+                "redirectUrl" => "https://webshop.example.org/order/12345/",
+                "webhookUrl"  => "https://webshop.example.org/mollie-webhook/",
+            ]);
+
+            if ($payment->status === 'open') {
+                return redirect($payment->getCheckoutUrl());
+            }
+        } catch (\Exception $e) {
+            throw new PaymentFailed($e->getMessage(), $e->getCode());
+        }
+
+        dd($payment);
+    }
+}
diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 03879c42fd1e..6cdcb8b97676 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -18,7 +18,9 @@ use App\Models\GatewayType;
 use App\Models\Payment;
 use App\Models\PaymentHash;
 use App\Models\SystemLog;
+use App\PaymentDrivers\Mollie\CreditCard;
 use App\Utils\Traits\MakesHash;
+use Mollie\Api\MollieApiClient;
 
 class MolliePaymentDriver extends BaseDriver
 {
@@ -40,7 +42,7 @@ class MolliePaymentDriver extends BaseDriver
     public $can_authorise_credit_card = true;
 
     /**
-     * @var mixed
+     * @var MollieApiClient
      */
     public $gateway;
 
@@ -56,14 +58,19 @@ class MolliePaymentDriver extends BaseDriver
         GatewayType::CREDIT_CARD => CreditCard::class,
     ];
 
-    const SYSTEM_LOG_TYPE = SystemLog::TYPE_STRIPE;
+    const SYSTEM_LOG_TYPE = SystemLog::TYPE_MOLLIE;
 
-    public function init()
+    public function init(): self
     {
+        $this->gateway = new MollieApiClient();
+
+        $this->gateway->setApiKey(
+            $this->company_gateway->getConfigField('apiKey'),
+        );
+
         return $this;
     }
 
-    /* Returns an array of gateway types for the payment gateway */
     public function gatewayTypes(): array
     {
         $types = [];
@@ -76,7 +83,9 @@ class MolliePaymentDriver extends BaseDriver
     public function setPaymentMethod($payment_method_id)
     {
         $class = self::$methods[$payment_method_id];
+
         $this->payment_method = new $class($this);
+
         return $this;
     }
 
diff --git a/public/css/app.css b/public/css/app.css
index fbe3808e3bb2..f14af4b99afb 100755
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -1 +1 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:Open Sans,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #d2d6dc}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.form-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7 7l3-3 3 3m0 6l-3 3-3-3' stroke='%239fa6b2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;background-repeat:no-repeat;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.375rem;padding:.5rem 2.5rem .5rem .75rem;font-size:1rem;line-height:1.5;background-position:right .5rem center;background-size:1.5em 1.5em}.form-select::-ms-expand{color:#9fa6b2;border:none}@media not print{.form-select::-ms-expand{display:none}}@media print and (-ms-high-contrast:active),print and (-ms-high-contrast:none){.form-select{padding-right:.75rem}}.form-select:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.707 7.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 00-1.414-1.414L7 8.586 5.707 7.293z'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-checkbox::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.25rem}.form-checkbox:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked:focus,.form-radio:checked{border-color:transparent}.form-radio:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E");background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-radio::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;border-radius:100%;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px}.form-radio:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-radio:checked:focus{border-color:transparent}.button{border-radius:.25rem;padding:.75rem 1rem;font-size:.875rem;line-height:1rem;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}button:disabled{opacity:.5;cursor:not-allowed}.button-primary{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-primary:hover{font-weight:600}.button-block{display:block;width:100%}.button-danger{--bg-opacity:1;background-color:#f05252;background-color:rgba(240,82,82,var(--bg-opacity));--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-danger:hover{--bg-opacity:1;background-color:#e02424;background-color:rgba(224,36,36,var(--bg-opacity))}.button-secondary{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.button-secondary:hover{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.button-link:hover{font-weight:600;text-decoration:underline}.button-link:focus{outline:2px solid transparent;outline-offset:2px;text-decoration:underline}.validation{border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));padding:.25rem .75rem}.validation-fail{border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.validation-fail,.validation-pass{--border-opacity:1;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));font-size:.875rem}.validation-pass{border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.input{align-items:center;border-width:1px;--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity));border-radius:.25rem;margin-top:.5rem;padding:.5rem 1rem;font-size:.875rem}.input:focus{outline:2px solid transparent;outline-offset:2px;--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.input-label{font-size:.875rem;--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.input-slim{padding-top:.5rem;padding-bottom:.5rem}.alert{padding:.75rem 1rem;font-size:.875rem;border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.alert-success{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.alert-failure{--border-opacity:1;border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.badge{display:inline-flex;align-items:center;padding:.125rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:500;line-height:1rem}.badge-light{background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.badge-light,.badge-primary{--bg-opacity:1;--text-opacity:1}.badge-primary{background-color:#c3ddfd;background-color:rgba(195,221,253,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}.badge-danger{background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity));color:#f05252;color:rgba(240,82,82,var(--text-opacity))}.badge-danger,.badge-success{--bg-opacity:1;--text-opacity:1}.badge-success{background-color:#def7ec;background-color:rgba(222,247,236,var(--bg-opacity));color:#0e9f6e;color:rgba(14,159,110,var(--text-opacity))}.badge-secondary{--bg-opacity:1;background-color:#252f3f;background-color:rgba(37,47,63,var(--bg-opacity));--text-opacity:1;color:#e5e7eb;color:rgba(229,231,235,var(--text-opacity))}.badge-warning{background-color:#feecdc;background-color:rgba(254,236,220,var(--bg-opacity));color:#ff5a1f;color:rgba(255,90,31,var(--text-opacity))}.badge-info,.badge-warning{--bg-opacity:1;--text-opacity:1}.badge-info{background-color:#e1effe;background-color:rgba(225,239,254,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}@media (min-width:640px){.dataTables_length{margin-top:1.25rem!important;margin-bottom:1.25rem!important}}@media (min-width:1024px){.dataTables_length{margin-top:1rem!important;margin-bottom:1rem!important}}.dataTables_length select{--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;font-size:.875rem!important;margin-left:.5rem!important;margin-right:.5rem!important;padding:.5rem!important}.dataTables_filter{margin-bottom:1rem}.dataTables_filter input{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;background-color:#fff!important;border-radius:.375rem!important;font-size:1rem!important;line-height:1.5!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;padding:.5rem 1rem!important;font-size:.875rem!important}@media (min-width:1024px){.dataTables_filter{margin-top:-3rem!important}}.dataTables_paginate{padding-bottom:1.5rem!important;padding-top:.5rem!important}.dataTables_paginate .paginate_button{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-duration:.15s!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;font-size:.875rem!important;line-height:1rem!important;font-weight:500!important;border-radius:.25rem!important;--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;margin-right:.25rem!important;padding:.5rem 1rem!important;cursor:pointer!important}.dataTables_paginate .current{--bg-opacity:1!important;background-color:#1c64f2!important;background-color:rgba(28,100,242,var(--bg-opacity))!important;--text-opacity:1!important;color:#fff!important;color:rgba(255,255,255,var(--text-opacity))!important}.dataTables_info{font-size:.875rem!important}.dataTables_empty{padding-top:1rem!important;padding-bottom:1rem!important}.pagination{display:flex!important;align-items:center!important}.pagination .page-link{margin-top:-1px!important;border-top-width:2px!important;border-color:transparent!important;padding-top:1rem!important;padding-left:1rem!important;padding-right:1rem!important;display:inline-flex!important;align-items:center!important;font-size:.875rem!important;line-height:1.25rem!important;font-weight:500!important;--text-opacity:1!important;color:#6b7280!important;color:rgba(107,114,128,var(--text-opacity))!important;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;transition-duration:.15s!important;cursor:pointer!important}.pagination .page-link:hover{--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important}.pagination .page-link:focus{outline:2px solid transparent;outline-offset:2px;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.pagination .active>span{--text-opacity:1!important;color:#1c64f2!important;color:rgba(28,100,242,var(--text-opacity))!important;--border-opacity:1!important;border-color:#1c64f2!important;border-color:rgba(28,100,242,var(--border-opacity))!important}.space-x-1>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.25rem*var(--space-x-reverse));margin-left:calc(0.25rem*(1 - var(--space-x-reverse)))}.space-x-2>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.5rem*var(--space-x-reverse));margin-left:calc(0.5rem*(1 - var(--space-x-reverse)))}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-50{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.bg-gray-500{--bg-opacity:1;background-color:#6b7280;background-color:rgba(107,114,128,var(--bg-opacity))}.bg-gray-600{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.bg-red-100{--bg-opacity:1;background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity))}.bg-blue-50{--bg-opacity:1;background-color:#ebf5ff;background-color:rgba(235,245,255,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#1c64f2;background-color:rgba(28,100,242,var(--bg-opacity))}.focus\:bg-gray-100:focus,.hover\:bg-gray-100:hover{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.focus\:bg-gray-600:focus{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.active\:bg-gray-50:active{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.border-collapse{border-collapse:collapse}.border-gray-100{--border-opacity:1;border-color:#f4f5f7;border-color:rgba(244,245,247,var(--border-opacity))}.border-gray-200{--border-opacity:1;border-color:#e5e7eb;border-color:rgba(229,231,235,var(--border-opacity))}.border-gray-300{--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity))}.border-red-300{--border-opacity:1;border-color:#f8b4b4;border-color:rgba(248,180,180,var(--border-opacity))}.border-red-400{--border-opacity:1;border-color:#f98080;border-color:rgba(249,128,128,var(--border-opacity))}.border-green-500{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#3f83f8;border-color:rgba(63,131,248,var(--border-opacity))}.group:hover .group-hover\:border-transparent{border-color:transparent}.hover\:border-gray-800:hover{--border-opacity:1;border-color:#252f3f;border-color:rgba(37,47,63,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#1c64f2;border-color:rgba(28,100,242,var(--border-opacity))}.focus\:border-blue-300:focus{--border-opacity:1;border-color:#a4cafe;border-color:rgba(164,202,254,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-0{border-width:0}.border-4{border-width:4px}.border{border-width:1px}.border-l-2{border-left-width:2px}.border-t{border-top-width:1px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.focus\:font-semibold:focus,.hover\:font-semibold:hover{font-weight:600}.h-0{height:0}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-32{height:8rem}.h-64{height:16rem}.h-auto{height:auto}.h-screen{height:100vh}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.leading-4{line-height:1rem}.leading-5{line-height:1.25rem}.leading-6{line-height:1.5rem}.leading-9{line-height:2.25rem}.m-0{margin:0}.m-auto{margin:auto}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.mx-auto{margin-left:auto;margin-right:auto}.-my-2{margin-top:-.5rem;margin-bottom:-.5rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.mt-16{margin-top:4rem}.-mr-1{margin-right:-.25rem}.-ml-1{margin-left:-.25rem}.-mt-4{margin-top:-1rem}.-ml-4{margin-left:-1rem}.-mr-14{margin-right:-3.5rem}.max-w-xs{max-width:20rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.min-h-screen{min-height:100vh}.min-w-full{min-width:100%}.object-cover{-o-object-fit:cover;object-fit:cover}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.opacity-100{opacity:1}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-y-scroll{overflow-y:scroll}.p-1{padding:.25rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.pt-0{padding-top:0}.pl-0{padding-left:0}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pb-20{padding-bottom:5rem}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{right:0;left:0}.inset-0,.inset-y-0{top:0;bottom:0}.inset-x-0{right:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow-xs{box-shadow:0 0 0 1px rgba(0,0,0,.05)}.shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(118,169,250,.45)}.focus\:shadow-outline-blue:focus{box-shadow:0 0 0 3px rgba(164,202,254,.45)}.fill-current{fill:currentColor}.table-auto{table-layout:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#9fa6b2;color:rgba(159,166,178,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.text-red-400{--text-opacity:1;color:#f98080;color:rgba(249,128,128,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e02424;color:rgba(224,36,36,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#057a55;color:rgba(5,122,85,var(--text-opacity))}.text-blue-600{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-gray-300:hover{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.hover\:text-gray-500:hover{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.hover\:text-gray-600:hover{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.hover\:text-gray-700:hover{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.hover\:text-gray-800:hover{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.hover\:text-blue-600:hover{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-indigo-900:hover{--text-opacity:1;color:#362f78;color:rgba(54,47,120,var(--text-opacity))}.focus\:text-gray-500:focus{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.focus\:text-gray-600:focus{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.focus\:text-gray-900:focus{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.active\:text-gray-800:active{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.underline{text-decoration:underline}.line-through{text-decoration:line-through}.focus\:underline:focus,.hover\:underline:hover{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.whitespace-no-wrap{white-space:nowrap}.break-words{word-wrap:break-word;overflow-wrap:break-word}.break-all{word-break:break-all}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.w-0{width:0}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-48{width:12rem}.w-56{width:14rem}.w-64{width:16rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-full{width:100%}.z-0{z-index:0}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.gap-4{grid-gap:1rem;gap:1rem}.gap-5{grid-gap:1.25rem;gap:1.25rem}.gap-6{grid-gap:1.5rem;gap:1.5rem}.gap-8{grid-gap:2rem;gap:2rem}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.col-span-1{grid-column:span 1/span 1}.col-span-2{grid-column:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-6{grid-column:span 6/span 6}.col-span-12{grid-column:span 12/span 12}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.origin-top-right{transform-origin:top right}.scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.scale-100{--transform-scale-x:1;--transform-scale-y:1}.translate-x-0{--transform-translate-x:0}.-translate-x-full{--transform-translate-x:-100%}.translate-y-0{--transform-translate-y:0}.translate-y-4{--transform-translate-y:1rem}.transition-all{transition-property:all}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.transition-opacity{transition-property:opacity}.ease-linear{transition-timing-function:linear}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-75{transition-duration:75ms}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}@-webkit-keyframes spin{to{transform:rotate(1turn)}}@keyframes spin{to{transform:rotate(1turn)}}@-webkit-keyframes ping{75%,to{transform:scale(2);opacity:0}}@keyframes ping{75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{50%{opacity:.5}}@keyframes pulse{50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:inline-block{display:inline-block}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:hidden{display:none}.sm\:flex-row-reverse{flex-direction:row-reverse}.sm\:flex-no-wrap{flex-wrap:nowrap}.sm\:items-start{align-items:flex-start}.sm\:items-center{align-items:center}.sm\:justify-center{justify-content:center}.sm\:justify-between{justify-content:space-between}.sm\:flex-shrink-0{flex-shrink:0}.sm\:h-10{height:2.5rem}.sm\:h-screen{height:100vh}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-top:2rem;margin-bottom:2rem}.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mt-0{margin-top:0}.sm\:ml-3{margin-left:.75rem}.sm\:mt-4{margin-top:1rem}.sm\:ml-4{margin-left:1rem}.sm\:mt-6{margin-top:1.5rem}.sm\:ml-6{margin-left:1.5rem}.sm\:max-w-sm{max-width:24rem}.sm\:max-w-lg{max-width:32rem}.sm\:p-0{padding:0}.sm\:p-6{padding:1.5rem}.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:inset-0{top:0;right:0;bottom:0;left:0}.sm\:text-left{text-align:left}.sm\:align-middle{vertical-align:middle}.sm\:w-10{width:2.5rem}.sm\:w-auto{width:auto}.sm\:w-full{width:100%}.sm\:gap-4{grid-gap:1rem;gap:1rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:col-span-3{grid-column:span 3/span 3}.sm\:col-span-4{grid-column:span 4/span 4}.sm\:col-span-6{grid-column:span 6/span 6}.sm\:scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.sm\:scale-100{--transform-scale-x:1;--transform-scale-y:1}.sm\:translate-y-0{--transform-translate-y:0}}@media (min-width:768px){.md\:block{display:block}.md\:flex{display:flex}.md\:grid{display:grid}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:justify-between{justify-content:space-between}.md\:flex-shrink-0{flex-shrink:0}.md\:text-sm{font-size:.875rem}.md\:mt-0{margin-top:0}.md\:mr-2{margin-right:.5rem}.md\:ml-2{margin-left:.5rem}.md\:ml-6{margin-left:1.5rem}.md\:mt-10{margin-top:2.5rem}.md\:-mr-1{margin-right:-.25rem}.md\:max-w-3xl{max-width:48rem}.md\:p-24{padding:6rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:gap-6{grid-gap:1.5rem;gap:1.5rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:col-span-1{grid-column:span 1/span 1}.md\:col-span-2{grid-column:span 2/span 2}.md\:col-span-4{grid-column:span 4/span 4}.md\:col-span-5{grid-column:span 5/span 5}.md\:col-span-6{grid-column:span 6/span 6}.md\:col-start-2{grid-column-start:2}.md\:col-start-4{grid-column-start:4}}@media (min-width:1024px){.lg\:rounded-lg{border-radius:.5rem}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:items-center{align-items:center}.lg\:h-screen{height:100vh}.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:mt-24{margin-top:6rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:w-1\/4{width:25%}.lg\:w-1\/5{width:20%}.lg\:gap-4{grid-gap:1rem;gap:1rem}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:col-span-6{grid-column:span 6/span 6}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:col-span-8{grid-column:span 8/span 8}.lg\:col-start-3{grid-column-start:3}.lg\:col-start-4{grid-column-start:4}}@media (min-width:1280px){.xl\:mt-32{margin-top:8rem}.xl\:col-span-4{grid-column:span 4/span 4}.xl\:col-span-6{grid-column:span 6/span 6}.xl\:col-span-8{grid-column:span 8/span 8}.xl\:col-span-9{grid-column:span 9/span 9}.xl\:col-start-4{grid-column-start:4}}
\ No newline at end of file
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:Open Sans,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #d2d6dc}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.form-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7 7l3-3 3 3m0 6l-3 3-3-3' stroke='%239fa6b2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;background-repeat:no-repeat;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.375rem;padding:.5rem 2.5rem .5rem .75rem;font-size:1rem;line-height:1.5;background-position:right .5rem center;background-size:1.5em 1.5em}.form-select::-ms-expand{color:#9fa6b2;border:none}@media not print{.form-select::-ms-expand{display:none}}@media print and (-ms-high-contrast:active),print and (-ms-high-contrast:none){.form-select{padding-right:.75rem}}.form-select:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.707 7.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 00-1.414-1.414L7 8.586 5.707 7.293z'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-checkbox::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.25rem}.form-checkbox:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked:focus,.form-radio:checked{border-color:transparent}.form-radio:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E");background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-radio::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;border-radius:100%;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px}.form-radio:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-radio:checked:focus{border-color:transparent}.button{border-radius:.25rem;padding:.75rem 1rem;font-size:.875rem;line-height:1rem;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}button:disabled{opacity:.5;cursor:not-allowed}.button-primary{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-primary:hover{font-weight:600}.button-block{display:block;width:100%}.button-danger{--bg-opacity:1;background-color:#f05252;background-color:rgba(240,82,82,var(--bg-opacity));--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-danger:hover{--bg-opacity:1;background-color:#e02424;background-color:rgba(224,36,36,var(--bg-opacity))}.button-secondary{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.button-secondary:hover{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.button-link:hover{font-weight:600;text-decoration:underline}.button-link:focus{outline:2px solid transparent;outline-offset:2px;text-decoration:underline}.validation{border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));padding:.25rem .75rem}.validation-fail{border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.validation-fail,.validation-pass{--border-opacity:1;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));font-size:.875rem}.validation-pass{border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.input{align-items:center;border-width:1px;--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity));border-radius:.25rem;margin-top:.5rem;padding:.5rem 1rem;font-size:.875rem}.input:focus{outline:2px solid transparent;outline-offset:2px;--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.input-label{font-size:.875rem;--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.input-slim{padding-top:.5rem;padding-bottom:.5rem}.alert{padding:.75rem 1rem;font-size:.875rem;border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.alert-success{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.alert-failure{--border-opacity:1;border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.badge{display:inline-flex;align-items:center;padding:.125rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:500;line-height:1rem}.badge-light{background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.badge-light,.badge-primary{--bg-opacity:1;--text-opacity:1}.badge-primary{background-color:#c3ddfd;background-color:rgba(195,221,253,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}.badge-danger{background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity));color:#f05252;color:rgba(240,82,82,var(--text-opacity))}.badge-danger,.badge-success{--bg-opacity:1;--text-opacity:1}.badge-success{background-color:#def7ec;background-color:rgba(222,247,236,var(--bg-opacity));color:#0e9f6e;color:rgba(14,159,110,var(--text-opacity))}.badge-secondary{--bg-opacity:1;background-color:#252f3f;background-color:rgba(37,47,63,var(--bg-opacity));--text-opacity:1;color:#e5e7eb;color:rgba(229,231,235,var(--text-opacity))}.badge-warning{background-color:#feecdc;background-color:rgba(254,236,220,var(--bg-opacity));color:#ff5a1f;color:rgba(255,90,31,var(--text-opacity))}.badge-info,.badge-warning{--bg-opacity:1;--text-opacity:1}.badge-info{background-color:#e1effe;background-color:rgba(225,239,254,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}@media (min-width:640px){.dataTables_length{margin-top:1.25rem!important;margin-bottom:1.25rem!important}}@media (min-width:1024px){.dataTables_length{margin-top:1rem!important;margin-bottom:1rem!important}}.dataTables_length select{--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;font-size:.875rem!important;margin-left:.5rem!important;margin-right:.5rem!important;padding:.5rem!important}.dataTables_filter{margin-bottom:1rem}.dataTables_filter input{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;background-color:#fff!important;border-radius:.375rem!important;font-size:1rem!important;line-height:1.5!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;padding:.5rem 1rem!important;font-size:.875rem!important}@media (min-width:1024px){.dataTables_filter{margin-top:-3rem!important}}.dataTables_paginate{padding-bottom:1.5rem!important;padding-top:.5rem!important}.dataTables_paginate .paginate_button{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-duration:.15s!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;font-size:.875rem!important;line-height:1rem!important;font-weight:500!important;border-radius:.25rem!important;--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;margin-right:.25rem!important;padding:.5rem 1rem!important;cursor:pointer!important}.dataTables_paginate .current{--bg-opacity:1!important;background-color:#1c64f2!important;background-color:rgba(28,100,242,var(--bg-opacity))!important;--text-opacity:1!important;color:#fff!important;color:rgba(255,255,255,var(--text-opacity))!important}.dataTables_info{font-size:.875rem!important}.dataTables_empty{padding-top:1rem!important;padding-bottom:1rem!important}.pagination{display:flex!important;align-items:center!important}.pagination .page-link{margin-top:-1px!important;border-top-width:2px!important;border-color:transparent!important;padding-top:1rem!important;padding-left:1rem!important;padding-right:1rem!important;display:inline-flex!important;align-items:center!important;font-size:.875rem!important;line-height:1.25rem!important;font-weight:500!important;--text-opacity:1!important;color:#6b7280!important;color:rgba(107,114,128,var(--text-opacity))!important;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;transition-duration:.15s!important;cursor:pointer!important}.pagination .page-link:hover{--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important}.pagination .page-link:focus{outline:2px solid transparent;outline-offset:2px;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.pagination .active>span{--text-opacity:1!important;color:#1c64f2!important;color:rgba(28,100,242,var(--text-opacity))!important;--border-opacity:1!important;border-color:#1c64f2!important;border-color:rgba(28,100,242,var(--border-opacity))!important}.space-x-1>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.25rem*var(--space-x-reverse));margin-left:calc(0.25rem*(1 - var(--space-x-reverse)))}.space-x-2>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.5rem*var(--space-x-reverse));margin-left:calc(0.5rem*(1 - var(--space-x-reverse)))}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-50{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.bg-gray-500{--bg-opacity:1;background-color:#6b7280;background-color:rgba(107,114,128,var(--bg-opacity))}.bg-gray-600{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.bg-red-100{--bg-opacity:1;background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity))}.bg-blue-50{--bg-opacity:1;background-color:#ebf5ff;background-color:rgba(235,245,255,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#1c64f2;background-color:rgba(28,100,242,var(--bg-opacity))}.focus\:bg-gray-100:focus,.hover\:bg-gray-100:hover{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.focus\:bg-gray-600:focus{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.active\:bg-gray-50:active{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.border-collapse{border-collapse:collapse}.border-gray-100{--border-opacity:1;border-color:#f4f5f7;border-color:rgba(244,245,247,var(--border-opacity))}.border-gray-200{--border-opacity:1;border-color:#e5e7eb;border-color:rgba(229,231,235,var(--border-opacity))}.border-gray-300{--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity))}.border-red-300{--border-opacity:1;border-color:#f8b4b4;border-color:rgba(248,180,180,var(--border-opacity))}.border-red-400{--border-opacity:1;border-color:#f98080;border-color:rgba(249,128,128,var(--border-opacity))}.border-green-500{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#3f83f8;border-color:rgba(63,131,248,var(--border-opacity))}.group:hover .group-hover\:border-transparent{border-color:transparent}.hover\:border-gray-800:hover{--border-opacity:1;border-color:#252f3f;border-color:rgba(37,47,63,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#1c64f2;border-color:rgba(28,100,242,var(--border-opacity))}.focus\:border-blue-300:focus{--border-opacity:1;border-color:#a4cafe;border-color:rgba(164,202,254,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-0{border-width:0}.border-4{border-width:4px}.border{border-width:1px}.border-l-2{border-left-width:2px}.border-t{border-top-width:1px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.focus\:font-semibold:focus,.hover\:font-semibold:hover{font-weight:600}.h-0{height:0}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-32{height:8rem}.h-64{height:16rem}.h-auto{height:auto}.h-screen{height:100vh}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.leading-4{line-height:1rem}.leading-5{line-height:1.25rem}.leading-6{line-height:1.5rem}.leading-9{line-height:2.25rem}.m-0{margin:0}.m-auto{margin:auto}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.mx-auto{margin-left:auto;margin-right:auto}.-my-2{margin-top:-.5rem;margin-bottom:-.5rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.mt-16{margin-top:4rem}.-mr-1{margin-right:-.25rem}.-ml-1{margin-left:-.25rem}.-mt-4{margin-top:-1rem}.-ml-4{margin-left:-1rem}.-mr-14{margin-right:-3.5rem}.max-w-xs{max-width:20rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.min-h-screen{min-height:100vh}.min-w-full{min-width:100%}.object-cover{-o-object-fit:cover;object-fit:cover}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.opacity-100{opacity:1}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-y-scroll{overflow-y:scroll}.p-1{padding:.25rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.pt-0{padding-top:0}.pl-0{padding-left:0}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pb-20{padding-bottom:5rem}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{right:0;left:0}.inset-0,.inset-y-0{top:0;bottom:0}.inset-x-0{right:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow-xs{box-shadow:0 0 0 1px rgba(0,0,0,.05)}.shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(118,169,250,.45)}.focus\:shadow-outline-blue:focus{box-shadow:0 0 0 3px rgba(164,202,254,.45)}.fill-current{fill:currentColor}.table-auto{table-layout:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#9fa6b2;color:rgba(159,166,178,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.text-red-400{--text-opacity:1;color:#f98080;color:rgba(249,128,128,var(--text-opacity))}.text-red-500{--text-opacity:1;color:#f05252;color:rgba(240,82,82,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e02424;color:rgba(224,36,36,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#057a55;color:rgba(5,122,85,var(--text-opacity))}.text-blue-600{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-gray-300:hover{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.hover\:text-gray-500:hover{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.hover\:text-gray-600:hover{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.hover\:text-gray-700:hover{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.hover\:text-gray-800:hover{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.hover\:text-blue-600:hover{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-indigo-900:hover{--text-opacity:1;color:#362f78;color:rgba(54,47,120,var(--text-opacity))}.focus\:text-gray-500:focus{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.focus\:text-gray-600:focus{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.focus\:text-gray-900:focus{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.active\:text-gray-800:active{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.underline{text-decoration:underline}.line-through{text-decoration:line-through}.focus\:underline:focus,.hover\:underline:hover{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.whitespace-no-wrap{white-space:nowrap}.break-words{word-wrap:break-word;overflow-wrap:break-word}.break-all{word-break:break-all}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.w-0{width:0}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-48{width:12rem}.w-56{width:14rem}.w-64{width:16rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-full{width:100%}.z-0{z-index:0}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.gap-4{grid-gap:1rem;gap:1rem}.gap-5{grid-gap:1.25rem;gap:1.25rem}.gap-6{grid-gap:1.5rem;gap:1.5rem}.gap-8{grid-gap:2rem;gap:2rem}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.col-span-1{grid-column:span 1/span 1}.col-span-2{grid-column:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-6{grid-column:span 6/span 6}.col-span-8{grid-column:span 8/span 8}.col-span-12{grid-column:span 12/span 12}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.origin-top-right{transform-origin:top right}.scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.scale-100{--transform-scale-x:1;--transform-scale-y:1}.translate-x-0{--transform-translate-x:0}.-translate-x-full{--transform-translate-x:-100%}.translate-y-0{--transform-translate-y:0}.translate-y-4{--transform-translate-y:1rem}.transition-all{transition-property:all}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.transition-opacity{transition-property:opacity}.ease-linear{transition-timing-function:linear}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-75{transition-duration:75ms}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}@-webkit-keyframes spin{to{transform:rotate(1turn)}}@keyframes spin{to{transform:rotate(1turn)}}@-webkit-keyframes ping{75%,to{transform:scale(2);opacity:0}}@keyframes ping{75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{50%{opacity:.5}}@keyframes pulse{50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:inline-block{display:inline-block}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:hidden{display:none}.sm\:flex-row-reverse{flex-direction:row-reverse}.sm\:flex-no-wrap{flex-wrap:nowrap}.sm\:items-start{align-items:flex-start}.sm\:items-center{align-items:center}.sm\:justify-center{justify-content:center}.sm\:justify-between{justify-content:space-between}.sm\:flex-shrink-0{flex-shrink:0}.sm\:h-10{height:2.5rem}.sm\:h-screen{height:100vh}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-top:2rem;margin-bottom:2rem}.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mt-0{margin-top:0}.sm\:ml-3{margin-left:.75rem}.sm\:mt-4{margin-top:1rem}.sm\:ml-4{margin-left:1rem}.sm\:mt-6{margin-top:1.5rem}.sm\:ml-6{margin-left:1.5rem}.sm\:max-w-sm{max-width:24rem}.sm\:max-w-lg{max-width:32rem}.sm\:p-0{padding:0}.sm\:p-6{padding:1.5rem}.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:inset-0{top:0;right:0;bottom:0;left:0}.sm\:text-left{text-align:left}.sm\:align-middle{vertical-align:middle}.sm\:w-10{width:2.5rem}.sm\:w-auto{width:auto}.sm\:w-full{width:100%}.sm\:gap-4{grid-gap:1rem;gap:1rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:col-span-3{grid-column:span 3/span 3}.sm\:col-span-4{grid-column:span 4/span 4}.sm\:col-span-6{grid-column:span 6/span 6}.sm\:scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.sm\:scale-100{--transform-scale-x:1;--transform-scale-y:1}.sm\:translate-y-0{--transform-translate-y:0}}@media (min-width:768px){.md\:block{display:block}.md\:flex{display:flex}.md\:grid{display:grid}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:justify-between{justify-content:space-between}.md\:flex-shrink-0{flex-shrink:0}.md\:text-sm{font-size:.875rem}.md\:mt-0{margin-top:0}.md\:mr-2{margin-right:.5rem}.md\:ml-2{margin-left:.5rem}.md\:ml-6{margin-left:1.5rem}.md\:mt-10{margin-top:2.5rem}.md\:-mr-1{margin-right:-.25rem}.md\:max-w-3xl{max-width:48rem}.md\:p-24{padding:6rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:gap-6{grid-gap:1.5rem;gap:1.5rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:col-span-1{grid-column:span 1/span 1}.md\:col-span-2{grid-column:span 2/span 2}.md\:col-span-4{grid-column:span 4/span 4}.md\:col-span-5{grid-column:span 5/span 5}.md\:col-span-6{grid-column:span 6/span 6}.md\:col-start-2{grid-column-start:2}.md\:col-start-4{grid-column-start:4}}@media (min-width:1024px){.lg\:rounded-lg{border-radius:.5rem}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:items-center{align-items:center}.lg\:h-screen{height:100vh}.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:mt-24{margin-top:6rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:w-1\/4{width:25%}.lg\:w-1\/5{width:20%}.lg\:gap-4{grid-gap:1rem;gap:1rem}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:col-span-6{grid-column:span 6/span 6}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:col-span-8{grid-column:span 8/span 8}.lg\:col-start-3{grid-column-start:3}.lg\:col-start-4{grid-column-start:4}}@media (min-width:1280px){.xl\:mt-32{margin-top:8rem}.xl\:col-span-4{grid-column:span 4/span 4}.xl\:col-span-6{grid-column:span 6/span 6}.xl\:col-span-8{grid-column:span 8/span 8}.xl\:col-span-9{grid-column:span 9/span 9}.xl\:col-start-4{grid-column-start:4}}
\ No newline at end of file
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index b2050020b4b2..cff448c2b916 100755
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -1,6 +1,6 @@
 {
     "/js/app.js": "/js/app.js?id=696e8203d5e8e7cf5ff5",
-    "/css/app.css": "/css/app.css?id=f4c07fdabcbe50c9f4be",
+    "/css/app.css": "/css/app.css?id=3ab7ce803b68a6e66464",
     "/js/clients/invoices/action-selectors.js": "/js/clients/invoices/action-selectors.js?id=a09bb529b8e1826f13b4",
     "/js/clients/invoices/payment.js": "/js/clients/invoices/payment.js?id=8ce8955ba775ea5f47d1",
     "/js/clients/linkify-urls.js": "/js/clients/linkify-urls.js?id=0dc8c34010d09195d2f7",
diff --git a/resources/lang/en/texts.php b/resources/lang/en/texts.php
index a2642657dead..75e6505f669c 100644
--- a/resources/lang/en/texts.php
+++ b/resources/lang/en/texts.php
@@ -4286,6 +4286,7 @@ $LANG = array(
     'user_created_user' => ':user created :created_user at :time',
     'company_deleted' => 'Company deleted',
     'company_deleted_body' => 'Company [ :company ] was deleted by :user',
+    'expiry_date' => 'Expiry date',
 );
 
 return $LANG;
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
new file mode 100644
index 000000000000..bd57d1a5d8bc
--- /dev/null
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -0,0 +1,183 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' =>
+ctrans('texts.credit_card')])
+
+@section('gateway_head')
+    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
+    <script src="{{ asset('js/clients/payments/card-js.min.js') }}"></script>
+    <link href="{{ asset('css/card-js.min.css') }}" rel="stylesheet" type="text/css">
+@endsection
+
+@section('gateway_content')
+    <form action="{{ route('client.payments.response') }}" method="post" id="server-response">
+        @csrf
+        <input type="hidden" name="gateway_response">
+        <input type="hidden" name="store_card">
+        <input type="hidden" name="payment_hash" value="{{ $payment_hash }}">
+
+        <input type="hidden" name="company_gateway_id" value="{{ $gateway->getCompanyGatewayId() }}">
+        <input type="hidden" name="payment_method_id" value="{{ $payment_method_id }}">
+
+        <input type="hidden" name="token">
+    </form>
+
+    <div class="alert alert-failure mb-4" hidden id="errors"></div>
+
+    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.payment_type')])
+        {{ ctrans('texts.credit_card') }}
+    @endcomponent
+
+    @include('portal.ninja2020.gateways.includes.payment_details')
+
+    @component('portal.ninja2020.components.general.card-element-single')
+        <div class="flex flex-col">
+            <label for="card-number">
+                <span class="text-xs text-gray-900 uppercase">{{ ctrans('texts.card_number') }}</span>
+                <div class="input w-full" type="text" id="card-number"></div>
+                <div class="text-xs text-red-500 mt-1 block" id="card-number-error"></div>
+            </label>
+
+            <label for="card-holder" class="block mt-2">
+                <span class="text-xs text-gray-900 uppercase">{{ ctrans('texts.name') }}</span>
+                <div class="input w-full" type="text" id="card-holder"></div>
+                <div class="text-xs text-red-500 mt-1 block" id="card-holder-error"></div>
+            </label>
+
+            <div class="grid grid-cols-12 gap-4 mt-2">
+                <label for="expiry-date" class="col-span-4">
+                    <span class="text-xs text-gray-900 uppercase">{{ ctrans('texts.expiry_date') }}</span>
+                    <div class="input w-full" type="text" id="expiry-date"></div>
+                    <div class="text-xs text-red-500 mt-1 block" id="expiry-date-error"></div>
+                </label>
+
+                <label for="cvv" class="col-span-8">
+                    <span class="text-xs text-gray-900 uppercase">{{ ctrans('texts.cvv') }}</span>
+                    <div class="input w-full border" type="text" id="cvv"></div>
+                    <div class="text-xs text-red-500 mt-1 block" id="cvv-error"></div>
+                </label>
+            </div>
+        </div>
+    @endcomponent
+
+    @include('portal.ninja2020.gateways.includes.pay_now')
+@endsection
+
+@section('gateway_footer')
+    <script src="https://js.mollie.com/v1/mollie.js"></script>
+
+    <script>
+        class _Mollie {
+            constructor() {
+                this.mollie = Mollie('pfl_sFDNzkEdyw', {
+                    testmode: true,
+                    locale: 'en_US',
+                });
+            }
+
+            createCardHolderInput() {
+                let cardHolder = this.mollie.createComponent("cardHolder");
+                cardHolder.mount("#card-holder");
+
+                let cardHolderError = document.getElementById("card-holder-error");
+
+                cardHolder.addEventListener("change", function(event) {
+                    if (event.error && event.touched) {
+                        cardHolderError.textContent = event.error;
+                    } else {
+                        cardHolderError.textContent = "";
+                    }
+                });
+
+                return this;
+            }
+
+            createCardNumberInput() {
+                let cardNumber = this.mollie.createComponent("cardNumber");
+                cardNumber.mount("#card-number");
+
+                let cardNumberError = document.getElementById("card-number-error");
+
+                cardNumber.addEventListener("change", function(event) {
+                    if (event.error && event.touched) {
+                        cardNumberError.textContent = event.error;
+                    } else {
+                        cardNumberError.textContent = "";
+                    }
+                });
+
+                return this;
+            }
+
+            createExpiryDateInput() {
+                let expiryDate = this.mollie.createComponent("expiryDate");
+                expiryDate.mount("#expiry-date");
+
+                let expiryDateError = document.getElementById("expiry-date-error");
+
+                expiryDate.addEventListener("change", function(event) {
+                    if (event.error && event.touched) {
+                        expiryDateError.textContent = event.error;
+                    } else {
+                        expiryDateError.textContent = "";
+                    }
+                });
+
+                return this;
+            }
+
+            createCvvInput() {
+                let verificationCode = this.mollie.createComponent("verificationCode");
+                verificationCode.mount("#cvv");
+
+                let verificationCodeError = document.getElementById(
+                    "cvv-error"
+                );
+
+                verificationCode.addEventListener("change", function(event) {
+                    if (event.error && event.touched) {
+                        verificationCodeError.textContent = event.error;
+                    } else {
+                        verificationCodeError.textContent = "";
+                    }
+                });
+
+                return this;
+            }
+
+            handlePayNowButton() {
+                document.getElementById('pay-now').disabled = true;
+
+                this.mollie.createToken().then(function(result) {
+                    let token = result.token;
+                    let error = result.error;
+
+                    if (error) {
+                        document.getElementById('pay-now').disabled = false;
+
+                        let errorsContainer = document.getElementById('errors');
+                        errorsContainer.innerText = error.message;
+                        errorsContainer.hidden = false;
+
+                        return;
+                    }
+
+                    document.querySelector('input[name=token]').value = token;
+                    document.getElementById('server-response').submit();
+                });
+            }
+
+            handle() {
+                this
+                    .createCardHolderInput()
+                    .createCardNumberInput()
+                    .createExpiryDateInput()
+                    .createCvvInput();
+
+                document
+                    .getElementById('pay-now')
+                    .addEventListener('click', () => this.handlePayNowButton());
+            }
+        }
+
+        new _Mollie().handle();
+    </script>
+@endsection

From 4818ea81bcd5cf1e5d43a80862dc05a9ee3ab9c6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 23 Jul 2021 16:17:32 +0200
Subject: [PATCH 21/60] Credit card: Pay with new credit card

---
 app/PaymentDrivers/Mollie/CreditCard.php | 72 ++++++++++++++++++++----
 1 file changed, 60 insertions(+), 12 deletions(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 3f227c76e634..63c425e2228a 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -4,12 +4,14 @@ namespace App\PaymentDrivers\Mollie;
 
 use App\Exceptions\PaymentFailed;
 use App\Http\Requests\ClientPortal\Payments\PaymentResponseRequest;
+use App\Jobs\Util\SystemLogger;
+use App\Models\GatewayType;
+use App\Models\Payment;
+use App\Models\PaymentType;
+use App\Models\SystemLog;
 use App\PaymentDrivers\MolliePaymentDriver;
 use Illuminate\Contracts\View\Factory;
 use Illuminate\View\View;
-use Illuminate\Contracts\Container\BindingResolutionException;
-
-use function Symfony\Component\String\b;
 
 class CreditCard
 {
@@ -38,26 +40,72 @@ class CreditCard
         return render('gateways.mollie.credit_card.pay', $data);
     }
 
+    /**
+     * Create a payment object.
+     * 
+     * @param PaymentResponseRequest $request 
+     * @return mixed 
+     */
     public function paymentResponse(PaymentResponseRequest $request)
     {
+        $amount = number_format((float) $this->mollie->payment_hash->data->amount_with_fee, 2, '.', '');
+
         try {
             $payment = $this->mollie->gateway->payments->create([
-                "amount" => [
-                    "currency" => "USD",
-                    "value" => "10.00"
+                'amount' => [
+                    'currency' => $this->mollie->client->currency()->code,
+                    'value' => $amount,
                 ],
-                "description" => "Order #12345",
-                "redirectUrl" => "https://webshop.example.org/order/12345/",
-                "webhookUrl"  => "https://webshop.example.org/mollie-webhook/",
+                'description' => \sprintf('Hash: %s', $this->mollie->payment_hash->hash),
+                'redirectUrl' => 'https://webshop.example.org/order/12345/',
+                'webhookUrl'  => 'https://webshop.example.org/mollie-webhook/',
+                'cardToken' => $request->token,
             ]);
 
-            if ($payment->status === 'open') {
-                return redirect($payment->getCheckoutUrl());
+            if ($payment->status === 'paid') {
+                $this->mollie->logSuccessfulGatewayResponse(
+                    ['response' => $payment, 'data' => $this->mollie->payment_hash],
+                    SystemLog::TYPE_MOLLIE
+                );
+
+                $this->processSuccessfulPayment($payment);
             }
+
+            if ($payment->status === 'open') {
+                // Handle redirect payment
+            }
+
+            dd($payment);
+
         } catch (\Exception $e) {
             throw new PaymentFailed($e->getMessage(), $e->getCode());
         }
+    }
 
-        dd($payment);
+    protected function processSuccessfulPayment(\Mollie\Api\Resources\Payment $payment)
+    {
+        // Check if storing credit card is enabled
+
+        $payment_hash = $this->mollie->payment_hash;
+
+        $data = [
+            'gateway_type_id' => GatewayType::CREDIT_CARD,
+            'amount' => array_sum(array_column($payment_hash->invoices(), 'amount')) + $payment_hash->fee_total,
+            'payment_type' => PaymentType::CREDIT_CARD_OTHER,
+            'transaction_reference' => $payment->id,
+        ];
+
+        $payment_record = $this->mollie->createPayment($data, Payment::STATUS_COMPLETED);
+
+        SystemLogger::dispatch(
+            ['response' => $payment, 'data' => $data],
+            SystemLog::CATEGORY_GATEWAY_RESPONSE,
+            SystemLog::EVENT_GATEWAY_SUCCESS,
+            SystemLog::TYPE_MOLLIE,
+            $this->mollie->client,
+            $this->mollie->client->company,
+        );
+
+        return redirect()->route('client.payments.show', ['payment' => $this->mollie->encodePrimaryKey($payment_record->id)]);
     }
 }

From 7dd7a6e4b15a2d6280e3b14a3ed00b5a69d547fe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 26 Jul 2021 17:03:15 +0200
Subject: [PATCH 22/60] Scaffold Mollie3dsController

---
 .../Gateways/Mollie3dsController.php          | 24 +++++++++++
 .../Gateways/Mollie/Mollie3dsRequest.php      | 40 +++++++++++++++++++
 2 files changed, 64 insertions(+)
 create mode 100644 app/Http/Controllers/Gateways/Mollie3dsController.php
 create mode 100644 app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php

diff --git a/app/Http/Controllers/Gateways/Mollie3dsController.php b/app/Http/Controllers/Gateways/Mollie3dsController.php
new file mode 100644
index 000000000000..7f6a0d9121dd
--- /dev/null
+++ b/app/Http/Controllers/Gateways/Mollie3dsController.php
@@ -0,0 +1,24 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace App\Http\Controllers\Gateways;
+
+use App\Http\Controllers\Controller;
+use App\Http\Requests\Gateways\Mollie\Mollie3dsRequest;
+
+class Mollie3dsController extends Controller
+{
+    public function index(Mollie3dsRequest $request)
+    {
+        dd($request->all());
+    }
+}
diff --git a/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php b/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php
new file mode 100644
index 000000000000..85415e6e8dc9
--- /dev/null
+++ b/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php
@@ -0,0 +1,40 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace App\Http\Requests\Gateways\Mollie;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class Mollie3dsRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return false;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            //
+        ];
+    }
+}

From 2501654fec6f5c6bbf96cea370ceab26506ff7e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 26 Jul 2021 17:03:28 +0200
Subject: [PATCH 23/60] Add withData() to PaymentHash

---
 app/Models/PaymentHash.php | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/app/Models/PaymentHash.php b/app/Models/PaymentHash.php
index e82845415eab..0839120f5a9a 100644
--- a/app/Models/PaymentHash.php
+++ b/app/Models/PaymentHash.php
@@ -20,7 +20,6 @@ class PaymentHash extends Model
     protected $casts = [
         'data' => 'object',
     ];
-
     
     public function invoices()
     {
@@ -41,4 +40,12 @@ class PaymentHash extends Model
     {
         return $this->belongsTo(Invoice::class, 'fee_invoice_id', 'id');
     }
+
+    public function withData(string $property, $value): PaymentHash
+    {
+        $this->data = array_merge((array) $this->data, [$property => $value]);
+        $this->save();
+
+        return $this;
+    }
 }

From 548405c4d8abd0c7608927c0904ac68e1dcb43bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 26 Jul 2021 17:03:40 +0200
Subject: [PATCH 24/60] Refactor payment with credit card

---
 app/PaymentDrivers/Mollie/CreditCard.php | 38 +++++++++++++++++++-----
 routes/web.php                           |  1 +
 2 files changed, 32 insertions(+), 7 deletions(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 63c425e2228a..c811f24fa0a7 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -4,12 +4,14 @@ namespace App\PaymentDrivers\Mollie;
 
 use App\Exceptions\PaymentFailed;
 use App\Http\Requests\ClientPortal\Payments\PaymentResponseRequest;
+use App\Jobs\Mail\PaymentFailureMailer;
 use App\Jobs\Util\SystemLogger;
 use App\Models\GatewayType;
 use App\Models\Payment;
 use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\MolliePaymentDriver;
+use App\Utils\Number;
 use Illuminate\Contracts\View\Factory;
 use Illuminate\View\View;
 
@@ -48,17 +50,21 @@ class CreditCard
      */
     public function paymentResponse(PaymentResponseRequest $request)
     {
-        $amount = number_format((float) $this->mollie->payment_hash->data->amount_with_fee, 2, '.', '');
+        $this->mollie->payment_hash->withData('gateway_type_id', GatewayType::CREDIT_CARD);
 
         try {
             $payment = $this->mollie->gateway->payments->create([
                 'amount' => [
                     'currency' => $this->mollie->client->currency()->code,
-                    'value' => $amount,
+                    'value' => Number::formatValue($this->mollie->payment_hash->data->amount_with_fee, $this->mollie->client->currency()),
                 ],
                 'description' => \sprintf('Hash: %s', $this->mollie->payment_hash->hash),
                 'redirectUrl' => 'https://webshop.example.org/order/12345/',
-                'webhookUrl'  => 'https://webshop.example.org/mollie-webhook/',
+                'webhookUrl'  => route('mollie.3ds_redirect', [
+                    'company_key' => $this->mollie->client->company->company_key,
+                    'company_gateway_id' => $this->mollie->company_gateway->hashed_id,
+                    'hash' => $this->mollie->payment_hash->hash,
+                ]),
                 'cardToken' => $request->token,
             ]);
 
@@ -72,12 +78,11 @@ class CreditCard
             }
 
             if ($payment->status === 'open') {
-                // Handle redirect payment
+                return redirect($payment->getCheckoutUrl());
             }
-
-            dd($payment);
-
         } catch (\Exception $e) {
+            $this->processUnsuccessfulPayment($e);
+
             throw new PaymentFailed($e->getMessage(), $e->getCode());
         }
     }
@@ -108,4 +113,23 @@ class CreditCard
 
         return redirect()->route('client.payments.show', ['payment' => $this->mollie->encodePrimaryKey($payment_record->id)]);
     }
+
+    public function processUnsuccessfulPayment(\Exception $e)
+    {
+        PaymentFailureMailer::dispatch(
+            $this->mollie->client,
+            $e->getMessage(),
+            $this->mollie->client->company,
+            $this->mollie->payment_hash->data->amount_with_fee
+        );
+
+        SystemLogger::dispatch(
+            $e->getMessage(),
+            SystemLog::CATEGORY_GATEWAY_RESPONSE,
+            SystemLog::EVENT_GATEWAY_FAILURE,
+            SystemLog::TYPE_MOLLIE,
+            $this->mollie->client,
+            $this->mollie->client->company,
+        );
+    }
 }
diff --git a/routes/web.php b/routes/web.php
index 3468a99ebbd9..8c3a8e85d0d3 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -42,3 +42,4 @@ Route::get('stripe/signup/{token}', 'StripeConnectController@initialize')->name(
 Route::get('stripe/completed', 'StripeConnectController@completed')->name('stripe_connect.return');
 
 Route::get('checkout/3ds_redirect/{company_key}/{company_gateway_id}/{hash}', 'Gateways\Checkout3dsController@index')->name('checkout.3ds_redirect');
+Route::get('mollie/3ds_redirect/{company_key}/{company_gateway_id}/{hash}', 'Gateways\Mollie3dsController@index')->name('mollie.3ds_redirect');

From 3d12fd80e8370155250ce247add5b9068947df03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Tue, 27 Jul 2021 11:46:12 +0200
Subject: [PATCH 25/60] wip

---
 app/PaymentDrivers/Mollie/CreditCard.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index c811f24fa0a7..c7495ca6b52a 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -74,7 +74,7 @@ class CreditCard
                     SystemLog::TYPE_MOLLIE
                 );
 
-                $this->processSuccessfulPayment($payment);
+               return $this->processSuccessfulPayment($payment);
             }
 
             if ($payment->status === 'open') {

From b7c248eec562b576306abaeab7012735b2cb7b61 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Tue, 27 Jul 2021 23:59:44 +0200
Subject: [PATCH 26/60] PayTrace improvements (#43)

* Refactor credit card payment JavaScript

* CreditCard.php: Rename $paytrace_driver to $paytrace

* Credit card: Support for token billing (frontend)

* Fixes for "save card" label

* Credit card: Authorize

* Allow PayTrace to be seeded from CreateSingleAccount

* Add PayTrace decrypted config to ninja.testvars

* Extract to separate JavaScript

* Scaffold Dusk test

* CreditCard -> CreditCardTest

* CreditCard -> CreditCardTest

* Scaffold pay with new card test

* Fixes for gateway_key in CreateSingleAccount

* Production builds
---
 app/Console/Commands/CreateSingleAccount.php  |  21 ++
 app/PaymentDrivers/PayTrace/CreditCard.php    |  50 ++---
 config/ninja.php                              |   3 +-
 public/css/app.css                            |   2 +-
 .../clients/payments/paytrace-credit-card.js  |   2 +
 .../paytrace-credit-card.js.LICENSE.txt       |   9 +
 public/mix-manifest.json                      |   3 +-
 .../clients/payments/paytrace-credit-card.js  | 186 +++++++++++++++++
 .../gateways/includes/save_card.blade.php     |   4 +-
 .../gateways/paytrace/authorize.blade.php     | 156 +++-----------
 .../ninja2020/gateways/paytrace/pay.blade.php | 197 +++---------------
 .../Gateways/PayTrace/CreditCardTest.php      |  62 ++++++
 webpack.mix.js                                |   4 +
 13 files changed, 367 insertions(+), 332 deletions(-)
 create mode 100644 public/js/clients/payments/paytrace-credit-card.js
 create mode 100644 public/js/clients/payments/paytrace-credit-card.js.LICENSE.txt
 create mode 100644 resources/js/clients/payments/paytrace-credit-card.js
 create mode 100644 tests/Browser/ClientPortal/Gateways/PayTrace/CreditCardTest.php

diff --git a/app/Console/Commands/CreateSingleAccount.php b/app/Console/Commands/CreateSingleAccount.php
index b53626595059..c24e53c98fe0 100644
--- a/app/Console/Commands/CreateSingleAccount.php
+++ b/app/Console/Commands/CreateSingleAccount.php
@@ -742,6 +742,27 @@ class CreateSingleAccount extends Command
             $cg->fees_and_limits = $fees_and_limits;
             $cg->save();
         }
+
+        if (config('ninja.testvars.paytrace.decrypted') && ($this->gateway == 'all' || $this->gateway == 'paytrace')) {
+            $cg = new CompanyGateway;
+            $cg->company_id = $company->id;
+            $cg->user_id = $user->id;
+            $cg->gateway_key = 'bbd736b3254b0aabed6ad7fda1298c88';
+            $cg->require_cvv = true;
+            $cg->require_billing_address = true;
+            $cg->require_shipping_address = true;
+            $cg->update_details = true;
+            $cg->config = encrypt(config('ninja.testvars.paytrace.decrypted'));
+            $cg->save();
+
+            $gateway_types = $cg->driver(new Client)->gatewayTypes();
+
+            $fees_and_limits = new stdClass;
+            $fees_and_limits->{$gateway_types[0]} = new FeesAndLimits;
+
+            $cg->fees_and_limits = $fees_and_limits;
+            $cg->save();
+        }
     }
 
     private function createRecurringInvoice($client)
diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index 692469c86d48..eb9fc34bba68 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -33,18 +33,18 @@ class CreditCard
 {
     use MakesHash;
 
-    public $paytrace_driver;
+    public $paytrace;
 
-    public function __construct(PaytracePaymentDriver $paytrace_driver)
+    public function __construct(PaytracePaymentDriver $paytrace)
     {
-        $this->paytrace_driver = $paytrace_driver;
+        $this->paytrace = $paytrace;
     }
 
     public function authorizeView($data)
     {
         
-        $data['client_key'] = $this->paytrace_driver->getAuthToken();
-        $data['gateway'] = $this->paytrace_driver;
+        $data['client_key'] = $this->paytrace->getAuthToken();
+        $data['gateway'] = $this->paytrace;
 
         return render('gateways.paytrace.authorize', $data);
     }
@@ -94,11 +94,11 @@ class CreditCard
             'customer_id' => Str::random(32),
             'hpf_token' => $data['HPF_Token'],
             'enc_key' => $data['enc_key'],
-            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
+            'integrator_id' =>  $this->paytrace->company_gateway->getConfigField('integratorId'),
             'billing_address' => $this->buildBillingAddress(),
         ];
 
-        $response = $this->paytrace_driver->gatewayRequest('/v1/customer/pt_protect_create', $post_data);
+        $response = $this->paytrace->gatewayRequest('/v1/customer/pt_protect_create', $post_data);
 
         $cgt = [];
         $cgt['token'] = $response->customer_id;
@@ -115,15 +115,15 @@ class CreditCard
 
         $cgt['payment_meta'] = $payment_meta;
 
-        $token = $this->paytrace_driver->storeGatewayToken($cgt, []);
+        $token = $this->paytrace->storeGatewayToken($cgt, []);
 
         return $response;
     }
 
     private function getCustomerProfile($customer_id)
     {
-        $profile = $this->paytrace_driver->gatewayRequest('/v1/customer/export', [
-            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
+        $profile = $this->paytrace->gatewayRequest('/v1/customer/export', [
+            'integrator_id' =>  $this->paytrace->company_gateway->getConfigField('integratorId'),
             'customer_id' => $customer_id,
             // 'include_bin' => true,
         ]);
@@ -135,19 +135,19 @@ class CreditCard
     private function buildBillingAddress()
     {
         return [
-                'name' => $this->paytrace_driver->client->present()->name(),
-                'street_address' => $this->paytrace_driver->client->address1,
-                'city' => $this->paytrace_driver->client->city,
-                'state' => $this->paytrace_driver->client->state,
-                'zip' => $this->paytrace_driver->client->postal_code
+                'name' => $this->paytrace->client->present()->name(),
+                'street_address' => $this->paytrace->client->address1,
+                'city' => $this->paytrace->client->city,
+                'state' => $this->paytrace->client->state,
+                'zip' => $this->paytrace->client->postal_code
             ];
     }
 
     public function paymentView($data)
     {
 
-        $data['client_key'] = $this->paytrace_driver->getAuthToken();
-        $data['gateway'] = $this->paytrace_driver;
+        $data['client_key'] = $this->paytrace->getAuthToken();
+        $data['gateway'] = $this->paytrace;
 
         return render('gateways.paytrace.pay', $data);
 
@@ -171,13 +171,13 @@ class CreditCard
         $data = [
             'hpf_token' => $response_array['HPF_Token'],
             'enc_key' => $response_array['enc_key'],
-            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
+            'integrator_id' =>  $this->paytrace->company_gateway->getConfigField('integratorId'),
             'billing_address' => $this->buildBillingAddress(),
             'amount' => $request->input('amount_with_fee'),
             'invoice_id' => $this->harvestInvoiceId(),
         ];        
 
-        $response = $this->paytrace_driver->gatewayRequest('/v1/transactions/sale/pt_protect', $data);
+        $response = $this->paytrace->gatewayRequest('/v1/transactions/sale/pt_protect', $data);
 
         if($response->success)
             return $this->processSuccessfulPayment($response);
@@ -195,10 +195,10 @@ class CreditCard
             'amount' => $request->input('amount_with_fee'),
         ];
 
-        $response = $this->paytrace_driver->gatewayRequest('/v1/transactions/sale/by_customer', $data);
+        $response = $this->paytrace->gatewayRequest('/v1/transactions/sale/by_customer', $data);
 
         if($response->success){
-            $this->paytrace_driver->logSuccessfulGatewayResponse(['response' => $response, 'data' => $this->paytrace_driver->payment_hash], SystemLog::TYPE_PAYTRACE);
+            $this->paytrace->logSuccessfulGatewayResponse(['response' => $response, 'data' => $this->paytrace->payment_hash], SystemLog::TYPE_PAYTRACE);
 
             return $this->processSuccessfulPayment($response);
         }
@@ -208,7 +208,7 @@ class CreditCard
     
     private function harvestInvoiceId()
     {
-        $_invoice = collect($this->paytrace_driver->payment_hash->data->invoices)->first();
+        $_invoice = collect($this->paytrace->payment_hash->data->invoices)->first();
         $invoice = Invoice::withTrashed()->find($this->decodePrimaryKey($_invoice->invoice_id));
 
         if($invoice)
@@ -219,7 +219,7 @@ class CreditCard
 
     private function processSuccessfulPayment($response)
     {
-        $amount = array_sum(array_column($this->paytrace_driver->payment_hash->invoices(), 'amount')) + $this->paytrace_driver->payment_hash->fee_total;
+        $amount = array_sum(array_column($this->paytrace->payment_hash->invoices(), 'amount')) + $this->paytrace->payment_hash->fee_total;
 
         $payment_record = [];
         $payment_record['amount'] = $amount;
@@ -227,7 +227,7 @@ class CreditCard
         $payment_record['gateway_type_id'] = GatewayType::CREDIT_CARD;
         $payment_record['transaction_reference'] = $response->transaction_id;
 
-        $payment = $this->paytrace_driver->createPayment($payment_record, Payment::STATUS_COMPLETED);
+        $payment = $this->paytrace->createPayment($payment_record, Payment::STATUS_COMPLETED);
 
         return redirect()->route('client.payments.show', ['payment' => $this->encodePrimaryKey($payment->id)]);
 
@@ -249,7 +249,7 @@ class CreditCard
             'error_code' => $error_code,
         ];
 
-        return $this->paytrace_driver->processUnsuccessfulTransaction($data);
+        return $this->paytrace->processUnsuccessfulTransaction($data);
 
     }
 
diff --git a/config/ninja.php b/config/ninja.php
index ac835e3624f5..b5a98c5ef57a 100644
--- a/config/ninja.php
+++ b/config/ninja.php
@@ -86,7 +86,8 @@ return [
         'braintree' => env('BRAINTREE_KEYS', ''),
         'paytrace' => [
             'username' => env('PAYTRACE_U', ''),
-            'password' => env('PAYTRACE_P','')
+            'password' => env('PAYTRACE_P',''),
+            'decrypted' => env('PAYTRACE_KEYS', ''),
         ],
     ],
     'contact' => [
diff --git a/public/css/app.css b/public/css/app.css
index fbe3808e3bb2..3a3f11ebdf8a 100755
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -1 +1 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:Open Sans,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #d2d6dc}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.form-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7 7l3-3 3 3m0 6l-3 3-3-3' stroke='%239fa6b2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;background-repeat:no-repeat;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.375rem;padding:.5rem 2.5rem .5rem .75rem;font-size:1rem;line-height:1.5;background-position:right .5rem center;background-size:1.5em 1.5em}.form-select::-ms-expand{color:#9fa6b2;border:none}@media not print{.form-select::-ms-expand{display:none}}@media print and (-ms-high-contrast:active),print and (-ms-high-contrast:none){.form-select{padding-right:.75rem}}.form-select:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.707 7.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 00-1.414-1.414L7 8.586 5.707 7.293z'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-checkbox::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.25rem}.form-checkbox:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked:focus,.form-radio:checked{border-color:transparent}.form-radio:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E");background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-radio::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;border-radius:100%;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px}.form-radio:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-radio:checked:focus{border-color:transparent}.button{border-radius:.25rem;padding:.75rem 1rem;font-size:.875rem;line-height:1rem;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}button:disabled{opacity:.5;cursor:not-allowed}.button-primary{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-primary:hover{font-weight:600}.button-block{display:block;width:100%}.button-danger{--bg-opacity:1;background-color:#f05252;background-color:rgba(240,82,82,var(--bg-opacity));--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-danger:hover{--bg-opacity:1;background-color:#e02424;background-color:rgba(224,36,36,var(--bg-opacity))}.button-secondary{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.button-secondary:hover{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.button-link:hover{font-weight:600;text-decoration:underline}.button-link:focus{outline:2px solid transparent;outline-offset:2px;text-decoration:underline}.validation{border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));padding:.25rem .75rem}.validation-fail{border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.validation-fail,.validation-pass{--border-opacity:1;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));font-size:.875rem}.validation-pass{border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.input{align-items:center;border-width:1px;--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity));border-radius:.25rem;margin-top:.5rem;padding:.5rem 1rem;font-size:.875rem}.input:focus{outline:2px solid transparent;outline-offset:2px;--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.input-label{font-size:.875rem;--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.input-slim{padding-top:.5rem;padding-bottom:.5rem}.alert{padding:.75rem 1rem;font-size:.875rem;border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.alert-success{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.alert-failure{--border-opacity:1;border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.badge{display:inline-flex;align-items:center;padding:.125rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:500;line-height:1rem}.badge-light{background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.badge-light,.badge-primary{--bg-opacity:1;--text-opacity:1}.badge-primary{background-color:#c3ddfd;background-color:rgba(195,221,253,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}.badge-danger{background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity));color:#f05252;color:rgba(240,82,82,var(--text-opacity))}.badge-danger,.badge-success{--bg-opacity:1;--text-opacity:1}.badge-success{background-color:#def7ec;background-color:rgba(222,247,236,var(--bg-opacity));color:#0e9f6e;color:rgba(14,159,110,var(--text-opacity))}.badge-secondary{--bg-opacity:1;background-color:#252f3f;background-color:rgba(37,47,63,var(--bg-opacity));--text-opacity:1;color:#e5e7eb;color:rgba(229,231,235,var(--text-opacity))}.badge-warning{background-color:#feecdc;background-color:rgba(254,236,220,var(--bg-opacity));color:#ff5a1f;color:rgba(255,90,31,var(--text-opacity))}.badge-info,.badge-warning{--bg-opacity:1;--text-opacity:1}.badge-info{background-color:#e1effe;background-color:rgba(225,239,254,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}@media (min-width:640px){.dataTables_length{margin-top:1.25rem!important;margin-bottom:1.25rem!important}}@media (min-width:1024px){.dataTables_length{margin-top:1rem!important;margin-bottom:1rem!important}}.dataTables_length select{--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;font-size:.875rem!important;margin-left:.5rem!important;margin-right:.5rem!important;padding:.5rem!important}.dataTables_filter{margin-bottom:1rem}.dataTables_filter input{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;background-color:#fff!important;border-radius:.375rem!important;font-size:1rem!important;line-height:1.5!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;padding:.5rem 1rem!important;font-size:.875rem!important}@media (min-width:1024px){.dataTables_filter{margin-top:-3rem!important}}.dataTables_paginate{padding-bottom:1.5rem!important;padding-top:.5rem!important}.dataTables_paginate .paginate_button{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-duration:.15s!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;font-size:.875rem!important;line-height:1rem!important;font-weight:500!important;border-radius:.25rem!important;--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;margin-right:.25rem!important;padding:.5rem 1rem!important;cursor:pointer!important}.dataTables_paginate .current{--bg-opacity:1!important;background-color:#1c64f2!important;background-color:rgba(28,100,242,var(--bg-opacity))!important;--text-opacity:1!important;color:#fff!important;color:rgba(255,255,255,var(--text-opacity))!important}.dataTables_info{font-size:.875rem!important}.dataTables_empty{padding-top:1rem!important;padding-bottom:1rem!important}.pagination{display:flex!important;align-items:center!important}.pagination .page-link{margin-top:-1px!important;border-top-width:2px!important;border-color:transparent!important;padding-top:1rem!important;padding-left:1rem!important;padding-right:1rem!important;display:inline-flex!important;align-items:center!important;font-size:.875rem!important;line-height:1.25rem!important;font-weight:500!important;--text-opacity:1!important;color:#6b7280!important;color:rgba(107,114,128,var(--text-opacity))!important;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;transition-duration:.15s!important;cursor:pointer!important}.pagination .page-link:hover{--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important}.pagination .page-link:focus{outline:2px solid transparent;outline-offset:2px;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.pagination .active>span{--text-opacity:1!important;color:#1c64f2!important;color:rgba(28,100,242,var(--text-opacity))!important;--border-opacity:1!important;border-color:#1c64f2!important;border-color:rgba(28,100,242,var(--border-opacity))!important}.space-x-1>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.25rem*var(--space-x-reverse));margin-left:calc(0.25rem*(1 - var(--space-x-reverse)))}.space-x-2>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.5rem*var(--space-x-reverse));margin-left:calc(0.5rem*(1 - var(--space-x-reverse)))}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-50{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.bg-gray-500{--bg-opacity:1;background-color:#6b7280;background-color:rgba(107,114,128,var(--bg-opacity))}.bg-gray-600{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.bg-red-100{--bg-opacity:1;background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity))}.bg-blue-50{--bg-opacity:1;background-color:#ebf5ff;background-color:rgba(235,245,255,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#1c64f2;background-color:rgba(28,100,242,var(--bg-opacity))}.focus\:bg-gray-100:focus,.hover\:bg-gray-100:hover{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.focus\:bg-gray-600:focus{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.active\:bg-gray-50:active{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.border-collapse{border-collapse:collapse}.border-gray-100{--border-opacity:1;border-color:#f4f5f7;border-color:rgba(244,245,247,var(--border-opacity))}.border-gray-200{--border-opacity:1;border-color:#e5e7eb;border-color:rgba(229,231,235,var(--border-opacity))}.border-gray-300{--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity))}.border-red-300{--border-opacity:1;border-color:#f8b4b4;border-color:rgba(248,180,180,var(--border-opacity))}.border-red-400{--border-opacity:1;border-color:#f98080;border-color:rgba(249,128,128,var(--border-opacity))}.border-green-500{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#3f83f8;border-color:rgba(63,131,248,var(--border-opacity))}.group:hover .group-hover\:border-transparent{border-color:transparent}.hover\:border-gray-800:hover{--border-opacity:1;border-color:#252f3f;border-color:rgba(37,47,63,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#1c64f2;border-color:rgba(28,100,242,var(--border-opacity))}.focus\:border-blue-300:focus{--border-opacity:1;border-color:#a4cafe;border-color:rgba(164,202,254,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-0{border-width:0}.border-4{border-width:4px}.border{border-width:1px}.border-l-2{border-left-width:2px}.border-t{border-top-width:1px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.focus\:font-semibold:focus,.hover\:font-semibold:hover{font-weight:600}.h-0{height:0}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-32{height:8rem}.h-64{height:16rem}.h-auto{height:auto}.h-screen{height:100vh}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.leading-4{line-height:1rem}.leading-5{line-height:1.25rem}.leading-6{line-height:1.5rem}.leading-9{line-height:2.25rem}.m-0{margin:0}.m-auto{margin:auto}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.mx-auto{margin-left:auto;margin-right:auto}.-my-2{margin-top:-.5rem;margin-bottom:-.5rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.mt-16{margin-top:4rem}.-mr-1{margin-right:-.25rem}.-ml-1{margin-left:-.25rem}.-mt-4{margin-top:-1rem}.-ml-4{margin-left:-1rem}.-mr-14{margin-right:-3.5rem}.max-w-xs{max-width:20rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.min-h-screen{min-height:100vh}.min-w-full{min-width:100%}.object-cover{-o-object-fit:cover;object-fit:cover}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.opacity-100{opacity:1}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-y-scroll{overflow-y:scroll}.p-1{padding:.25rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.pt-0{padding-top:0}.pl-0{padding-left:0}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pb-20{padding-bottom:5rem}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{right:0;left:0}.inset-0,.inset-y-0{top:0;bottom:0}.inset-x-0{right:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow-xs{box-shadow:0 0 0 1px rgba(0,0,0,.05)}.shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(118,169,250,.45)}.focus\:shadow-outline-blue:focus{box-shadow:0 0 0 3px rgba(164,202,254,.45)}.fill-current{fill:currentColor}.table-auto{table-layout:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#9fa6b2;color:rgba(159,166,178,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.text-red-400{--text-opacity:1;color:#f98080;color:rgba(249,128,128,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e02424;color:rgba(224,36,36,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#057a55;color:rgba(5,122,85,var(--text-opacity))}.text-blue-600{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-gray-300:hover{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.hover\:text-gray-500:hover{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.hover\:text-gray-600:hover{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.hover\:text-gray-700:hover{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.hover\:text-gray-800:hover{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.hover\:text-blue-600:hover{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-indigo-900:hover{--text-opacity:1;color:#362f78;color:rgba(54,47,120,var(--text-opacity))}.focus\:text-gray-500:focus{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.focus\:text-gray-600:focus{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.focus\:text-gray-900:focus{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.active\:text-gray-800:active{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.underline{text-decoration:underline}.line-through{text-decoration:line-through}.focus\:underline:focus,.hover\:underline:hover{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.whitespace-no-wrap{white-space:nowrap}.break-words{word-wrap:break-word;overflow-wrap:break-word}.break-all{word-break:break-all}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.w-0{width:0}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-48{width:12rem}.w-56{width:14rem}.w-64{width:16rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-full{width:100%}.z-0{z-index:0}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.gap-4{grid-gap:1rem;gap:1rem}.gap-5{grid-gap:1.25rem;gap:1.25rem}.gap-6{grid-gap:1.5rem;gap:1.5rem}.gap-8{grid-gap:2rem;gap:2rem}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.col-span-1{grid-column:span 1/span 1}.col-span-2{grid-column:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-6{grid-column:span 6/span 6}.col-span-12{grid-column:span 12/span 12}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.origin-top-right{transform-origin:top right}.scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.scale-100{--transform-scale-x:1;--transform-scale-y:1}.translate-x-0{--transform-translate-x:0}.-translate-x-full{--transform-translate-x:-100%}.translate-y-0{--transform-translate-y:0}.translate-y-4{--transform-translate-y:1rem}.transition-all{transition-property:all}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.transition-opacity{transition-property:opacity}.ease-linear{transition-timing-function:linear}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-75{transition-duration:75ms}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}@-webkit-keyframes spin{to{transform:rotate(1turn)}}@keyframes spin{to{transform:rotate(1turn)}}@-webkit-keyframes ping{75%,to{transform:scale(2);opacity:0}}@keyframes ping{75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{50%{opacity:.5}}@keyframes pulse{50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:inline-block{display:inline-block}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:hidden{display:none}.sm\:flex-row-reverse{flex-direction:row-reverse}.sm\:flex-no-wrap{flex-wrap:nowrap}.sm\:items-start{align-items:flex-start}.sm\:items-center{align-items:center}.sm\:justify-center{justify-content:center}.sm\:justify-between{justify-content:space-between}.sm\:flex-shrink-0{flex-shrink:0}.sm\:h-10{height:2.5rem}.sm\:h-screen{height:100vh}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-top:2rem;margin-bottom:2rem}.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mt-0{margin-top:0}.sm\:ml-3{margin-left:.75rem}.sm\:mt-4{margin-top:1rem}.sm\:ml-4{margin-left:1rem}.sm\:mt-6{margin-top:1.5rem}.sm\:ml-6{margin-left:1.5rem}.sm\:max-w-sm{max-width:24rem}.sm\:max-w-lg{max-width:32rem}.sm\:p-0{padding:0}.sm\:p-6{padding:1.5rem}.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:inset-0{top:0;right:0;bottom:0;left:0}.sm\:text-left{text-align:left}.sm\:align-middle{vertical-align:middle}.sm\:w-10{width:2.5rem}.sm\:w-auto{width:auto}.sm\:w-full{width:100%}.sm\:gap-4{grid-gap:1rem;gap:1rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:col-span-3{grid-column:span 3/span 3}.sm\:col-span-4{grid-column:span 4/span 4}.sm\:col-span-6{grid-column:span 6/span 6}.sm\:scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.sm\:scale-100{--transform-scale-x:1;--transform-scale-y:1}.sm\:translate-y-0{--transform-translate-y:0}}@media (min-width:768px){.md\:block{display:block}.md\:flex{display:flex}.md\:grid{display:grid}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:justify-between{justify-content:space-between}.md\:flex-shrink-0{flex-shrink:0}.md\:text-sm{font-size:.875rem}.md\:mt-0{margin-top:0}.md\:mr-2{margin-right:.5rem}.md\:ml-2{margin-left:.5rem}.md\:ml-6{margin-left:1.5rem}.md\:mt-10{margin-top:2.5rem}.md\:-mr-1{margin-right:-.25rem}.md\:max-w-3xl{max-width:48rem}.md\:p-24{padding:6rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:gap-6{grid-gap:1.5rem;gap:1.5rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:col-span-1{grid-column:span 1/span 1}.md\:col-span-2{grid-column:span 2/span 2}.md\:col-span-4{grid-column:span 4/span 4}.md\:col-span-5{grid-column:span 5/span 5}.md\:col-span-6{grid-column:span 6/span 6}.md\:col-start-2{grid-column-start:2}.md\:col-start-4{grid-column-start:4}}@media (min-width:1024px){.lg\:rounded-lg{border-radius:.5rem}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:items-center{align-items:center}.lg\:h-screen{height:100vh}.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:mt-24{margin-top:6rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:w-1\/4{width:25%}.lg\:w-1\/5{width:20%}.lg\:gap-4{grid-gap:1rem;gap:1rem}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:col-span-6{grid-column:span 6/span 6}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:col-span-8{grid-column:span 8/span 8}.lg\:col-start-3{grid-column-start:3}.lg\:col-start-4{grid-column-start:4}}@media (min-width:1280px){.xl\:mt-32{margin-top:8rem}.xl\:col-span-4{grid-column:span 4/span 4}.xl\:col-span-6{grid-column:span 6/span 6}.xl\:col-span-8{grid-column:span 8/span 8}.xl\:col-span-9{grid-column:span 9/span 9}.xl\:col-start-4{grid-column-start:4}}
\ No newline at end of file
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:Open Sans,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #d2d6dc}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.form-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7 7l3-3 3 3m0 6l-3 3-3-3' stroke='%239fa6b2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;background-repeat:no-repeat;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.375rem;padding:.5rem 2.5rem .5rem .75rem;font-size:1rem;line-height:1.5;background-position:right .5rem center;background-size:1.5em 1.5em}.form-select::-ms-expand{color:#9fa6b2;border:none}@media not print{.form-select::-ms-expand{display:none}}@media print and (-ms-high-contrast:active),print and (-ms-high-contrast:none){.form-select{padding-right:.75rem}}.form-select:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.707 7.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 00-1.414-1.414L7 8.586 5.707 7.293z'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-checkbox::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px;border-radius:.25rem}.form-checkbox:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-checkbox:checked:focus,.form-radio:checked{border-color:transparent}.form-radio:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E");background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media not print{.form-radio::-ms-check{border-width:1px;color:transparent;background:inherit;border-color:inherit;border-radius:inherit}}.form-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;flex-shrink:0;border-radius:100%;height:1rem;width:1rem;color:#3f83f8;background-color:#fff;border-color:#d2d6dc;border-width:1px}.form-radio:focus{outline:none;box-shadow:0 0 0 3px rgba(164,202,254,.45);border-color:#a4cafe}.form-radio:checked:focus{border-color:transparent}.button{border-radius:.25rem;padding:.75rem 1rem;font-size:.875rem;line-height:1rem;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}button:disabled{opacity:.5;cursor:not-allowed}.button-primary{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-primary:hover{font-weight:600}.button-block{display:block;width:100%}.button-danger{--bg-opacity:1;background-color:#f05252;background-color:rgba(240,82,82,var(--bg-opacity));--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.button-danger:hover{--bg-opacity:1;background-color:#e02424;background-color:rgba(224,36,36,var(--bg-opacity))}.button-secondary{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.button-secondary:hover{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.button-link:hover{font-weight:600;text-decoration:underline}.button-link:focus{outline:2px solid transparent;outline-offset:2px;text-decoration:underline}.validation{border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));padding:.25rem .75rem}.validation-fail{border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.validation-fail,.validation-pass{--border-opacity:1;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));font-size:.875rem}.validation-pass{border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.input{align-items:center;border-width:1px;--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity));border-radius:.25rem;margin-top:.5rem;padding:.5rem 1rem;font-size:.875rem}.input:focus{outline:2px solid transparent;outline-offset:2px;--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.input-label{font-size:.875rem;--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.input-slim{padding-top:.5rem;padding-bottom:.5rem}.alert{padding:.75rem 1rem;font-size:.875rem;border-left-width:2px;margin-top:.5rem;margin-bottom:.25rem;--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.alert-success{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.alert-failure{--border-opacity:1;border-color:#f05252;border-color:rgba(240,82,82,var(--border-opacity))}.badge{display:inline-flex;align-items:center;padding:.125rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:500;line-height:1rem}.badge-light{background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity));color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.badge-light,.badge-primary{--bg-opacity:1;--text-opacity:1}.badge-primary{background-color:#c3ddfd;background-color:rgba(195,221,253,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}.badge-danger{background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity));color:#f05252;color:rgba(240,82,82,var(--text-opacity))}.badge-danger,.badge-success{--bg-opacity:1;--text-opacity:1}.badge-success{background-color:#def7ec;background-color:rgba(222,247,236,var(--bg-opacity));color:#0e9f6e;color:rgba(14,159,110,var(--text-opacity))}.badge-secondary{--bg-opacity:1;background-color:#252f3f;background-color:rgba(37,47,63,var(--bg-opacity));--text-opacity:1;color:#e5e7eb;color:rgba(229,231,235,var(--text-opacity))}.badge-warning{background-color:#feecdc;background-color:rgba(254,236,220,var(--bg-opacity));color:#ff5a1f;color:rgba(255,90,31,var(--text-opacity))}.badge-info,.badge-warning{--bg-opacity:1;--text-opacity:1}.badge-info{background-color:#e1effe;background-color:rgba(225,239,254,var(--bg-opacity));color:#3f83f8;color:rgba(63,131,248,var(--text-opacity))}@media (min-width:640px){.dataTables_length{margin-top:1.25rem!important;margin-bottom:1.25rem!important}}@media (min-width:1024px){.dataTables_length{margin-top:1rem!important;margin-bottom:1rem!important}}.dataTables_length select{--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;font-size:.875rem!important;margin-left:.5rem!important;margin-right:.5rem!important;padding:.5rem!important}.dataTables_filter{margin-bottom:1rem}.dataTables_filter input{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;background-color:#fff!important;border-radius:.375rem!important;font-size:1rem!important;line-height:1.5!important;align-items:center!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;border-radius:.25rem!important;margin-top:.5rem!important;padding:.5rem 1rem!important;font-size:.875rem!important}@media (min-width:1024px){.dataTables_filter{margin-top:-3rem!important}}.dataTables_paginate{padding-bottom:1.5rem!important;padding-top:.5rem!important}.dataTables_paginate .paginate_button{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-duration:.15s!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;--bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--bg-opacity))!important;border-width:1px!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important;font-size:.875rem!important;line-height:1rem!important;font-weight:500!important;border-radius:.25rem!important;--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;margin-right:.25rem!important;padding:.5rem 1rem!important;cursor:pointer!important}.dataTables_paginate .current{--bg-opacity:1!important;background-color:#1c64f2!important;background-color:rgba(28,100,242,var(--bg-opacity))!important;--text-opacity:1!important;color:#fff!important;color:rgba(255,255,255,var(--text-opacity))!important}.dataTables_info{font-size:.875rem!important}.dataTables_empty{padding-top:1rem!important;padding-bottom:1rem!important}.pagination{display:flex!important;align-items:center!important}.pagination .page-link{margin-top:-1px!important;border-top-width:2px!important;border-color:transparent!important;padding-top:1rem!important;padding-left:1rem!important;padding-right:1rem!important;display:inline-flex!important;align-items:center!important;font-size:.875rem!important;line-height:1.25rem!important;font-weight:500!important;--text-opacity:1!important;color:#6b7280!important;color:rgba(107,114,128,var(--text-opacity))!important;transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important;transition-duration:.15s!important;cursor:pointer!important}.pagination .page-link:hover{--text-opacity:1!important;color:#374151!important;color:rgba(55,65,81,var(--text-opacity))!important;--border-opacity:1!important;border-color:#d2d6dc!important;border-color:rgba(210,214,220,var(--border-opacity))!important}.pagination .page-link:focus{outline:2px solid transparent;outline-offset:2px;--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity));--border-opacity:1;border-color:#9fa6b2;border-color:rgba(159,166,178,var(--border-opacity))}.pagination .active>span{--text-opacity:1!important;color:#1c64f2!important;color:rgba(28,100,242,var(--text-opacity))!important;--border-opacity:1!important;border-color:#1c64f2!important;border-color:rgba(28,100,242,var(--border-opacity))!important}.space-x-1>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.25rem*var(--space-x-reverse));margin-left:calc(0.25rem*(1 - var(--space-x-reverse)))}.space-x-2>:not(template)~:not(template){--space-x-reverse:0;margin-right:calc(0.5rem*var(--space-x-reverse));margin-left:calc(0.5rem*(1 - var(--space-x-reverse)))}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-50{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#e5e7eb;background-color:rgba(229,231,235,var(--bg-opacity))}.bg-gray-500{--bg-opacity:1;background-color:#6b7280;background-color:rgba(107,114,128,var(--bg-opacity))}.bg-gray-600{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.bg-red-100{--bg-opacity:1;background-color:#fde8e8;background-color:rgba(253,232,232,var(--bg-opacity))}.bg-blue-50{--bg-opacity:1;background-color:#ebf5ff;background-color:rgba(235,245,255,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#1c64f2;background-color:rgba(28,100,242,var(--bg-opacity))}.focus\:bg-gray-100:focus,.hover\:bg-gray-100:hover{--bg-opacity:1;background-color:#f4f5f7;background-color:rgba(244,245,247,var(--bg-opacity))}.focus\:bg-gray-600:focus{--bg-opacity:1;background-color:#4b5563;background-color:rgba(75,85,99,var(--bg-opacity))}.active\:bg-gray-50:active{--bg-opacity:1;background-color:#f9fafb;background-color:rgba(249,250,251,var(--bg-opacity))}.border-collapse{border-collapse:collapse}.border-gray-100{--border-opacity:1;border-color:#f4f5f7;border-color:rgba(244,245,247,var(--border-opacity))}.border-gray-200{--border-opacity:1;border-color:#e5e7eb;border-color:rgba(229,231,235,var(--border-opacity))}.border-gray-300{--border-opacity:1;border-color:#d2d6dc;border-color:rgba(210,214,220,var(--border-opacity))}.border-red-300{--border-opacity:1;border-color:#f8b4b4;border-color:rgba(248,180,180,var(--border-opacity))}.border-red-400{--border-opacity:1;border-color:#f98080;border-color:rgba(249,128,128,var(--border-opacity))}.border-green-500{--border-opacity:1;border-color:#0e9f6e;border-color:rgba(14,159,110,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#3f83f8;border-color:rgba(63,131,248,var(--border-opacity))}.group:hover .group-hover\:border-transparent{border-color:transparent}.hover\:border-gray-800:hover{--border-opacity:1;border-color:#252f3f;border-color:rgba(37,47,63,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#1c64f2;border-color:rgba(28,100,242,var(--border-opacity))}.focus\:border-blue-300:focus{--border-opacity:1;border-color:#a4cafe;border-color:rgba(164,202,254,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-0{border-width:0}.border-4{border-width:4px}.border{border-width:1px}.border-l-2{border-left-width:2px}.border-t{border-top-width:1px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.focus\:font-semibold:focus,.hover\:font-semibold:hover{font-weight:600}.h-0{height:0}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-32{height:8rem}.h-64{height:16rem}.h-auto{height:auto}.h-screen{height:100vh}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.leading-4{line-height:1rem}.leading-5{line-height:1.25rem}.leading-6{line-height:1.5rem}.leading-9{line-height:2.25rem}.m-0{margin:0}.m-auto{margin:auto}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.mx-auto{margin-left:auto;margin-right:auto}.-my-2{margin-top:-.5rem;margin-bottom:-.5rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.mt-16{margin-top:4rem}.-mr-1{margin-right:-.25rem}.-ml-1{margin-left:-.25rem}.-mt-4{margin-top:-1rem}.-ml-4{margin-left:-1rem}.-mr-14{margin-right:-3.5rem}.max-w-xs{max-width:20rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.min-h-screen{min-height:100vh}.min-w-full{min-width:100%}.object-cover{-o-object-fit:cover;object-fit:cover}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.opacity-100{opacity:1}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-y-scroll{overflow-y:scroll}.p-1{padding:.25rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.pt-0{padding-top:0}.pl-0{padding-left:0}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pb-20{padding-bottom:5rem}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{right:0;left:0}.inset-0,.inset-y-0{top:0;bottom:0}.inset-x-0{right:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow-xs{box-shadow:0 0 0 1px rgba(0,0,0,.05)}.shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(118,169,250,.45)}.focus\:shadow-outline-blue:focus{box-shadow:0 0 0 3px rgba(164,202,254,.45)}.fill-current{fill:currentColor}.table-auto{table-layout:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#9fa6b2;color:rgba(159,166,178,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.text-red-400{--text-opacity:1;color:#f98080;color:rgba(249,128,128,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e02424;color:rgba(224,36,36,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#057a55;color:rgba(5,122,85,var(--text-opacity))}.text-blue-600{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-gray-300:hover{--text-opacity:1;color:#d2d6dc;color:rgba(210,214,220,var(--text-opacity))}.hover\:text-gray-500:hover{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.hover\:text-gray-600:hover{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.hover\:text-gray-700:hover{--text-opacity:1;color:#374151;color:rgba(55,65,81,var(--text-opacity))}.hover\:text-gray-800:hover{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.hover\:text-blue-600:hover{--text-opacity:1;color:#1c64f2;color:rgba(28,100,242,var(--text-opacity))}.hover\:text-indigo-900:hover{--text-opacity:1;color:#362f78;color:rgba(54,47,120,var(--text-opacity))}.focus\:text-gray-500:focus{--text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--text-opacity))}.focus\:text-gray-600:focus{--text-opacity:1;color:#4b5563;color:rgba(75,85,99,var(--text-opacity))}.focus\:text-gray-900:focus{--text-opacity:1;color:#161e2e;color:rgba(22,30,46,var(--text-opacity))}.active\:text-gray-800:active{--text-opacity:1;color:#252f3f;color:rgba(37,47,63,var(--text-opacity))}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.underline{text-decoration:underline}.line-through{text-decoration:line-through}.focus\:underline:focus,.hover\:underline:hover{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.whitespace-no-wrap{white-space:nowrap}.break-words{word-wrap:break-word;overflow-wrap:break-word}.break-all{word-break:break-all}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.w-0{width:0}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-48{width:12rem}.w-56{width:14rem}.w-64{width:16rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-full{width:100%}.w-screen{width:100vw}.z-0{z-index:0}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.gap-4{grid-gap:1rem;gap:1rem}.gap-5{grid-gap:1.25rem;gap:1.25rem}.gap-6{grid-gap:1.5rem;gap:1.5rem}.gap-8{grid-gap:2rem;gap:2rem}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.col-span-1{grid-column:span 1/span 1}.col-span-2{grid-column:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-6{grid-column:span 6/span 6}.col-span-12{grid-column:span 12/span 12}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.origin-top-right{transform-origin:top right}.scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.scale-100{--transform-scale-x:1;--transform-scale-y:1}.translate-x-0{--transform-translate-x:0}.-translate-x-full{--transform-translate-x:-100%}.translate-y-0{--transform-translate-y:0}.translate-y-4{--transform-translate-y:1rem}.transition-all{transition-property:all}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.transition-opacity{transition-property:opacity}.ease-linear{transition-timing-function:linear}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-75{transition-duration:75ms}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}@-webkit-keyframes spin{to{transform:rotate(1turn)}}@keyframes spin{to{transform:rotate(1turn)}}@-webkit-keyframes ping{75%,to{transform:scale(2);opacity:0}}@keyframes ping{75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{50%{opacity:.5}}@keyframes pulse{50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:inline-block{display:inline-block}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:hidden{display:none}.sm\:flex-row-reverse{flex-direction:row-reverse}.sm\:flex-no-wrap{flex-wrap:nowrap}.sm\:items-start{align-items:flex-start}.sm\:items-center{align-items:center}.sm\:justify-center{justify-content:center}.sm\:justify-between{justify-content:space-between}.sm\:flex-shrink-0{flex-shrink:0}.sm\:h-10{height:2.5rem}.sm\:h-screen{height:100vh}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-top:2rem;margin-bottom:2rem}.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mt-0{margin-top:0}.sm\:ml-3{margin-left:.75rem}.sm\:mt-4{margin-top:1rem}.sm\:ml-4{margin-left:1rem}.sm\:mt-6{margin-top:1.5rem}.sm\:ml-6{margin-left:1.5rem}.sm\:max-w-sm{max-width:24rem}.sm\:max-w-lg{max-width:32rem}.sm\:p-0{padding:0}.sm\:p-6{padding:1.5rem}.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:inset-0{top:0;right:0;bottom:0;left:0}.sm\:text-left{text-align:left}.sm\:align-middle{vertical-align:middle}.sm\:w-10{width:2.5rem}.sm\:w-auto{width:auto}.sm\:w-full{width:100%}.sm\:gap-4{grid-gap:1rem;gap:1rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:col-span-3{grid-column:span 3/span 3}.sm\:col-span-4{grid-column:span 4/span 4}.sm\:col-span-6{grid-column:span 6/span 6}.sm\:scale-95{--transform-scale-x:.95;--transform-scale-y:.95}.sm\:scale-100{--transform-scale-x:1;--transform-scale-y:1}.sm\:translate-y-0{--transform-translate-y:0}}@media (min-width:768px){.md\:block{display:block}.md\:flex{display:flex}.md\:grid{display:grid}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:justify-between{justify-content:space-between}.md\:flex-shrink-0{flex-shrink:0}.md\:text-sm{font-size:.875rem}.md\:mt-0{margin-top:0}.md\:mr-2{margin-right:.5rem}.md\:ml-2{margin-left:.5rem}.md\:ml-6{margin-left:1.5rem}.md\:mt-10{margin-top:2.5rem}.md\:-mr-1{margin-right:-.25rem}.md\:max-w-3xl{max-width:48rem}.md\:p-24{padding:6rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:gap-6{grid-gap:1.5rem;gap:1.5rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:col-span-1{grid-column:span 1/span 1}.md\:col-span-2{grid-column:span 2/span 2}.md\:col-span-4{grid-column:span 4/span 4}.md\:col-span-5{grid-column:span 5/span 5}.md\:col-span-6{grid-column:span 6/span 6}.md\:col-start-2{grid-column-start:2}.md\:col-start-4{grid-column-start:4}}@media (min-width:1024px){.lg\:rounded-lg{border-radius:.5rem}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:items-center{align-items:center}.lg\:h-screen{height:100vh}.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:mt-24{margin-top:6rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:w-1\/4{width:25%}.lg\:w-1\/5{width:20%}.lg\:gap-4{grid-gap:1rem;gap:1rem}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:col-span-6{grid-column:span 6/span 6}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:col-span-8{grid-column:span 8/span 8}.lg\:col-start-3{grid-column-start:3}.lg\:col-start-4{grid-column-start:4}}@media (min-width:1280px){.xl\:mt-32{margin-top:8rem}.xl\:col-span-4{grid-column:span 4/span 4}.xl\:col-span-6{grid-column:span 6/span 6}.xl\:col-span-8{grid-column:span 8/span 8}.xl\:col-span-9{grid-column:span 9/span 9}.xl\:col-start-4{grid-column-start:4}}
\ No newline at end of file
diff --git a/public/js/clients/payments/paytrace-credit-card.js b/public/js/clients/payments/paytrace-credit-card.js
new file mode 100644
index 000000000000..b9e91af4e42b
--- /dev/null
+++ b/public/js/clients/payments/paytrace-credit-card.js
@@ -0,0 +1,2 @@
+/*! For license information please see paytrace-credit-card.js.LICENSE.txt */
+!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=21)}({"0Swb":function(e,t){function n(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}(new(function(){function e(){var t;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.clientKey=null===(t=document.querySelector("meta[name=paytrace-client-key]"))||void 0===t?void 0:t.content}var t,r,o;return t=e,(r=[{key:"creditCardStyles",get:function(){return{font_color:"#111827",border_color:"rgba(210,214,220,1)",label_color:"#111827",label_size:"12pt",background_color:"white",border_style:"solid",font_size:"15pt",height:"30px",width:"100%"}}},{key:"codeStyles",get:function(){return{font_color:"#111827",border_color:"rgba(210,214,220,1)",label_color:"#111827",label_size:"12pt",background_color:"white",border_style:"solid",font_size:"15pt",height:"30px",width:"300px"}}},{key:"expStyles",get:function(){return{font_color:"#111827",border_color:"rgba(210,214,220,1)",label_color:"#111827",label_size:"12pt",background_color:"white",border_style:"solid",font_size:"15pt",height:"30px",width:"85px",type:"dropdown"}}},{key:"updatePayTraceLabels",value:function(){window.PTPayment.getControl("securityCode").label.text(document.querySelector("meta[name=ctrans-cvv]").content),window.PTPayment.getControl("creditCard").label.text(document.querySelector("meta[name=ctrans-card_number]").content),window.PTPayment.getControl("expiration").label.text(document.querySelector("meta[name=ctrans-expires]").content)}},{key:"setupPayTrace",value:function(){return window.PTPayment.setup({styles:{code:this.codeStyles,cc:this.creditCardStyles,exp:this.expStyles},authorization:{clientKey:this.clientKey}})}},{key:"handlePaymentWithCreditCard",value:function(e){var t=this;e.target.parentElement.disabled=!0,document.getElementById("errors").hidden=!0,window.PTPayment.validate((function(n){if(n.length>=1){var r=document.getElementById("errors");return r.textContent=n[0].description,r.hidden=!1,e.target.parentElement.disabled=!1}t.ptInstance.process().then((function(e){document.getElementById("HPF_Token").value=e.message.hpf_token,document.getElementById("enc_key").value=e.message.enc_key;var t=document.querySelector('input[name="token-billing-checkbox"]:checked');t&&(document.querySelector('input[name="store_card"]').value=t.value),document.getElementById("server_response").submit()})).catch((function(e){document.getElementById("errors").textContent=JSON.stringify(e),document.getElementById("errors").hidden=!1,console.log(e)}))}))}},{key:"handlePaymentWithToken",value:function(e){e.target.parentElement.disabled=!0,document.getElementById("server_response").submit()}},{key:"handle",value:function(){var e=this;this.setupPayTrace().then((function(t){var n;e.ptInstance=t,e.updatePayTraceLabels(),Array.from(document.getElementsByClassName("toggle-payment-with-token")).forEach((function(e){return e.addEventListener("click",(function(e){document.getElementById("paytrace--credit-card-container").classList.add("hidden"),document.getElementById("save-card--container").style.display="none",document.querySelector("input[name=token]").value=e.target.dataset.token}))})),null===(n=document.getElementById("toggle-payment-with-credit-card"))||void 0===n||n.addEventListener("click",(function(e){document.getElementById("paytrace--credit-card-container").classList.remove("hidden"),document.getElementById("save-card--container").style.display="grid",document.querySelector("input[name=token]").value=""})),document.getElementById("pay-now").addEventListener("click",(function(t){return""===document.querySelector("input[name=token]").value?e.handlePaymentWithCreditCard(t):e.handlePaymentWithToken(t)}))}))}}])&&n(t.prototype,r),o&&n(t,o),e}())).handle()},21:function(e,t,n){e.exports=n("0Swb")}});
\ No newline at end of file
diff --git a/public/js/clients/payments/paytrace-credit-card.js.LICENSE.txt b/public/js/clients/payments/paytrace-credit-card.js.LICENSE.txt
new file mode 100644
index 000000000000..6b30888ddb5b
--- /dev/null
+++ b/public/js/clients/payments/paytrace-credit-card.js.LICENSE.txt
@@ -0,0 +1,9 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index b2050020b4b2..03854059b5e4 100755
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -1,6 +1,6 @@
 {
     "/js/app.js": "/js/app.js?id=696e8203d5e8e7cf5ff5",
-    "/css/app.css": "/css/app.css?id=f4c07fdabcbe50c9f4be",
+    "/css/app.css": "/css/app.css?id=5d7e42fa72eef8af62f5",
     "/js/clients/invoices/action-selectors.js": "/js/clients/invoices/action-selectors.js?id=a09bb529b8e1826f13b4",
     "/js/clients/invoices/payment.js": "/js/clients/invoices/payment.js?id=8ce8955ba775ea5f47d1",
     "/js/clients/linkify-urls.js": "/js/clients/linkify-urls.js?id=0dc8c34010d09195d2f7",
@@ -11,6 +11,7 @@
     "/js/clients/payments/braintree-paypal.js": "/js/clients/payments/braintree-paypal.js?id=c35db3cbb65806ab6a8a",
     "/js/clients/payments/card-js.min.js": "/js/clients/payments/card-js.min.js?id=5469146cd629ea1b5c20",
     "/js/clients/payments/checkout-credit-card.js": "/js/clients/payments/checkout-credit-card.js?id=065e5450233cc5b47020",
+    "/js/clients/payments/paytrace-credit-card.js": "/js/clients/payments/paytrace-credit-card.js?id=c8d3808a4c02d1392e96",
     "/js/clients/payments/stripe-ach.js": "/js/clients/payments/stripe-ach.js?id=81c2623fc1e5769b51c7",
     "/js/clients/payments/stripe-alipay.js": "/js/clients/payments/stripe-alipay.js?id=665ddf663500767f1a17",
     "/js/clients/payments/stripe-credit-card.js": "/js/clients/payments/stripe-credit-card.js?id=f1719b79a2bb274d3f64",
diff --git a/resources/js/clients/payments/paytrace-credit-card.js b/resources/js/clients/payments/paytrace-credit-card.js
new file mode 100644
index 000000000000..838c2333e50b
--- /dev/null
+++ b/resources/js/clients/payments/paytrace-credit-card.js
@@ -0,0 +1,186 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+class PayTraceCreditCard {
+    constructor() {
+        this.clientKey = document.querySelector(
+            'meta[name=paytrace-client-key]'
+        )?.content;
+    }
+
+    get creditCardStyles() {
+        return {
+            font_color: '#111827',
+            border_color: 'rgba(210,214,220,1)',
+            label_color: '#111827',
+            label_size: '12pt',
+            background_color: 'white',
+            border_style: 'solid',
+            font_size: '15pt',
+            height: '30px',
+            width: '100%',
+        };
+    }
+
+    get codeStyles() {
+        return {
+            font_color: '#111827',
+            border_color: 'rgba(210,214,220,1)',
+            label_color: '#111827',
+            label_size: '12pt',
+            background_color: 'white',
+            border_style: 'solid',
+            font_size: '15pt',
+            height: '30px',
+            width: '300px',
+        };
+    }
+
+    get expStyles() {
+        return {
+            font_color: '#111827',
+            border_color: 'rgba(210,214,220,1)',
+            label_color: '#111827',
+            label_size: '12pt',
+            background_color: 'white',
+            border_style: 'solid',
+            font_size: '15pt',
+            height: '30px',
+            width: '85px',
+            type: 'dropdown',
+        };
+    }
+
+    updatePayTraceLabels() {
+        window.PTPayment.getControl('securityCode').label.text(
+            document.querySelector('meta[name=ctrans-cvv]').content
+        );
+
+        window.PTPayment.getControl('creditCard').label.text(
+            document.querySelector('meta[name=ctrans-card_number]').content
+        );
+
+        window.PTPayment.getControl('expiration').label.text(
+            document.querySelector('meta[name=ctrans-expires]').content
+        );
+    }
+
+    setupPayTrace() {
+        return window.PTPayment.setup({
+            styles: {
+                code: this.codeStyles,
+                cc: this.creditCardStyles,
+                exp: this.expStyles,
+            },
+            authorization: {
+                clientKey: this.clientKey,
+            },
+        });
+    }
+
+    handlePaymentWithCreditCard(event) {
+        event.target.parentElement.disabled = true;
+        document.getElementById('errors').hidden = true;
+
+        window.PTPayment.validate((errors) => {
+            if (errors.length >= 1) {
+                let errorsContainer = document.getElementById('errors');
+
+                errorsContainer.textContent = errors[0].description;
+                errorsContainer.hidden = false;
+
+                return (event.target.parentElement.disabled = false);
+            }
+
+            this.ptInstance
+                .process()
+                .then((response) => {
+                    document.getElementById('HPF_Token').value =
+                        response.message.hpf_token;
+                    document.getElementById('enc_key').value =
+                        response.message.enc_key;
+
+                    let tokenBillingCheckbox = document.querySelector(
+                        'input[name="token-billing-checkbox"]:checked'
+                    );
+
+                    if (tokenBillingCheckbox) {
+                        document.querySelector(
+                            'input[name="store_card"]'
+                        ).value = tokenBillingCheckbox.value;
+                    }
+
+                    document.getElementById('server_response').submit();
+                })
+                .catch((error) => {
+                    document.getElementById(
+                        'errors'
+                    ).textContent = JSON.stringify(error);
+                    document.getElementById('errors').hidden = false;
+
+                    console.log(error);
+                });
+        });
+    }
+
+    handlePaymentWithToken(event) {
+        event.target.parentElement.disabled = true;
+
+        document.getElementById('server_response').submit();
+    }
+
+    handle() {
+        this.setupPayTrace().then((instance) => {
+            this.ptInstance = instance;
+            this.updatePayTraceLabels();
+
+            Array.from(
+                document.getElementsByClassName('toggle-payment-with-token')
+            ).forEach((element) =>
+                element.addEventListener('click', (element) => {
+                    document
+                        .getElementById('paytrace--credit-card-container')
+                        .classList.add('hidden');
+                    document.getElementById(
+                        'save-card--container'
+                    ).style.display = 'none';
+                    document.querySelector('input[name=token]').value =
+                        element.target.dataset.token;
+                })
+            );
+
+            document
+                .getElementById('toggle-payment-with-credit-card')
+                ?.addEventListener('click', (element) => {
+                    document
+                        .getElementById('paytrace--credit-card-container')
+                        .classList.remove('hidden');
+                    document.getElementById(
+                        'save-card--container'
+                    ).style.display = 'grid';
+                    document.querySelector('input[name=token]').value = '';
+                });
+
+            document
+                .getElementById('pay-now')
+                .addEventListener('click', (e) => {
+                    if (
+                        document.querySelector('input[name=token]').value === ''
+                    ) {
+                        return this.handlePaymentWithCreditCard(e);
+                    }
+
+                    return this.handlePaymentWithToken(e);
+                });
+        });
+    }
+}
+
+new PayTraceCreditCard().handle();
diff --git a/resources/views/portal/ninja2020/gateways/includes/save_card.blade.php b/resources/views/portal/ninja2020/gateways/includes/save_card.blade.php
index e6f7d55ea043..34a5b3671075 100644
--- a/resources/views/portal/ninja2020/gateways/includes/save_card.blade.php
+++ b/resources/views/portal/ninja2020/gateways/includes/save_card.blade.php
@@ -16,12 +16,12 @@
                        value="true"/>
                 <span class="ml-1 cursor-pointer">{{ ctrans('texts.yes') }}</span>
             </label>
-            <labecoml>
+            <label>
                 <input type="radio" class="form-radio cursor-pointer" name="token-billing-checkbox"
                        id="proxy_is_default"
                        value="false" checked />
                 <span class="ml-1 cursor-pointer">{{ ctrans('texts.no') }}</span>
-            </labecoml>
+            </label>
         </dd>
     </div>
 @else
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
index 2d8ce5482e6b..c84c6052171a 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/authorize.blade.php
@@ -1,145 +1,37 @@
-@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' => ctrans('texts.credit_card')])
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.payment_type_credit_card'), 'card_title'
+=> ctrans('texts.payment_type_credit_card')])
 
 @section('gateway_head')
+    <meta name="paytrace-client-key" content="{{ $client_key }}">
+    <meta name="ctrans-cvv" content="{{ ctrans('texts.cvv') }}">
+    <meta name="ctrans-card_number" content="{{ ctrans('texts.card_number') }}">
+    <meta name="ctrans-expires" content="{{ ctrans('texts.expires') }}">
 @endsection
 
 @section('gateway_content')
-    
-    @if(!Request::isSecure())
-        <p class="alert alert-failure">{{ ctrans('texts.https_required') }}</p>
-    @endif
+    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"
+        method="post" id="server_response">
+        @csrf
+        <input type="hidden" name="company_gateway_id" value="{{ $gateway->company_gateway->id }}">
+        <input type="txt" id=HPF_Token name= HPF_Token hidden>
+        <input type="txt" id=enc_key name= enc_key hidden>
+        <input type="text" name="token" hidden>
+    </form>
 
     <div class="alert alert-failure mb-4" hidden id="errors"></div>
-    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"  method="post" id="server_response">
-        @csrf
 
-    <div class="w-screen items-center">
+    @component('portal.ninja2020.components.general.card-element-single')
+        <div class="w-screen items-center" id="paytrace--credit-card-container">
+            <div id="pt_hpf_form"></div>
+        </div>
+    @endcomponent
 
-        <div id='pt_hpf_form'><!--iframe sensitive data payment fields inserted here--></div>
-
-    </div>
-
-    <input type="hidden" name="company_gateway_id" value="{{ $gateway->company_gateway->id }}">
-    <input type="txt" id=HPF_Token name= HPF_Token hidden>
-    <input type="txt" id=enc_key name= enc_key hidden>
-
-    <div class="bg-white px-4 py-5 flex justify-end">
-        <button
-            type="submit"
-            id="{{ $id ?? 'pay-now' }}"
-            class="button button-primary bg-primary {{ $class ?? '' }}">
-            <span>{{ ctrans('texts.add_payment_method') }}</span>
-        </button>
-    </div>
-
-    </form>
+    @component('portal.ninja2020.gateways.includes.pay_now')
+        {{ ctrans('texts.add_payment_method') }}
+    @endcomponent
 @endsection
 
 @section('gateway_footer')
-
-<script src='https://protect.paytrace.com/js/protect.min.js'></script>
-
-<script>
-
-  // Minimal Protect.js setup call
-PTPayment.setup({
-  styles:
-  {
-   'code': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'label_color':'#EF9F6D',
-    'label_size':'20px',
-    'background_color':'white',
-    'border_style':'dotted',
-    'font_size':'15pt',
-    'height':'30px',
-    'width':'100px'
- },
-   'cc': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'label_color':'#EF9F6D',
-    'label_size':'20px',
-    'background_color':'white',
-    'border_style':'solid',
-    'font_size':'15pt',
-    'height':'30px',
-    'width':'300px'
- },
-   'exp': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'label_color':'#EF9F6D',
-    'label_size':'20px',
-    'background_color':'white',
-    'border_style':'dashed',
-    'font_size':'15pt',
-    'height':'30px',
-    'width':'85px',
-    'type':'dropdown'
-  }
- },
-  authorization: { 'clientKey': "{!! $client_key !!}" }
-}).then(function(instance){
-
-
-    PTPayment.getControl("securityCode").label.text("{!! ctrans('texts.cvv')!!}");
-    PTPayment.getControl("creditCard").label.text("{!! ctrans('texts.card_number')!!}");
-    PTPayment.getControl("expiration").label.text("{!! ctrans('texts.expires')!!}");
-    //PTPayment.style({'cc': {'label_color': 'red'}});
-    //PTPayment.style({'code': {'label_color': 'red'}});
-    //PTPayment.style({'exp': {'label_color': 'red'}});
-    //PTPayment.style({'exp':{'type':'dropdown'}});
-
-    //PTPayment.theme('horizontal');
-    // this can be any event we chose. We will use the submit event and stop any default event handling and prevent event handling bubbling.
-    document.getElementById("server_response").addEventListener("submit",function(e){
-    e.preventDefault();
-    e.stopPropagation();
-
-    // To trigger the validation of sensitive data payment fields within the iframe before calling the tokenization process:
-    PTPayment.validate(function(validationErrors) {
-
-    if (validationErrors.length >= 1) {
-
-        let errors = document.getElementById('errors');
-
-        errors.textContent = '';
-        errors.textContent = validationErrors[0].description;
-        errors.hidden = false;
-
-    } else {
-     // no error so tokenize
-     instance.process()
-     .then( (r) => {
-        submitPayment(r);
-        }, (err) => {
-        handleError(err);
-        });
-    }
-    });
-
-    });
-
-});
-
-
-function handleError(err){
-    document.write(JSON.stringify(err));
-}
-
-function submitPayment(r){
-
-  var hpf_token = document.getElementById("HPF_Token");
-  var enc_key = document.getElementById("enc_key");
-  hpf_token.value = r.message.hpf_token;
-  enc_key.value = r.message.enc_key;
-
-  document.getElementById("server_response").submit();
-
-}
-
-</script>
-
+    <script src="https://protect.paytrace.com/js/protect.min.js"></script>
+    <script src="{{ asset('js/clients/payments/paytrace-credit-card.js') }}"></script>
 @endsection
diff --git a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
index 4535639e43d4..d7e752fea647 100644
--- a/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/paytrace/pay.blade.php
@@ -1,7 +1,11 @@
-@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.payment_type_credit_card'), 'card_title' => ctrans('texts.payment_type_credit_card')])
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.payment_type_credit_card'), 'card_title'
+=> ctrans('texts.payment_type_credit_card')])
 
 @section('gateway_head')
-
+    <meta name="paytrace-client-key" content="{{ $client_key }}">
+    <meta name="ctrans-cvv" content="{{ ctrans('texts.cvv') }}">
+    <meta name="ctrans-card_number" content="{{ ctrans('texts.card_number') }}">
+    <meta name="ctrans-expires" content="{{ ctrans('texts.expires') }}">
 @endsection
 
 @section('gateway_content')
@@ -10,12 +14,12 @@
         <input type="hidden" name="payment_hash" value="{{ $payment_hash }}">
         <input type="hidden" name="company_gateway_id" value="{{ $gateway->company_gateway->id }}">
         <input type="hidden" name="payment_method_id" value="1">
-        <input type="hidden" name="token" id="token"/>
-        <input type="hidden" name="store_card" id="store_card"/>
-        <input type="hidden" name="amount_with_fee" id="amount_with_fee" value="{{ $total['amount_with_fee'] }}"/>
-        <input type="txt" id=HPF_Token name= HPF_Token hidden>
-        <input type="txt" id=enc_key name= enc_key hidden>
-
+        <input type="hidden" name="token" id="token" />
+        <input type="hidden" name="store_card" id="store_card" />
+        <input type="hidden" name="amount_with_fee" id="amount_with_fee" value="{{ $total['amount_with_fee'] }}" />
+        <input type="txt" id="HPF_Token" name="HPF_Token" hidden>
+        <input type="txt" id="enc_key" name="enc_key" hidden>
+    </form>
 
     <div class="alert alert-failure mb-4" hidden id="errors"></div>
 
@@ -26,182 +30,35 @@
     @include('portal.ninja2020.gateways.includes.payment_details')
 
     @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.pay_with')])
-        @if(count($tokens) > 0)
-            @foreach($tokens as $token)
+        @if (count($tokens) > 0)
+            @foreach ($tokens as $token)
                 <label class="mr-4">
-                    <input
-                        type="radio"
-                        data-token="{{ $token->hashed_id }}"
-                        name="payment-type"
-                        class="form-radio cursor-pointer toggle-payment-with-token"/>
+                    <input type="radio" data-token="{{ $token->hashed_id }}" name="payment-type"
+                        class="form-radio cursor-pointer toggle-payment-with-token" />
                     <span class="ml-1 cursor-pointer">{{ optional($token->meta)->last4 }}</span>
                 </label>
             @endforeach
         @endisset
-
+        
         <label>
-            <input
-                type="radio"
-                id="toggle-payment-with-credit-card"
-                class="form-radio cursor-pointer"
-                name="payment-type"
-                checked/>
+            <input type="radio" id="toggle-payment-with-credit-card" class="form-radio cursor-pointer" name="payment-type"
+                checked />
             <span class="ml-1 cursor-pointer">{{ __('texts.new_card') }}</span>
         </label>
     @endcomponent
 
     @include('portal.ninja2020.gateways.includes.save_card')
 
-    <div class="w-screen items-center" id="paytrace--credit-card-container">
+    @component('portal.ninja2020.components.general.card-element-single')
+        <div class="w-screen items-center" id="paytrace--credit-card-container">
+            <div id="pt_hpf_form"></div>
+        </div>
+    @endcomponent
 
-        <div id='pt_hpf_form'><!--iframe sensitive data payment fields inserted here--></div>
-
-    </div>
-    @include('portal.ninja2020.gateways.includes.pay_now', ['type' => 'submit'])
-    </form>
+    @include('portal.ninja2020.gateways.includes.pay_now')
 @endsection
 
 @section('gateway_footer')
-
-<script src='https://protect.paytrace.com/js/protect.min.js'></script>
-
-<script>
-
-    let token_payment = true;
-
-    Array
-    .from(document.getElementsByClassName('toggle-payment-with-token'))
-    .forEach((element) => element.addEventListener('click', (e) => {
-        document
-            .getElementById('save-card--container').style.display = 'none';
-        document
-            .getElementById('paytrace--credit-card-container').style.display = 'none';
-
-        document
-            .getElementById('token').value = e.target.dataset.token;
-    }));
-
-    let payWithCreditCardToggle = document.getElementById('toggle-payment-with-credit-card');
-
-    if (payWithCreditCardToggle) {
-        payWithCreditCardToggle
-            .addEventListener('click', () => {
-                document
-                    .getElementById('save-card--container').style.display = 'grid';
-                document
-                    .getElementById('paytrace--credit-card-container').style.display = 'grid';
-
-                document
-                    .getElementById('token').value = null;
-                    token_payment = false;
-            });
-    }
-
-    var tokens = document.getElementsByClassName('toggle-payment-with-token');
-    tokens[0].click();
-
-  // Minimal Protect.js setup call
-PTPayment.setup({
-  styles:
-  {
-   'code': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'label_color':'#EF9F6D',
-    'label_size':'20px',
-    'background_color':'white',
-    'border_style':'dotted',
-    'font_size':'15pt',
-    'height':'30px',
-    'width':'100px'
- },
-   'cc': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'label_color':'#EF9F6D',
-    'label_size':'20px',
-    'background_color':'white',
-    'border_style':'solid',
-    'font_size':'15pt',
-    'height':'30px',
-    'width':'300px'
- },
-   'exp': {
-    'font_color':'#5D99CA',
-    'border_color':'#EF9F6D',
-    'label_color':'#EF9F6D',
-    'label_size':'20px',
-    'background_color':'white',
-    'border_style':'dashed',
-    'font_size':'15pt',
-    'height':'30px',
-    'width':'85px',
-    'type':'dropdown'
-  }
- },
-  authorization: { 'clientKey': "{!! $client_key !!}" }
-}).then(function(instance){
-
-
-    PTPayment.getControl("securityCode").label.text("{!! ctrans('texts.cvv')!!}");
-    PTPayment.getControl("creditCard").label.text("{!! ctrans('texts.card_number')!!}");
-    PTPayment.getControl("expiration").label.text("{!! ctrans('texts.expires')!!}");
-
-    document.getElementById("server_response").addEventListener("submit",function(e){
-    e.preventDefault();
-    e.stopPropagation();
-
-    PTPayment.validate(function(validationErrors) {
-
-    if (validationErrors.length >= 1 && !token_payment) {
-        let errors = document.getElementById('errors');
-
-        errors.textContent = '';
-        errors.textContent = validationErrors[0].description;
-        errors.hidden = false;
-
-    } else {
-     // no error so tokenize
-     if(token_payment){
-
-        tokenPayment();
-     } 
-     
-     instance.process()
-     .then( (r) => {
-        submitPayment(r);
-        }, (err) => {
-        handleError(err);
-        });
-    }
-    });
-
-    });
-
-});
-
-
-function handleError(err){
-    console.log(err);
-    document.write(JSON.stringify(err));
-}
-
-function submitPayment(r){
-
-  var hpf_token = document.getElementById("HPF_Token");
-  var enc_key = document.getElementById("enc_key");
-  hpf_token.value = r.message.hpf_token;
-  enc_key.value = r.message.enc_key;
-
-  document.getElementById("server_response").submit();
-
-}
-
-
-function tokenPayment(){
-
-      document.getElementById("server_response").submit();
-      return false;
-}
-</script>
+    <script src='https://protect.paytrace.com/js/protect.min.js'></script>
+    <script src="{{ asset('js/clients/payments/paytrace-credit-card.js') }}"></script>
 @endsection
diff --git a/tests/Browser/ClientPortal/Gateways/PayTrace/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/PayTrace/CreditCardTest.php
new file mode 100644
index 000000000000..3809a8a048f8
--- /dev/null
+++ b/tests/Browser/ClientPortal/Gateways/PayTrace/CreditCardTest.php
@@ -0,0 +1,62 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace Tests\Browser\ClientPortal\Gateways\PayTrace;
+
+use App\Models\CompanyGateway;
+use Laravel\Dusk\Browser;
+use Tests\Browser\Pages\ClientPortal\Login;
+use Tests\DuskTestCase;
+
+class CreditCardTest extends DuskTestCase
+{
+    protected function setUp(): void
+    {
+        parent::setUp();
+
+        foreach (static::$browsers as $browser) {
+            $browser->driver->manage()->deleteAllCookies();
+        }
+
+        $this->disableCompanyGateways();
+
+        CompanyGateway::where('gateway_key', 'bbd736b3254b0aabed6ad7fda1298c88')->restore();
+
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visit(new Login())
+                ->auth();
+        });
+    }
+
+    public function testPayingWithNewCreditCard()
+    {
+        $this->markTestSkipped('Credit card not supported.');
+
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visitRoute('client.invoices.index')
+                ->click('@pay-now')
+                ->press('Pay Now')
+                ->clickLink('Credit Card')
+                ->withinFrame('iframe', function (Browser $browser) {
+                    $browser
+                        ->type('CC', '4012000098765439')
+                        ->select('EXP_MM', '12')
+                        ->select('EXP_YY', '30')
+                        ->type('SEC', '999');
+                })
+                ->press('Pay Now')
+                ->waitForText('Details of the payment', 60);
+        });
+    }
+}
diff --git a/webpack.mix.js b/webpack.mix.js
index a5eafbedebe1..86fa1cea6d3f 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -81,6 +81,10 @@ mix.js("resources/js/app.js", "public/js")
     .js(
         "resources/js/clients/payment_methods/wepay-bank-account.js",
         "public/js/clients/payment_methods/wepay-bank-account.js"
+    )
+    .js(
+        "resources/js/clients/payments/paytrace-credit-card.js",
+        "public/js/clients/payments/paytrace-credit-card.js"
     );
 
 mix.copyDirectory('node_modules/card-js/card-js.min.css', 'public/css/card-js.min.css');

From 1e2e55c9e481932c76ece5479cacf8967de94604 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Thu, 29 Jul 2021 15:13:38 +0200
Subject: [PATCH 27/60] Credit card 3ds processing

---
 .../Gateways/Mollie3dsController.php          |  5 ++-
 .../Gateways/Mollie/Mollie3dsRequest.php      | 35 ++++++++++++++++++-
 app/Models/PaymentHash.php                    |  2 +-
 app/PaymentDrivers/Mollie/CreditCard.php      | 21 +++++++----
 app/PaymentDrivers/MolliePaymentDriver.php    | 16 +++++++++
 5 files changed, 69 insertions(+), 10 deletions(-)

diff --git a/app/Http/Controllers/Gateways/Mollie3dsController.php b/app/Http/Controllers/Gateways/Mollie3dsController.php
index 7f6a0d9121dd..0e3d8f8c113f 100644
--- a/app/Http/Controllers/Gateways/Mollie3dsController.php
+++ b/app/Http/Controllers/Gateways/Mollie3dsController.php
@@ -14,11 +14,14 @@ namespace App\Http\Controllers\Gateways;
 
 use App\Http\Controllers\Controller;
 use App\Http\Requests\Gateways\Mollie\Mollie3dsRequest;
+use App\Models\PaymentHash;
 
 class Mollie3dsController extends Controller
 {
     public function index(Mollie3dsRequest $request)
     {
-        dd($request->all());
+        return $request->getCompanyGateway()
+            ->driver($request->getClient())
+            ->process3dsConfirmation($request);
     }
 }
diff --git a/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php b/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php
index 85415e6e8dc9..8c06791cd957 100644
--- a/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php
+++ b/app/Http/Requests/Gateways/Mollie/Mollie3dsRequest.php
@@ -12,10 +12,18 @@
 
 namespace App\Http\Requests\Gateways\Mollie;
 
+use App\Models\Client;
+use App\Models\ClientGatewayToken;
+use App\Models\Company;
+use App\Models\CompanyGateway;
+use App\Models\PaymentHash;
+use App\Utils\Traits\MakesHash;
 use Illuminate\Foundation\Http\FormRequest;
 
 class Mollie3dsRequest extends FormRequest
 {
+    use MakesHash;
+
     /**
      * Determine if the user is authorized to make this request.
      *
@@ -23,7 +31,7 @@ class Mollie3dsRequest extends FormRequest
      */
     public function authorize()
     {
-        return false;
+        return true;
     }
 
     /**
@@ -37,4 +45,29 @@ class Mollie3dsRequest extends FormRequest
             //
         ];
     }
+
+    public function getCompany(): ?Company
+    {
+        return Company::where('company_key', $this->company_key)->first();
+    }
+
+    public function getCompanyGateway(): ?CompanyGateway
+    {
+        return CompanyGateway::find($this->decodePrimaryKey($this->company_gateway_id));
+    }
+
+    public function getPaymentHash(): ?PaymentHash
+    {
+        return PaymentHash::where('hash', $this->hash)->first();
+    }
+
+    public function getClient(): ?Client
+    {
+        return Client::find($this->getPaymentHash()->data->client_id);
+    }
+
+    public function getPaymentId(): ?string
+    {
+        return $this->getPaymentHash()->data->payment_id;
+    }
 }
diff --git a/app/Models/PaymentHash.php b/app/Models/PaymentHash.php
index 0839120f5a9a..c2ea7232b651 100644
--- a/app/Models/PaymentHash.php
+++ b/app/Models/PaymentHash.php
@@ -41,7 +41,7 @@ class PaymentHash extends Model
         return $this->belongsTo(Invoice::class, 'fee_invoice_id', 'id');
     }
 
-    public function withData(string $property, $value): PaymentHash
+    public function withData(string $property, $value): self
     {
         $this->data = array_merge((array) $this->data, [$property => $value]);
         $this->save();
diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index c7495ca6b52a..38886e65d722 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -50,21 +50,26 @@ class CreditCard
      */
     public function paymentResponse(PaymentResponseRequest $request)
     {
-        $this->mollie->payment_hash->withData('gateway_type_id', GatewayType::CREDIT_CARD);
+        // TODO: Unit tests.
+        $amount = number_format((float) $this->mollie->payment_hash->data->amount_with_fee, 2, '.', '');
+
+        $this->mollie->payment_hash
+            ->withData('gateway_type_id', GatewayType::CREDIT_CARD)
+            ->withData('client_id', $this->mollie->client->id);
 
         try {
             $payment = $this->mollie->gateway->payments->create([
                 'amount' => [
                     'currency' => $this->mollie->client->currency()->code,
-                    'value' => Number::formatValue($this->mollie->payment_hash->data->amount_with_fee, $this->mollie->client->currency()),
+                    'value' => $amount,
                 ],
                 'description' => \sprintf('Hash: %s', $this->mollie->payment_hash->hash),
-                'redirectUrl' => 'https://webshop.example.org/order/12345/',
-                'webhookUrl'  => route('mollie.3ds_redirect', [
+                'redirectUrl' => route('mollie.3ds_redirect', [
                     'company_key' => $this->mollie->client->company->company_key,
                     'company_gateway_id' => $this->mollie->company_gateway->hashed_id,
                     'hash' => $this->mollie->payment_hash->hash,
                 ]),
+                'webhookUrl'  => 'https://invoiceninja.com',
                 'cardToken' => $request->token,
             ]);
 
@@ -78,6 +83,8 @@ class CreditCard
             }
 
             if ($payment->status === 'open') {
+                $this->mollie->payment_hash->withData('payment_id', $payment->id);
+
                 return redirect($payment->getCheckoutUrl());
             }
         } catch (\Exception $e) {
@@ -87,10 +94,8 @@ class CreditCard
         }
     }
 
-    protected function processSuccessfulPayment(\Mollie\Api\Resources\Payment $payment)
+    public function processSuccessfulPayment(\Mollie\Api\Resources\Payment $payment)
     {
-        // Check if storing credit card is enabled
-
         $payment_hash = $this->mollie->payment_hash;
 
         $data = [
@@ -131,5 +136,7 @@ class CreditCard
             $this->mollie->client,
             $this->mollie->client->company,
         );
+
+        throw new PaymentFailed($e->getMessage(), $e->getCode());
     }
 }
diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 6cdcb8b97676..88d7883ac359 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -12,6 +12,7 @@
 
 namespace App\PaymentDrivers;
 
+use App\Http\Requests\Gateways\Mollie\Mollie3dsRequest;
 use App\Http\Requests\Payments\PaymentWebhookRequest;
 use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
@@ -122,4 +123,19 @@ class MolliePaymentDriver extends BaseDriver
     public function processWebhookRequest(PaymentWebhookRequest $request, Payment $payment = null)
     {
     }
+    
+    public function process3dsConfirmation(Mollie3dsRequest $request)
+    {
+        $this->init();
+
+        $this->setPaymentHash($request->getPaymentHash());
+
+        try {
+            $payment = $this->gateway->payments->get($request->getPaymentId());
+
+            return (new CreditCard($this))->processSuccessfulPayment($payment);
+        } catch(\Mollie\Api\Exceptions\ApiException $e) {
+            return (new CreditCard($this))->processUnsuccessfulPayment($e);
+        }
+    }
 }

From d50c629476f7911c1ea1d26dc062bf95df7db0d4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Thu, 29 Jul 2021 15:26:01 +0200
Subject: [PATCH 28/60] Show a message about preauthorizing credit card

---
 .../gateways/mollie/credit_card/pay.blade.php | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index bd57d1a5d8bc..d6a4d7db4f56 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -28,6 +28,31 @@ ctrans('texts.credit_card')])
 
     @include('portal.ninja2020.gateways.includes.payment_details')
 
+    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.pay_with')])
+        @if(count($tokens) > 0)
+            @foreach($tokens as $token)
+                <label class="mr-4">
+                    <input
+                        type="radio"
+                        data-token="{{ $token->token }}"
+                        name="payment-type"
+                        class="form-radio cursor-pointer toggle-payment-with-token"/>
+                    <span class="ml-1 cursor-pointer">**** {{ optional($token->meta)->last4 }}</span>
+                </label>
+            @endforeach
+        @endif
+
+        <label>
+            <input
+                type="radio"
+                id="toggle-payment-with-credit-card"
+                class="form-radio cursor-pointer"
+                name="payment-type"
+                checked/>
+            <span class="ml-1 cursor-pointer">{{ __('texts.new_card') }}</span>
+        </label>
+    @endcomponent
+
     @component('portal.ninja2020.components.general.card-element-single')
         <div class="flex flex-col">
             <label for="card-number">
@@ -58,6 +83,14 @@ ctrans('texts.credit_card')])
         </div>
     @endcomponent
 
+    @component('portal.ninja2020.components.general.card-element-single')
+        <span class="text-sm text-gray-900">If you want to save the card for future purchases, please click on the 
+            <a href="{{ route('client.payment_methods.index') }}" class="underline text-primary">Payment methods</a> page and authorize the credit card manually.
+        </span>
+
+        <span class="text-sm text-gray-900">After that, come back to this page and select your payment method.</span>
+    @endcomponent
+
     @include('portal.ninja2020.gateways.includes.pay_now')
 @endsection
 

From 202cc9d670e7b7e0491bb5a9fffb88dab6a393f5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Thu, 29 Jul 2021 16:15:27 +0200
Subject: [PATCH 29/60] wip

---
 app/PaymentDrivers/Mollie/CreditCard.php      | 38 ++++++++++++++++++-
 .../mollie/credit_card/authorize.blade.php    | 37 ++++++++++++++++++
 2 files changed, 73 insertions(+), 2 deletions(-)
 create mode 100644 resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 38886e65d722..959ecdc9c1c2 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -11,7 +11,7 @@ use App\Models\Payment;
 use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\MolliePaymentDriver;
-use App\Utils\Number;
+use Illuminate\Contracts\Container\BindingResolutionException;
 use Illuminate\Contracts\View\Factory;
 use Illuminate\View\View;
 
@@ -50,6 +50,8 @@ class CreditCard
      */
     public function paymentResponse(PaymentResponseRequest $request)
     {
+        dd($this->mollie->gateway->mandates->listForId('cst_6S77wEkuQT'));
+        
         // TODO: Unit tests.
         $amount = number_format((float) $this->mollie->payment_hash->data->amount_with_fee, 2, '.', '');
 
@@ -58,7 +60,16 @@ class CreditCard
             ->withData('client_id', $this->mollie->client->id);
 
         try {
+            $customer = $this->mollie->gateway->customers->create([
+                'name' => $this->mollie->client->name,
+                'metadata' => [
+                    'id' => $this->mollie->client->hashed_id,
+                ],
+            ]);
+
             $payment = $this->mollie->gateway->payments->create([
+                'customerId' => $customer->id,
+                'sequenceType' => 'first',
                 'amount' => [
                     'currency' => $this->mollie->client->currency()->code,
                     'value' => $amount,
@@ -79,7 +90,7 @@ class CreditCard
                     SystemLog::TYPE_MOLLIE
                 );
 
-               return $this->processSuccessfulPayment($payment);
+                return $this->processSuccessfulPayment($payment);
             }
 
             if ($payment->status === 'open') {
@@ -139,4 +150,27 @@ class CreditCard
 
         throw new PaymentFailed($e->getMessage(), $e->getCode());
     }
+
+    /**
+     * Show authorization page.
+     *  
+     * @param array $data 
+     * @return Factory|View 
+     */
+    public function authorizeView(array $data)
+    {
+        return render('gateways.mollie.credit_card.authorize', $data);
+    }
+
+    public function authorizeResponse($request)
+    {
+        $customer = $this->mollie->gateway->customers->create([
+            'name' => $this->mollie->client->name,
+            'metadata' => [
+                'id' => $this->mollie->client->hashed_id,
+            ],
+        ]);
+
+        // Save $customer->id to database..
+    }
 }
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php
new file mode 100644
index 000000000000..5e3ae5d75ef3
--- /dev/null
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php
@@ -0,0 +1,37 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' =>
+ctrans('texts.credit_card')])
+
+@section('gateway_head')
+
+@endsection
+
+@section('gateway_content')
+    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"
+        method="post" id="server_response">
+        @csrf
+        <input type="hidden" name="company_gateway_id" value="{{ $gateway->gateway_id }}">
+        {{-- <input type="hidden" name="payment_method_id" value="1"> --}}
+        <input type="hidden" name="gateway_response" id="gateway_response">
+    </form>
+
+    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.method')])
+        {{ ctrans('texts.credit_card') }}
+    @endcomponent
+
+    @component('portal.ninja2020.components.general.card-element-single')
+        Click the "Add Payment Method" button to complete test payment.
+    @endcomponent
+
+    @component('portal.ninja2020.gateways.includes.pay_now', ['id' => 'authorize-card'])
+        {{ ctrans('texts.add_payment_method') }}
+    @endcomponent
+@endsection
+
+@section('gateway_footer')
+    <script>
+        document.getElementById('authorize-card')
+            .addEventListener('click', (e) => {
+                document.getElementById('server_response').submit();
+            });
+    </script>
+@endsection

From e3062785471c1355e3f416c29107e9c11fa080f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 30 Jul 2021 14:09:29 +0200
Subject: [PATCH 30/60] Update authentication page

---
 app/PaymentDrivers/Mollie/CreditCard.php      | 21 ++++++-------
 .../mollie/credit_card/authorize.blade.php    | 31 +------------------
 2 files changed, 10 insertions(+), 42 deletions(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 959ecdc9c1c2..d67b6f249bf9 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -11,8 +11,8 @@ use App\Models\Payment;
 use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\MolliePaymentDriver;
-use Illuminate\Contracts\Container\BindingResolutionException;
 use Illuminate\Contracts\View\Factory;
+use Illuminate\Http\RedirectResponse;
 use Illuminate\View\View;
 
 class CreditCard
@@ -50,8 +50,6 @@ class CreditCard
      */
     public function paymentResponse(PaymentResponseRequest $request)
     {
-        dd($this->mollie->gateway->mandates->listForId('cst_6S77wEkuQT'));
-        
         // TODO: Unit tests.
         $amount = number_format((float) $this->mollie->payment_hash->data->amount_with_fee, 2, '.', '');
 
@@ -162,15 +160,14 @@ class CreditCard
         return render('gateways.mollie.credit_card.authorize', $data);
     }
 
-    public function authorizeResponse($request)
+    /**
+     * Handle authorization response.
+     * 
+     * @param mixed $request 
+     * @return RedirectResponse 
+     */
+    public function authorizeResponse($request): RedirectResponse
     {
-        $customer = $this->mollie->gateway->customers->create([
-            'name' => $this->mollie->client->name,
-            'metadata' => [
-                'id' => $this->mollie->client->hashed_id,
-            ],
-        ]);
-
-        // Save $customer->id to database..
+        return redirect()->route('client.payment_methods.index');
     }
 }
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php
index 5e3ae5d75ef3..395a8d68bd11 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/authorize.blade.php
@@ -1,37 +1,8 @@
 @extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' =>
 ctrans('texts.credit_card')])
 
-@section('gateway_head')
-
-@endsection
-
 @section('gateway_content')
-    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"
-        method="post" id="server_response">
-        @csrf
-        <input type="hidden" name="company_gateway_id" value="{{ $gateway->gateway_id }}">
-        {{-- <input type="hidden" name="payment_method_id" value="1"> --}}
-        <input type="hidden" name="gateway_response" id="gateway_response">
-    </form>
-
-    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.method')])
-        {{ ctrans('texts.credit_card') }}
-    @endcomponent
-
     @component('portal.ninja2020.components.general.card-element-single')
-        Click the "Add Payment Method" button to complete test payment.
-    @endcomponent
-
-    @component('portal.ninja2020.gateways.includes.pay_now', ['id' => 'authorize-card'])
-        {{ ctrans('texts.add_payment_method') }}
+    {{ __('texts.payment_method_cannot_be_authorized_first') }}
     @endcomponent
 @endsection
-
-@section('gateway_footer')
-    <script>
-        document.getElementById('authorize-card')
-            .addEventListener('click', (e) => {
-                document.getElementById('server_response').submit();
-            });
-    </script>
-@endsection

From 8af3cfe737c9028147bb8a42dd66eeeb79266a46 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 30 Jul 2021 14:36:14 +0200
Subject: [PATCH 31/60] Pay with credit card and save for future use

---
 .../Payments/PaymentResponseRequest.php       |  5 ++
 app/PaymentDrivers/Mollie/CreditCard.php      | 77 +++++++++++++------
 .../gateways/mollie/credit_card/pay.blade.php | 36 ++++-----
 3 files changed, 75 insertions(+), 43 deletions(-)

diff --git a/app/Http/Requests/ClientPortal/Payments/PaymentResponseRequest.php b/app/Http/Requests/ClientPortal/Payments/PaymentResponseRequest.php
index d3980f4b89af..3a917f339e2f 100644
--- a/app/Http/Requests/ClientPortal/Payments/PaymentResponseRequest.php
+++ b/app/Http/Requests/ClientPortal/Payments/PaymentResponseRequest.php
@@ -37,6 +37,11 @@ class PaymentResponseRequest extends FormRequest
         return PaymentHash::whereRaw('BINARY `hash`= ?', [$input['payment_hash']])->first();
     }
 
+    public function shouldStoreToken(): bool
+    {
+        return (bool) $this->store_card;
+    }
+
     public function prepareForValidation()
     {
         if ($this->has('store_card')) {
diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index d67b6f249bf9..22806fb44e71 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -31,9 +31,9 @@ class CreditCard
 
     /**
      * Show the page for credit card payments.
-     * 
-     * @param array $data 
-     * @return Factory|View 
+     *
+     * @param array $data
+     * @return Factory|View
      */
     public function paymentView(array $data)
     {
@@ -44,9 +44,9 @@ class CreditCard
 
     /**
      * Create a payment object.
-     * 
-     * @param PaymentResponseRequest $request 
-     * @return mixed 
+     *
+     * @param PaymentResponseRequest $request
+     * @return mixed
      */
     public function paymentResponse(PaymentResponseRequest $request)
     {
@@ -58,16 +58,7 @@ class CreditCard
             ->withData('client_id', $this->mollie->client->id);
 
         try {
-            $customer = $this->mollie->gateway->customers->create([
-                'name' => $this->mollie->client->name,
-                'metadata' => [
-                    'id' => $this->mollie->client->hashed_id,
-                ],
-            ]);
-
-            $payment = $this->mollie->gateway->payments->create([
-                'customerId' => $customer->id,
-                'sequenceType' => 'first',
+            $data = [
                 'amount' => [
                     'currency' => $this->mollie->client->currency()->code,
                     'value' => $amount,
@@ -80,7 +71,26 @@ class CreditCard
                 ]),
                 'webhookUrl'  => 'https://invoiceninja.com',
                 'cardToken' => $request->token,
-            ]);
+            ];
+
+            if ($request->shouldStoreToken()) {
+                $customer = $this->mollie->gateway->customers->create([
+                    'name' => $this->mollie->client->name,
+                    'email' => $this->mollie->client->present()->email(),
+                    'metadata' => [
+                        'id' => $this->mollie->client->hashed_id,
+                    ],
+                ]);
+
+                $data['customerId'] = $customer->id;
+                $data['sequenceType'] = 'first';
+
+                $this->mollie->payment_hash
+                    ->withData('mollieCustomerId', $customer->id)
+                    ->withData('shouldStoreToken', true);
+            }
+
+            $payment = $this->mollie->gateway->payments->create($data);
 
             if ($payment->status === 'paid') {
                 $this->mollie->logSuccessfulGatewayResponse(
@@ -107,6 +117,27 @@ class CreditCard
     {
         $payment_hash = $this->mollie->payment_hash;
 
+        if ($payment_hash->data->shouldStoreToken) {
+            try {
+                $mandates = \iterator_to_array($this->mollie->gateway->mandates->listForId($payment_hash->data->mollieCustomerId));
+            } catch (\Mollie\Api\Exceptions\ApiException $e) {
+                return $this->processUnsuccessfulPayment($e);
+            }
+
+            $payment_meta = new \stdClass;
+            $payment_meta->exp_month = (string) $mandates[0]->details->cardExpiryDate;
+            $payment_meta->exp_year = (string) '';
+            $payment_meta->brand = (string) $mandates[0]->details->cardLabel;
+            $payment_meta->last4 = (string) $mandates[0]->details->cardNumber;
+            $payment_meta->type = GatewayType::CREDIT_CARD;
+
+            $this->mollie->storeGatewayToken([
+                'token' => $mandates[0]->id,
+                'payment_method_id' => GatewayType::CREDIT_CARD,
+                'payment_meta' =>  $payment_meta,
+            ]);
+        }
+
         $data = [
             'gateway_type_id' => GatewayType::CREDIT_CARD,
             'amount' => array_sum(array_column($payment_hash->invoices(), 'amount')) + $payment_hash->fee_total,
@@ -151,9 +182,9 @@ class CreditCard
 
     /**
      * Show authorization page.
-     *  
-     * @param array $data 
-     * @return Factory|View 
+     *
+     * @param array $data
+     * @return Factory|View
      */
     public function authorizeView(array $data)
     {
@@ -162,9 +193,9 @@ class CreditCard
 
     /**
      * Handle authorization response.
-     * 
-     * @param mixed $request 
-     * @return RedirectResponse 
+     *
+     * @param mixed $request
+     * @return RedirectResponse
      */
     public function authorizeResponse($request): RedirectResponse
     {
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index d6a4d7db4f56..a99e55c6dfca 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -29,26 +29,19 @@ ctrans('texts.credit_card')])
     @include('portal.ninja2020.gateways.includes.payment_details')
 
     @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.pay_with')])
-        @if(count($tokens) > 0)
-            @foreach($tokens as $token)
+        @if (count($tokens) > 0)
+            @foreach ($tokens as $token)
                 <label class="mr-4">
-                    <input
-                        type="radio"
-                        data-token="{{ $token->token }}"
-                        name="payment-type"
-                        class="form-radio cursor-pointer toggle-payment-with-token"/>
+                    <input type="radio" data-token="{{ $token->token }}" name="payment-type"
+                        class="form-radio cursor-pointer toggle-payment-with-token" />
                     <span class="ml-1 cursor-pointer">**** {{ optional($token->meta)->last4 }}</span>
                 </label>
             @endforeach
         @endif
 
         <label>
-            <input
-                type="radio"
-                id="toggle-payment-with-credit-card"
-                class="form-radio cursor-pointer"
-                name="payment-type"
-                checked/>
+            <input type="radio" id="toggle-payment-with-credit-card" class="form-radio cursor-pointer" name="payment-type"
+                checked />
             <span class="ml-1 cursor-pointer">{{ __('texts.new_card') }}</span>
         </label>
     @endcomponent
@@ -83,13 +76,7 @@ ctrans('texts.credit_card')])
         </div>
     @endcomponent
 
-    @component('portal.ninja2020.components.general.card-element-single')
-        <span class="text-sm text-gray-900">If you want to save the card for future purchases, please click on the 
-            <a href="{{ route('client.payment_methods.index') }}" class="underline text-primary">Payment methods</a> page and authorize the credit card manually.
-        </span>
-
-        <span class="text-sm text-gray-900">After that, come back to this page and select your payment method.</span>
-    @endcomponent
+    @include('portal.ninja2020.gateways.includes.save_card')
 
     @include('portal.ninja2020.gateways.includes.pay_now')
 @endsection
@@ -193,6 +180,15 @@ ctrans('texts.credit_card')])
                         return;
                     }
 
+                    let tokenBillingCheckbox = document.querySelector(
+                        'input[name="token-billing-checkbox"]:checked'
+                    );
+
+                    if (tokenBillingCheckbox) {
+                        document.querySelector('input[name="store_card"]').value =
+                            tokenBillingCheckbox.value;
+                    }
+
                     document.querySelector('input[name=token]').value = token;
                     document.getElementById('server-response').submit();
                 });

From 541a1a825fd4eb3463b36fe31ce7ca2202740249 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 30 Jul 2021 16:04:26 +0200
Subject: [PATCH 32/60] Pay with saved credit card

---
 app/PaymentDrivers/Mollie/CreditCard.php      | 42 +++++++++++++++++--
 .../gateways/mollie/credit_card/pay.blade.php | 28 ++++++++++++-
 2 files changed, 65 insertions(+), 5 deletions(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 22806fb44e71..c223d1392277 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -6,6 +6,7 @@ use App\Exceptions\PaymentFailed;
 use App\Http\Requests\ClientPortal\Payments\PaymentResponseRequest;
 use App\Jobs\Mail\PaymentFailureMailer;
 use App\Jobs\Util\SystemLogger;
+use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
 use App\Models\Payment;
 use App\Models\PaymentType;
@@ -57,6 +58,41 @@ class CreditCard
             ->withData('gateway_type_id', GatewayType::CREDIT_CARD)
             ->withData('client_id', $this->mollie->client->id);
 
+        if (!empty($request->token)) {
+            try {
+                $cgt = ClientGatewayToken::where('token', $request->token)->firstOrFail();
+
+                $payment = $this->mollie->gateway->payments->create([
+                    'amount' => [
+                        'currency' => $this->mollie->client->currency()->code,
+                        'value' => $amount,
+                    ],
+                    'mandateId' => $request->token,
+                    'customerId' => $cgt->gateway_customer_reference,
+                    'sequenceType' => 'recurring',
+                    'description' => \sprintf('Hash: %s', $this->mollie->payment_hash->hash),
+                    'webhookUrl'  => 'https://invoiceninja.com',
+                ]);
+
+                if ($payment->status === 'paid') {
+                    $this->mollie->logSuccessfulGatewayResponse(
+                        ['response' => $payment, 'data' => $this->mollie->payment_hash],
+                        SystemLog::TYPE_MOLLIE
+                    );
+
+                    return $this->processSuccessfulPayment($payment);
+                }
+
+                if ($payment->status === 'open') {
+                    $this->mollie->payment_hash->withData('payment_id', $payment->id);
+
+                    return redirect($payment->getCheckoutUrl());
+                }
+            } catch (\Exception $e) {
+                return $this->processUnsuccessfulPayment($e);
+            }
+        }
+
         try {
             $data = [
                 'amount' => [
@@ -70,7 +106,7 @@ class CreditCard
                     'hash' => $this->mollie->payment_hash->hash,
                 ]),
                 'webhookUrl'  => 'https://invoiceninja.com',
-                'cardToken' => $request->token,
+                'cardToken' => $request->gateway_response,
             ];
 
             if ($request->shouldStoreToken()) {
@@ -117,7 +153,7 @@ class CreditCard
     {
         $payment_hash = $this->mollie->payment_hash;
 
-        if ($payment_hash->data->shouldStoreToken) {
+        if (property_exists($payment_hash->data, 'shouldStoreToken') && $payment_hash->data->shouldStoreToken) {
             try {
                 $mandates = \iterator_to_array($this->mollie->gateway->mandates->listForId($payment_hash->data->mollieCustomerId));
             } catch (\Mollie\Api\Exceptions\ApiException $e) {
@@ -135,7 +171,7 @@ class CreditCard
                 'token' => $mandates[0]->id,
                 'payment_method_id' => GatewayType::CREDIT_CARD,
                 'payment_meta' =>  $payment_meta,
-            ]);
+            ], ['gateway_customer_reference' => $payment_hash->data->mollieCustomerId]);
         }
 
         $data = [
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index a99e55c6dfca..2e89246c3532 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -47,7 +47,7 @@ ctrans('texts.credit_card')])
     @endcomponent
 
     @component('portal.ninja2020.components.general.card-element-single')
-        <div class="flex flex-col">
+        <div class="flex flex-col" id="mollie--payment-container">
             <label for="card-number">
                 <span class="text-xs text-gray-900 uppercase">{{ ctrans('texts.card_number') }}</span>
                 <div class="input w-full" type="text" id="card-number"></div>
@@ -166,6 +166,12 @@ ctrans('texts.credit_card')])
             handlePayNowButton() {
                 document.getElementById('pay-now').disabled = true;
 
+                if (document.querySelector('input[name=token]').value !== '') {
+                    document.querySelector('input[name=gateway_response]').value = '';
+
+                    return document.getElementById('server-response').submit();
+                }
+
                 this.mollie.createToken().then(function(result) {
                     let token = result.token;
                     let error = result.error;
@@ -189,7 +195,9 @@ ctrans('texts.credit_card')])
                             tokenBillingCheckbox.value;
                     }
 
-                    document.querySelector('input[name=token]').value = token;
+                    document.querySelector('input[name=gateway_response]').value = token;
+                    document.querySelector('input[name=token]').value = '';
+
                     document.getElementById('server-response').submit();
                 });
             }
@@ -201,6 +209,22 @@ ctrans('texts.credit_card')])
                     .createExpiryDateInput()
                     .createCvvInput();
 
+                Array
+                    .from(document.getElementsByClassName('toggle-payment-with-token'))
+                    .forEach((element) => element.addEventListener('click', (element) => {
+                        document.getElementById('mollie--payment-container').classList.add('hidden');
+                        document.getElementById('save-card--container').style.display = 'none';
+                        document.querySelector('input[name=token]').value = element.target.dataset.token;
+                    }));
+
+                document
+                    .getElementById('toggle-payment-with-credit-card')
+                    .addEventListener('click', (element) => {
+                        document.getElementById('mollie--payment-container').classList.remove('hidden');
+                        document.getElementById('save-card--container').style.display = 'grid';
+                        document.querySelector('input[name=token]').value = "";
+                    });
+
                 document
                     .getElementById('pay-now')
                     .addEventListener('click', () => this.handlePayNowButton());

From d70e7dfc36bb03085802e686d8bd512cfce73fcf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 12:54:49 +0200
Subject: [PATCH 33/60] Scaffold CreditCardTest

---
 .../Gateways/Mollie/CreditCardTest.php        | 39 +++++++++++++++++++
 1 file changed, 39 insertions(+)
 create mode 100644 tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php

diff --git a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
new file mode 100644
index 000000000000..c1a78883c7f1
--- /dev/null
+++ b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
@@ -0,0 +1,39 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace Tests\Browser\ClientPortal\Gateways\Mollie;
+
+use Laravel\Dusk\Browser;
+use Tests\Browser\Pages\ClientPortal\Login;
+use Tests\DuskTestCase;
+
+class CreditCardTest extends DuskTestCase
+{
+    protected function setUp(): void
+    {
+        parent::setUp();
+
+        foreach (static::$browsers as $browser) {
+            $browser->driver->manage()->deleteAllCookies();
+        }
+
+        // $this->disableCompanyGateways();
+
+        // CompanyGateway::where('gateway_key', '3758e7f7c6f4cecf0f4f348b9a00f456')->restore();
+
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visit(new Login())
+                ->auth();
+        });
+    }
+}

From 1b0ff21f2023aef56741b7b84f571ecebb00050e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 13:14:38 +0200
Subject: [PATCH 34/60] Pay with new credit card test

---
 .../Gateways/Mollie/CreditCardTest.php        | 26 +++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
index c1a78883c7f1..fbaabc24d340 100644
--- a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
+++ b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
@@ -36,4 +36,30 @@ class CreditCardTest extends DuskTestCase
                 ->auth();
         });
     }
+
+    public function testPayWithNewCreditCard()
+    {
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visitRoute('client.invoices.index')
+                ->click('@pay-now')
+                ->press('Pay Now')
+                ->clickLink('Credit Card')
+                ->pause(5000)
+                ->withinFrame('iframe[name=cardNumber-input]', function (Browser $browser) {
+                    $browser->type('#cardNumber', '4242424242424242');
+                })
+                ->withinFrame('iframe[name=cardHolder-input]', function (Browser $browser) {
+                    $browser->type('#cardHolder', 'Invoice Ninja Test Suite');
+                })
+                ->withinFrame('iframe[name=expiryDate-input]', function (Browser $browser) {
+                    $browser->type('#expiryDate', '12/29');
+                })
+                ->withinFrame('iframe[name=verificationCode-input]', function (Browser $browser) {
+                    $browser->type('#verificationCode', '100');
+                })
+                ->press('Pay Now')
+                ->waitForText('Details of the payment', 60);
+        });
+    }
 }

From 80b633fd17db0a753c6926e29cca20a34cc5bcf8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 13:16:15 +0200
Subject: [PATCH 35/60] Pay with new credit card and save for future use test

---
 .../Gateways/Mollie/CreditCardTest.php        | 30 +++++++++++++++++++
 1 file changed, 30 insertions(+)

diff --git a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
index fbaabc24d340..9233afb15cd2 100644
--- a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
+++ b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
@@ -62,4 +62,34 @@ class CreditCardTest extends DuskTestCase
                 ->waitForText('Details of the payment', 60);
         });
     }
+
+    public function testPayWithNewCreditCardAndSaveForFutureUse()
+    {
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visitRoute('client.invoices.index')
+                ->click('@pay-now')
+                ->press('Pay Now')
+                ->clickLink('Credit Card')
+                ->pause(5000)
+                ->withinFrame('iframe[name=cardNumber-input]', function (Browser $browser) {
+                    $browser->type('#cardNumber', '4242424242424242');
+                })
+                ->withinFrame('iframe[name=cardHolder-input]', function (Browser $browser) {
+                    $browser->type('#cardHolder', 'Invoice Ninja Test Suite');
+                })
+                ->withinFrame('iframe[name=expiryDate-input]', function (Browser $browser) {
+                    $browser->type('#expiryDate', '12/29');
+                })
+                ->withinFrame('iframe[name=verificationCode-input]', function (Browser $browser) {
+                    $browser->type('#verificationCode', '100');
+                })
+                ->radio('#proxy_is_default', true)
+                ->press('Pay Now')
+                ->waitForText('Details of the payment', 60)
+                ->visitRoute('client.payment_methods.index')
+                ->clickLink('View')
+                ->assertSee('4242');
+        });
+    }
 }

From d37841afa78d7a8ee66e20ee0d411359e032dc44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 13:18:08 +0200
Subject: [PATCH 36/60] Pay with saved credit card test

---
 .../Gateways/Mollie/CreditCardTest.php             | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
index 9233afb15cd2..714739a3e924 100644
--- a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
+++ b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
@@ -92,4 +92,18 @@ class CreditCardTest extends DuskTestCase
                 ->assertSee('4242');
         });
     }
+
+    public function testPayWithSavedCreditCard()
+    {
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visitRoute('client.invoices.index')
+                ->click('@pay-now')
+                ->press('Pay Now')
+                ->clickLink('Credit Card')
+                ->click('.toggle-payment-with-token')
+                ->press('Pay Now')
+                ->waitForText('Details of the payment', 60);
+        });
+    }
 }

From 1ae9cde8fff17a0633263c2312c85c6158b62396 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 13:19:22 +0200
Subject: [PATCH 37/60] Standalone credit card authorization test

---
 .../ClientPortal/Gateways/Mollie/CreditCardTest.php   | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
index 714739a3e924..fabd139f7f00 100644
--- a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
+++ b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
@@ -106,4 +106,15 @@ class CreditCardTest extends DuskTestCase
                 ->waitForText('Details of the payment', 60);
         });
     }
+
+    public function testAddingPaymentMethodShouldntBePossible()
+    {
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visitRoute('client.payment_methods.index')
+                ->press('Add Payment Method')
+                ->clickLink('Credit Card')
+                ->assertSee('This payment method can be can saved for future use, once you complete your first transaction. Don\'t forget to check "Store credit card details" during payment process.');
+        });
+    }
 }

From b3aa7877b97be02ba793a3b868b1a89b4576e5c5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 13:26:00 +0200
Subject: [PATCH 38/60] Revoking the manadate when deleting

---
 app/PaymentDrivers/MolliePaymentDriver.php | 26 ++++++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 88d7883ac359..863d9738a8d2 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -14,6 +14,7 @@ namespace App\PaymentDrivers;
 
 use App\Http\Requests\Gateways\Mollie\Mollie3dsRequest;
 use App\Http\Requests\Payments\PaymentWebhookRequest;
+use App\Jobs\Util\SystemLogger;
 use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
 use App\Models\Payment;
@@ -123,7 +124,7 @@ class MolliePaymentDriver extends BaseDriver
     public function processWebhookRequest(PaymentWebhookRequest $request, Payment $payment = null)
     {
     }
-    
+
     public function process3dsConfirmation(Mollie3dsRequest $request)
     {
         $this->init();
@@ -134,8 +135,29 @@ class MolliePaymentDriver extends BaseDriver
             $payment = $this->gateway->payments->get($request->getPaymentId());
 
             return (new CreditCard($this))->processSuccessfulPayment($payment);
-        } catch(\Mollie\Api\Exceptions\ApiException $e) {
+        } catch (\Mollie\Api\Exceptions\ApiException $e) {
             return (new CreditCard($this))->processUnsuccessfulPayment($e);
         }
     }
+
+    public function detach(ClientGatewayToken $token)
+    {
+        $this->init();
+
+        try {
+            $this->gateway->mandates->revokeForId($token->gateway_customer_reference, $token->token);
+        } catch (\Mollie\Api\Exceptions\ApiException $e) {
+            SystemLogger::dispatch(
+                [
+                    'server_response' => $e->getMessage(),
+                    'data' => request()->all(),
+                ],
+                SystemLog::CATEGORY_GATEWAY_RESPONSE,
+                SystemLog::EVENT_GATEWAY_FAILURE,
+                SystemLog::TYPE_MOLLIE,
+                $this->client,
+                $this->client->company
+            );
+        }
+    }
 }

From a3965c3d652a97bb59670da90de0e6805a15245d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Sat, 31 Jul 2021 13:27:17 +0200
Subject: [PATCH 39/60] Removing credit card test

---
 .../ClientPortal/Gateways/Mollie/CreditCardTest.php | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
index fabd139f7f00..fd0bad760aa1 100644
--- a/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
+++ b/tests/Browser/ClientPortal/Gateways/Mollie/CreditCardTest.php
@@ -117,4 +117,17 @@ class CreditCardTest extends DuskTestCase
                 ->assertSee('This payment method can be can saved for future use, once you complete your first transaction. Don\'t forget to check "Store credit card details" during payment process.');
         });
     }
+
+    public function testRemoveCreditCard()
+    {
+        $this->browse(function (Browser $browser) {
+            $browser
+                ->visitRoute('client.payment_methods.index')
+                ->clickLink('View')
+                ->press('Remove Payment Method')
+                ->waitForText('Confirmation')
+                ->click('@confirm-payment-removal')
+                ->assertSee('Payment method has been successfully removed.');
+        });
+    }
 }

From 99d686a84558057c028d83f4068eac577cf28605 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 2 Aug 2021 14:47:20 +0200
Subject: [PATCH 40/60] Cleanup PaymentWebhookController

---
 .../Controllers/PaymentWebhookController.php  | 22 +++++--------------
 1 file changed, 5 insertions(+), 17 deletions(-)

diff --git a/app/Http/Controllers/PaymentWebhookController.php b/app/Http/Controllers/PaymentWebhookController.php
index 01b38c3abab3..67907deb5709 100644
--- a/app/Http/Controllers/PaymentWebhookController.php
+++ b/app/Http/Controllers/PaymentWebhookController.php
@@ -13,26 +13,14 @@
 namespace App\Http\Controllers;
 
 use App\Http\Requests\Payments\PaymentWebhookRequest;
-use App\Libraries\MultiDB;
-use Auth;
 
 class PaymentWebhookController extends Controller
 {
-    public function __invoke(PaymentWebhookRequest $request, string $company_key, string $company_gateway_id)
+    public function __invoke(PaymentWebhookRequest $request)
     {
-
-        $payment = $request->getPayment();
-        
-        if(!$payment)
-        	return response()->json(['message' => 'Payment record not found.'], 400);
-
-        $client = is_null($payment) ? $request->getClient() : $payment->client;
-
-        if(!$client)
-	        return response()->json(['message' => 'Client record not found.'], 400);
-
-        return $request->getCompanyGateway()
-            ->driver($client)
-            ->processWebhookRequest($request, $payment);
+        return $request
+            ->getCompanyGateway()
+            ->driver()
+            ->processWebhookRequest($request);
     }
 }

From d3cc6d60145b8dcdbe94b2dcea987f42c030bdb1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 2 Aug 2021 14:47:34 +0200
Subject: [PATCH 41/60] Allow $client in driver() (CompanyGateway) to be
 nullable

---
 app/Models/CompanyGateway.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/Models/CompanyGateway.php b/app/Models/CompanyGateway.php
index b9105b566e9e..f7efd1c79e2c 100644
--- a/app/Models/CompanyGateway.php
+++ b/app/Models/CompanyGateway.php
@@ -118,7 +118,7 @@ class CompanyGateway extends BaseModel
     }
 
     /* This is the public entry point into the payment superclass */
-    public function driver(Client $client)
+    public function driver(Client $client = null)
     {
         $class = static::driver_class();
 

From b144d1e031ce95d8d73e969c97e78c5d80def456 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 2 Aug 2021 14:53:44 +0200
Subject: [PATCH 42/60] Mollie webhook implementation

---
 app/PaymentDrivers/Mollie/CreditCard.php   |  4 +--
 app/PaymentDrivers/MolliePaymentDriver.php | 34 +++++++++++++++++++++-
 2 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index c223d1392277..16741b1c7226 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -71,7 +71,7 @@ class CreditCard
                     'customerId' => $cgt->gateway_customer_reference,
                     'sequenceType' => 'recurring',
                     'description' => \sprintf('Hash: %s', $this->mollie->payment_hash->hash),
-                    'webhookUrl'  => 'https://invoiceninja.com',
+                    'webhookUrl'  => $this->mollie->company_gateway->webhookUrl(),
                 ]);
 
                 if ($payment->status === 'paid') {
@@ -105,7 +105,7 @@ class CreditCard
                     'company_gateway_id' => $this->mollie->company_gateway->hashed_id,
                     'hash' => $this->mollie->payment_hash->hash,
                 ]),
-                'webhookUrl'  => 'https://invoiceninja.com',
+                'webhookUrl'  => $this->mollie->company_gateway->webhookUrl(),
                 'cardToken' => $request->gateway_response,
             ];
 
diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 863d9738a8d2..60c27321e8ed 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -22,6 +22,8 @@ use App\Models\PaymentHash;
 use App\Models\SystemLog;
 use App\PaymentDrivers\Mollie\CreditCard;
 use App\Utils\Traits\MakesHash;
+use Illuminate\Support\Facades\Validator;
+use Mollie\Api\Exceptions\ApiException;
 use Mollie\Api\MollieApiClient;
 
 class MolliePaymentDriver extends BaseDriver
@@ -121,8 +123,38 @@ class MolliePaymentDriver extends BaseDriver
         return $this->payment_method->yourTokenBillingImplmentation();
     }
 
-    public function processWebhookRequest(PaymentWebhookRequest $request, Payment $payment = null)
+    public function processWebhookRequest(PaymentWebhookRequest $request)
     {
+        $validator = Validator::make($request->all(), [
+            'id' => ['required', 'starts_with:tr'],
+        ]);
+
+        if ($validator->fails()) {
+            return response()->json($validator->errors(), 422);
+        }
+        
+        $this->init();
+
+        $codes = [
+            'open' => Payment::STATUS_PENDING,
+            'canceled' => Payment::STATUS_CANCELLED,
+            'pending' => Payment::STATUS_PENDING,
+            'expired' => Payment::STATUS_CANCELLED,
+            'failed' => Payment::STATUS_FAILED,
+            'paid' => Payment::STATUS_COMPLETED,
+        ];
+
+        try {
+            $payment = $this->gateway->payments->get($request->id);
+
+            $record = Payment::where('transaction_reference', $payment->id)->firstOrFail();
+            $record->status_id = $codes[$payment->status];
+            $record->save();
+
+            return response()->json([], 200);
+        } catch(ApiException $e) {
+            return response()->json(['message' => $e->getMessage(), 'gatewayStatusCode' => $e->getCode()], 500);
+        }
     }
 
     public function process3dsConfirmation(Mollie3dsRequest $request)

From d7577b001ce7109cedf128e92a69ebd41a250356 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 2 Aug 2021 15:49:50 +0200
Subject: [PATCH 43/60] Extract convertToMolieAmount method

---
 app/PaymentDrivers/Mollie/CreditCard.php   |  2 +-
 app/PaymentDrivers/MolliePaymentDriver.php | 13 ++++++++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 16741b1c7226..75f87fff285a 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -52,7 +52,7 @@ class CreditCard
     public function paymentResponse(PaymentResponseRequest $request)
     {
         // TODO: Unit tests.
-        $amount = number_format((float) $this->mollie->payment_hash->data->amount_with_fee, 2, '.', '');
+        $amount = $this->mollie->convertToMollieAmount((float) $this->mollie->payment_hash->data->amount_with_fee);
 
         $this->mollie->payment_hash
             ->withData('gateway_type_id', GatewayType::CREDIT_CARD)
diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 60c27321e8ed..44d6dcfac886 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -115,7 +115,7 @@ class MolliePaymentDriver extends BaseDriver
 
     public function refund(Payment $payment, $amount, $return_client_response = false)
     {
-        return $this->payment_method->yourRefundImplementationHere();
+        
     }
 
     public function tokenBilling(ClientGatewayToken $cgt, PaymentHash $payment_hash)
@@ -192,4 +192,15 @@ class MolliePaymentDriver extends BaseDriver
             );
         }
     }
+
+    /**
+     * Convert the amount to the format that Mollie supports.
+     * 
+     * @param mixed|float $amount 
+     * @return string 
+     */
+    public function convertToMollieAmount($amount): string
+    {
+        return \number_format((float) $amount, 2, '.', '');
+    }
 }

From 8217065f6c38dbd7d707c14ed3574ce4a756da98 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 2 Aug 2021 15:49:59 +0200
Subject: [PATCH 44/60] Remove comment

---
 app/PaymentDrivers/Mollie/CreditCard.php | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/PaymentDrivers/Mollie/CreditCard.php b/app/PaymentDrivers/Mollie/CreditCard.php
index 75f87fff285a..cb6fa475b6d1 100644
--- a/app/PaymentDrivers/Mollie/CreditCard.php
+++ b/app/PaymentDrivers/Mollie/CreditCard.php
@@ -51,7 +51,6 @@ class CreditCard
      */
     public function paymentResponse(PaymentResponseRequest $request)
     {
-        // TODO: Unit tests.
         $amount = $this->mollie->convertToMollieAmount((float) $this->mollie->payment_hash->data->amount_with_fee);
 
         $this->mollie->payment_hash

From 804c666f3b579a512b2b85472b6618dd7cbf5ec0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 2 Aug 2021 16:33:37 +0200
Subject: [PATCH 45/60] Refunds

---
 app/PaymentDrivers/MolliePaymentDriver.php | 55 ++++++++++++++++++++--
 1 file changed, 52 insertions(+), 3 deletions(-)

diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 44d6dcfac886..886c5a71bf54 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -115,7 +115,56 @@ class MolliePaymentDriver extends BaseDriver
 
     public function refund(Payment $payment, $amount, $return_client_response = false)
     {
-        
+        $this->init();
+
+        try {
+            $payment = $this->gateway->payments->get($payment->transaction_reference);
+
+            $refund = $this->gateway->payments->refund($payment, [
+                'amount' => [
+                    'currency' => $this->client->currency()->code,
+                    'value' => $this->convertToMollieAmount((float) $amount),
+                ],
+            ]);
+
+            if ($refund->status === 'refunded') {
+                SystemLogger::dispatch(
+                    ['server_response' => $refund, 'data' => request()->all()],
+                    SystemLog::CATEGORY_GATEWAY_RESPONSE,
+                    SystemLog::EVENT_GATEWAY_SUCCESS,
+                    SystemLog::TYPE_MOLLIE,
+                    $this->client,
+                    $this->client->company
+                );
+
+                return [
+                    'transaction_reference' => $refund->id,
+                    'transaction_response' => json_encode($refund),
+                    'success' => $refund->status === 'refunded' ? true : false,
+                    'description' => $refund->description,
+                    'code' => 200,
+                ];
+            }
+        } catch (ApiException $e) {
+            SystemLogger::dispatch(
+                ['server_response' => $refund, 'data' => request()->all()],
+                SystemLog::CATEGORY_GATEWAY_RESPONSE,
+                SystemLog::EVENT_GATEWAY_FAILURE,
+                SystemLog::TYPE_MOLLIE,
+                $this->client,
+                $this->client->companyk
+            );
+
+            nlog($e->getMessage());
+
+            return [
+                'transaction_reference' => null,
+                'transaction_response' => $e->getMessage(),
+                'success' => false,
+                'description' => $e->getMessage(),
+                'code' => $e->getCode(),
+            ];
+        }
     }
 
     public function tokenBilling(ClientGatewayToken $cgt, PaymentHash $payment_hash)
@@ -132,7 +181,7 @@ class MolliePaymentDriver extends BaseDriver
         if ($validator->fails()) {
             return response()->json($validator->errors(), 422);
         }
-        
+
         $this->init();
 
         $codes = [
@@ -152,7 +201,7 @@ class MolliePaymentDriver extends BaseDriver
             $record->save();
 
             return response()->json([], 200);
-        } catch(ApiException $e) {
+        } catch (ApiException $e) {
             return response()->json(['message' => $e->getMessage(), 'gatewayStatusCode' => $e->getCode()], 500);
         }
     }

From a7d03c23ece4b74e74d307346d492f6e20b7a135 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Tue, 3 Aug 2021 13:59:47 +0200
Subject: [PATCH 46/60] Pulling testMode from gateway configuration

---
 ..._115024_activate_mollie_payment_driver.php | 50 +++++++++++++++++++
 database/seeders/PaymentLibrariesSeeder.php   |  2 +-
 .../gateways/mollie/credit_card/pay.blade.php |  4 ++
 3 files changed, 55 insertions(+), 1 deletion(-)
 create mode 100644 database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php

diff --git a/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php b/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php
new file mode 100644
index 000000000000..cad22a3846be
--- /dev/null
+++ b/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php
@@ -0,0 +1,50 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+use App\Models\Gateway;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class ActivateMolliePaymentDriver extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        if($mollie = Gateway::find(7))
+        {
+            $mollie->visible = true;
+
+            $fields = json_decode($mollie->fields);
+            $fields->testMode = false;
+            $fields->publicId = '';
+
+            $mollie->fields = json_encode($fields);
+            
+            $mollie->save();
+        }
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        //
+    }
+}
diff --git a/database/seeders/PaymentLibrariesSeeder.php b/database/seeders/PaymentLibrariesSeeder.php
index b9ff0f84146f..10ed22d82d2b 100644
--- a/database/seeders/PaymentLibrariesSeeder.php
+++ b/database/seeders/PaymentLibrariesSeeder.php
@@ -31,7 +31,7 @@ class PaymentLibrariesSeeder extends Seeder
             ['id' => 4, 'name' => 'FirstData Connect', 'provider' => 'FirstData_Connect', 'key' => '4e0ed0d34552e6cb433506d1ac03a418', 'fields' => '{"storeId":"","sharedSecret":"","testMode":false}'],
             ['id' => 5, 'name' => 'Migs ThreeParty', 'provider' => 'Migs_ThreeParty', 'key' => '513cdc81444c87c4b07258bc2858d3fa', 'fields' => '{"merchantId":"","merchantAccessCode":"","secureHash":""}'],
             ['id' => 6, 'name' => 'Migs TwoParty', 'provider' => 'Migs_TwoParty', 'key' => '99c2a271b5088951334d1302e038c01a', 'fields' => '{"merchantId":"","merchantAccessCode":"","secureHash":""}'],
-            ['id' => 7, 'name' => 'Mollie', 'provider' => 'Mollie', 'is_offsite' => true, 'sort_order' => 8, 'key' => '1bd651fb213ca0c9d66ae3c336dc77e8', 'fields' => '{"apiKey":""}'],
+            ['id' => 7, 'name' => 'Mollie', 'provider' => 'Mollie', 'is_offsite' => true, 'sort_order' => 8, 'key' => '1bd651fb213ca0c9d66ae3c336dc77e8', 'fields' => '{"apiKey":"","publicId":"","testMode":false}'],
             ['id' => 8, 'name' => 'MultiSafepay', 'provider' => 'MultiSafepay', 'key' => 'c3dec814e14cbd7d86abd92ce6789f8c', 'fields' => '{"accountId":"","siteId":"","siteCode":"","testMode":false}'],
             ['id' => 9, 'name' => 'Netaxept', 'provider' => 'Netaxept', 'key' => '070dffc5ca94f4e66216e44028ebd52d', 'fields' => '{"merchantId":"","password":"","testMode":false}'],
             ['id' => 10, 'name' => 'NetBanx', 'provider' => 'NetBanx', 'key' => '334d419939c06bd99b4dfd8a49243f0f', 'fields' => '{"accountNumber":"","storeId":"","storePassword":"","testMode":false}'],
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index 2e89246c3532..d1e099eb015c 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -2,8 +2,12 @@
 ctrans('texts.credit_card')])
 
 @section('gateway_head')
+    <meta name="mollie-testmode" content="{{ $gateway->company_gateway->getConfigField('testMode') }}">
+    <meta name="mollie-publicId" content="{{ $gateway->company_gateway->getConfigField('publicId') }}">
+
     <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
     <script src="{{ asset('js/clients/payments/card-js.min.js') }}"></script>
+    
     <link href="{{ asset('css/card-js.min.css') }}" rel="stylesheet" type="text/css">
 @endsection
 

From 484e6923d41eeeeb493c380f2a0c868f19c5ddcc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Tue, 3 Aug 2021 14:05:56 +0200
Subject: [PATCH 47/60] Remove locale check

---
 .../ninja2020/gateways/mollie/credit_card/pay.blade.php    | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index d1e099eb015c..fbad3de78def 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -2,6 +2,8 @@
 ctrans('texts.credit_card')])
 
 @section('gateway_head')
+    @dd($contact->preferredLocale())
+
     <meta name="mollie-testmode" content="{{ $gateway->company_gateway->getConfigField('testMode') }}">
     <meta name="mollie-publicId" content="{{ $gateway->company_gateway->getConfigField('publicId') }}">
 
@@ -91,9 +93,8 @@ ctrans('texts.credit_card')])
     <script>
         class _Mollie {
             constructor() {
-                this.mollie = Mollie('pfl_sFDNzkEdyw', {
-                    testmode: true,
-                    locale: 'en_US',
+                this.mollie = Mollie(document.querySelector('meta[name=mollie-publicId]')?.content, {
+                    testmode: document.querySelector('meta[name=mollie-testmode]')?.content,
                 });
             }
 

From 373f169b3931bb04268e5e52dd62ce07fe0c901f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Tue, 3 Aug 2021 14:27:08 +0200
Subject: [PATCH 48/60] Extract credit card scripts into standalone JS file

---
 .../js/clients/payments/mollie-credit-card.js |   2 +
 .../mollie-credit-card.js.LICENSE.txt         |   9 +
 public/mix-manifest.json                      |   1 +
 .../js/clients/payments/mollie-credit-card.js | 168 ++++++++++++++++++
 .../gateways/mollie/credit_card/pay.blade.php | 153 +---------------
 webpack.mix.js                                |   4 +
 6 files changed, 185 insertions(+), 152 deletions(-)
 create mode 100644 public/js/clients/payments/mollie-credit-card.js
 create mode 100644 public/js/clients/payments/mollie-credit-card.js.LICENSE.txt
 create mode 100644 resources/js/clients/payments/mollie-credit-card.js

diff --git a/public/js/clients/payments/mollie-credit-card.js b/public/js/clients/payments/mollie-credit-card.js
new file mode 100644
index 000000000000..e251a471ea48
--- /dev/null
+++ b/public/js/clients/payments/mollie-credit-card.js
@@ -0,0 +1,2 @@
+/*! For license information please see mollie-credit-card.js.LICENSE.txt */
+!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=21)}({21:function(e,t,n){e.exports=n("i12I")},i12I:function(e,t){function n(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}(new(function(){function e(){var t,n;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.mollie=Mollie(null===(t=document.querySelector("meta[name=mollie-publicId]"))||void 0===t?void 0:t.content,{testmode:null===(n=document.querySelector("meta[name=mollie-testmode]"))||void 0===n?void 0:n.content})}var t,r,o;return t=e,(r=[{key:"createCardHolderInput",value:function(){var e=this.mollie.createComponent("cardHolder");e.mount("#card-holder");var t=document.getElementById("card-holder-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createCardNumberInput",value:function(){var e=this.mollie.createComponent("cardNumber");e.mount("#card-number");var t=document.getElementById("card-number-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createExpiryDateInput",value:function(){var e=this.mollie.createComponent("expiryDate");e.mount("#expiry-date");var t=document.getElementById("expiry-date-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createCvvInput",value:function(){var e=this.mollie.createComponent("verificationCode");e.mount("#cvv");var t=document.getElementById("cvv-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"handlePayNowButton",value:function(){if(document.getElementById("pay-now").disabled=!0,""!==document.querySelector("input[name=token]").value)return document.querySelector("input[name=gateway_response]").value="",document.getElementById("server-response").submit();this.mollie.createToken().then((function(e){var t=e.token,n=e.error;if(n){document.getElementById("pay-now").disabled=!1;var r=document.getElementById("errors");return r.innerText=n.message,void(r.hidden=!1)}var o=document.querySelector('input[name="token-billing-checkbox"]:checked');o&&(document.querySelector('input[name="store_card"]').value=o.value),document.querySelector("input[name=gateway_response]").value=t,document.querySelector("input[name=token]").value="",document.getElementById("server-response").submit()}))}},{key:"handle",value:function(){var e=this;this.createCardHolderInput().createCardNumberInput().createExpiryDateInput().createCvvInput(),Array.from(document.getElementsByClassName("toggle-payment-with-token")).forEach((function(e){return e.addEventListener("click",(function(e){document.getElementById("mollie--payment-container").classList.add("hidden"),document.getElementById("save-card--container").style.display="none",document.querySelector("input[name=token]").value=e.target.dataset.token}))})),document.getElementById("toggle-payment-with-credit-card").addEventListener("click",(function(e){document.getElementById("mollie--payment-container").classList.remove("hidden"),document.getElementById("save-card--container").style.display="grid",document.querySelector("input[name=token]").value=""})),document.getElementById("pay-now").addEventListener("click",(function(){return e.handlePayNowButton()}))}}])&&n(t.prototype,r),o&&n(t,o),e}())).handle()}});
\ No newline at end of file
diff --git a/public/js/clients/payments/mollie-credit-card.js.LICENSE.txt b/public/js/clients/payments/mollie-credit-card.js.LICENSE.txt
new file mode 100644
index 000000000000..6b30888ddb5b
--- /dev/null
+++ b/public/js/clients/payments/mollie-credit-card.js.LICENSE.txt
@@ -0,0 +1,9 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index cff448c2b916..64ddb1342f6d 100755
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -11,6 +11,7 @@
     "/js/clients/payments/braintree-paypal.js": "/js/clients/payments/braintree-paypal.js?id=c35db3cbb65806ab6a8a",
     "/js/clients/payments/card-js.min.js": "/js/clients/payments/card-js.min.js?id=5469146cd629ea1b5c20",
     "/js/clients/payments/checkout-credit-card.js": "/js/clients/payments/checkout-credit-card.js?id=065e5450233cc5b47020",
+    "/js/clients/payments/mollie-credit-card.js": "/js/clients/payments/mollie-credit-card.js?id=b2c01dd61bd9e9ba7a70",
     "/js/clients/payments/stripe-ach.js": "/js/clients/payments/stripe-ach.js?id=81c2623fc1e5769b51c7",
     "/js/clients/payments/stripe-alipay.js": "/js/clients/payments/stripe-alipay.js?id=665ddf663500767f1a17",
     "/js/clients/payments/stripe-credit-card.js": "/js/clients/payments/stripe-credit-card.js?id=f1719b79a2bb274d3f64",
diff --git a/resources/js/clients/payments/mollie-credit-card.js b/resources/js/clients/payments/mollie-credit-card.js
new file mode 100644
index 000000000000..14978ea2bac2
--- /dev/null
+++ b/resources/js/clients/payments/mollie-credit-card.js
@@ -0,0 +1,168 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+class _Mollie {
+    constructor() {
+        this.mollie = Mollie(
+            document.querySelector('meta[name=mollie-publicId]')?.content,
+            {
+                testmode: document.querySelector('meta[name=mollie-testmode]')
+                    ?.content,
+            }
+        );
+    }
+
+    createCardHolderInput() {
+        let cardHolder = this.mollie.createComponent('cardHolder');
+        cardHolder.mount('#card-holder');
+
+        let cardHolderError = document.getElementById('card-holder-error');
+
+        cardHolder.addEventListener('change', function(event) {
+            if (event.error && event.touched) {
+                cardHolderError.textContent = event.error;
+            } else {
+                cardHolderError.textContent = '';
+            }
+        });
+
+        return this;
+    }
+
+    createCardNumberInput() {
+        let cardNumber = this.mollie.createComponent('cardNumber');
+        cardNumber.mount('#card-number');
+
+        let cardNumberError = document.getElementById('card-number-error');
+
+        cardNumber.addEventListener('change', function(event) {
+            if (event.error && event.touched) {
+                cardNumberError.textContent = event.error;
+            } else {
+                cardNumberError.textContent = '';
+            }
+        });
+
+        return this;
+    }
+
+    createExpiryDateInput() {
+        let expiryDate = this.mollie.createComponent('expiryDate');
+        expiryDate.mount('#expiry-date');
+
+        let expiryDateError = document.getElementById('expiry-date-error');
+
+        expiryDate.addEventListener('change', function(event) {
+            if (event.error && event.touched) {
+                expiryDateError.textContent = event.error;
+            } else {
+                expiryDateError.textContent = '';
+            }
+        });
+
+        return this;
+    }
+
+    createCvvInput() {
+        let verificationCode = this.mollie.createComponent('verificationCode');
+        verificationCode.mount('#cvv');
+
+        let verificationCodeError = document.getElementById('cvv-error');
+
+        verificationCode.addEventListener('change', function(event) {
+            if (event.error && event.touched) {
+                verificationCodeError.textContent = event.error;
+            } else {
+                verificationCodeError.textContent = '';
+            }
+        });
+
+        return this;
+    }
+
+    handlePayNowButton() {
+        document.getElementById('pay-now').disabled = true;
+
+        if (document.querySelector('input[name=token]').value !== '') {
+            document.querySelector('input[name=gateway_response]').value = '';
+
+            return document.getElementById('server-response').submit();
+        }
+
+        this.mollie.createToken().then(function(result) {
+            let token = result.token;
+            let error = result.error;
+
+            if (error) {
+                document.getElementById('pay-now').disabled = false;
+
+                let errorsContainer = document.getElementById('errors');
+                errorsContainer.innerText = error.message;
+                errorsContainer.hidden = false;
+
+                return;
+            }
+
+            let tokenBillingCheckbox = document.querySelector(
+                'input[name="token-billing-checkbox"]:checked'
+            );
+
+            if (tokenBillingCheckbox) {
+                document.querySelector('input[name="store_card"]').value =
+                    tokenBillingCheckbox.value;
+            }
+
+            document.querySelector(
+                'input[name=gateway_response]'
+            ).value = token;
+            document.querySelector('input[name=token]').value = '';
+
+            document.getElementById('server-response').submit();
+        });
+    }
+
+    handle() {
+        this.createCardHolderInput()
+            .createCardNumberInput()
+            .createExpiryDateInput()
+            .createCvvInput();
+
+        Array.from(
+            document.getElementsByClassName('toggle-payment-with-token')
+        ).forEach((element) =>
+            element.addEventListener('click', (element) => {
+                document
+                    .getElementById('mollie--payment-container')
+                    .classList.add('hidden');
+                document.getElementById('save-card--container').style.display =
+                    'none';
+                document.querySelector('input[name=token]').value =
+                    element.target.dataset.token;
+            })
+        );
+
+        document
+            .getElementById('toggle-payment-with-credit-card')
+            .addEventListener('click', (element) => {
+                document
+                    .getElementById('mollie--payment-container')
+                    .classList.remove('hidden');
+                document.getElementById('save-card--container').style.display =
+                    'grid';
+                document.querySelector('input[name=token]').value = '';
+            });
+
+        document
+            .getElementById('pay-now')
+            .addEventListener('click', () => this.handlePayNowButton());
+    }
+}
+
+new _Mollie().handle();
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index fbad3de78def..13e41775efa5 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -2,8 +2,6 @@
 ctrans('texts.credit_card')])
 
 @section('gateway_head')
-    @dd($contact->preferredLocale())
-
     <meta name="mollie-testmode" content="{{ $gateway->company_gateway->getConfigField('testMode') }}">
     <meta name="mollie-publicId" content="{{ $gateway->company_gateway->getConfigField('publicId') }}">
 
@@ -83,159 +81,10 @@ ctrans('texts.credit_card')])
     @endcomponent
 
     @include('portal.ninja2020.gateways.includes.save_card')
-
     @include('portal.ninja2020.gateways.includes.pay_now')
 @endsection
 
 @section('gateway_footer')
     <script src="https://js.mollie.com/v1/mollie.js"></script>
-
-    <script>
-        class _Mollie {
-            constructor() {
-                this.mollie = Mollie(document.querySelector('meta[name=mollie-publicId]')?.content, {
-                    testmode: document.querySelector('meta[name=mollie-testmode]')?.content,
-                });
-            }
-
-            createCardHolderInput() {
-                let cardHolder = this.mollie.createComponent("cardHolder");
-                cardHolder.mount("#card-holder");
-
-                let cardHolderError = document.getElementById("card-holder-error");
-
-                cardHolder.addEventListener("change", function(event) {
-                    if (event.error && event.touched) {
-                        cardHolderError.textContent = event.error;
-                    } else {
-                        cardHolderError.textContent = "";
-                    }
-                });
-
-                return this;
-            }
-
-            createCardNumberInput() {
-                let cardNumber = this.mollie.createComponent("cardNumber");
-                cardNumber.mount("#card-number");
-
-                let cardNumberError = document.getElementById("card-number-error");
-
-                cardNumber.addEventListener("change", function(event) {
-                    if (event.error && event.touched) {
-                        cardNumberError.textContent = event.error;
-                    } else {
-                        cardNumberError.textContent = "";
-                    }
-                });
-
-                return this;
-            }
-
-            createExpiryDateInput() {
-                let expiryDate = this.mollie.createComponent("expiryDate");
-                expiryDate.mount("#expiry-date");
-
-                let expiryDateError = document.getElementById("expiry-date-error");
-
-                expiryDate.addEventListener("change", function(event) {
-                    if (event.error && event.touched) {
-                        expiryDateError.textContent = event.error;
-                    } else {
-                        expiryDateError.textContent = "";
-                    }
-                });
-
-                return this;
-            }
-
-            createCvvInput() {
-                let verificationCode = this.mollie.createComponent("verificationCode");
-                verificationCode.mount("#cvv");
-
-                let verificationCodeError = document.getElementById(
-                    "cvv-error"
-                );
-
-                verificationCode.addEventListener("change", function(event) {
-                    if (event.error && event.touched) {
-                        verificationCodeError.textContent = event.error;
-                    } else {
-                        verificationCodeError.textContent = "";
-                    }
-                });
-
-                return this;
-            }
-
-            handlePayNowButton() {
-                document.getElementById('pay-now').disabled = true;
-
-                if (document.querySelector('input[name=token]').value !== '') {
-                    document.querySelector('input[name=gateway_response]').value = '';
-
-                    return document.getElementById('server-response').submit();
-                }
-
-                this.mollie.createToken().then(function(result) {
-                    let token = result.token;
-                    let error = result.error;
-
-                    if (error) {
-                        document.getElementById('pay-now').disabled = false;
-
-                        let errorsContainer = document.getElementById('errors');
-                        errorsContainer.innerText = error.message;
-                        errorsContainer.hidden = false;
-
-                        return;
-                    }
-
-                    let tokenBillingCheckbox = document.querySelector(
-                        'input[name="token-billing-checkbox"]:checked'
-                    );
-
-                    if (tokenBillingCheckbox) {
-                        document.querySelector('input[name="store_card"]').value =
-                            tokenBillingCheckbox.value;
-                    }
-
-                    document.querySelector('input[name=gateway_response]').value = token;
-                    document.querySelector('input[name=token]').value = '';
-
-                    document.getElementById('server-response').submit();
-                });
-            }
-
-            handle() {
-                this
-                    .createCardHolderInput()
-                    .createCardNumberInput()
-                    .createExpiryDateInput()
-                    .createCvvInput();
-
-                Array
-                    .from(document.getElementsByClassName('toggle-payment-with-token'))
-                    .forEach((element) => element.addEventListener('click', (element) => {
-                        document.getElementById('mollie--payment-container').classList.add('hidden');
-                        document.getElementById('save-card--container').style.display = 'none';
-                        document.querySelector('input[name=token]').value = element.target.dataset.token;
-                    }));
-
-                document
-                    .getElementById('toggle-payment-with-credit-card')
-                    .addEventListener('click', (element) => {
-                        document.getElementById('mollie--payment-container').classList.remove('hidden');
-                        document.getElementById('save-card--container').style.display = 'grid';
-                        document.querySelector('input[name=token]').value = "";
-                    });
-
-                document
-                    .getElementById('pay-now')
-                    .addEventListener('click', () => this.handlePayNowButton());
-            }
-        }
-
-        new _Mollie().handle();
-    </script>
+    <script src="{{ asset('js/clients/payments/mollie-credit-card.js') }}"></script>
 @endsection
diff --git a/webpack.mix.js b/webpack.mix.js
index a5eafbedebe1..ae382d4b795e 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -81,6 +81,10 @@ mix.js("resources/js/app.js", "public/js")
     .js(
         "resources/js/clients/payment_methods/wepay-bank-account.js",
         "public/js/clients/payment_methods/wepay-bank-account.js"
+    )
+    .js(
+        "resources/js/clients/payments/mollie-credit-card.js",
+        "public/js/clients/payments/mollie-credit-card.js"
     );
 
 mix.copyDirectory('node_modules/card-js/card-js.min.css', 'public/css/card-js.min.css');

From 8c8be024a3a7e048b9f5c3f30ccc59a67d98de86 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Tue, 3 Aug 2021 14:36:18 +0200
Subject: [PATCH 49/60] Tests for number_format used in Mollie

---
 tests/Unit/MollieAmountFormatTest.php | 32 +++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 tests/Unit/MollieAmountFormatTest.php

diff --git a/tests/Unit/MollieAmountFormatTest.php b/tests/Unit/MollieAmountFormatTest.php
new file mode 100644
index 000000000000..147d4e21218b
--- /dev/null
+++ b/tests/Unit/MollieAmountFormatTest.php
@@ -0,0 +1,32 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+namespace Tests\Unit;
+
+use PHPUnit\Framework\TestCase;
+
+class MollieAmountFormatTest extends TestCase
+{
+    /**
+     * @covers \App\PaymentDrivers\MolliePaymentDriver::convertToMollieAmount() 
+     */
+    public function testFormatterIsWorkingCorrectly()
+    {
+        $this->assertEquals('1000.00', \number_format((float) 1000, 2, '.', ''));
+
+        $this->assertEquals('1000.00', \number_format((float) "1000", 2, '.', ''));
+
+        $this->assertEquals('1000.00', \number_format((float) "1000.00", 2, '.', ''));
+
+        $this->assertEquals('1000.00', \number_format((float) "1000.00000", 2, '.', ''));
+    }
+}

From 4db925104a83709fb1169b2949f9c0641ffc1801 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Wed, 4 Aug 2021 14:31:47 +0200
Subject: [PATCH 50/60] Refunds & fixes for profileId

---
 app/Models/Gateway.php                     | 5 +++++
 app/PaymentDrivers/MolliePaymentDriver.php | 8 ++++++++
 2 files changed, 13 insertions(+)

diff --git a/app/Models/Gateway.php b/app/Models/Gateway.php
index 32fc20999409..54c4194517bf 100644
--- a/app/Models/Gateway.php
+++ b/app/Models/Gateway.php
@@ -105,6 +105,11 @@ class Gateway extends StaticModel
                     GatewayType::PAYPAL => ['refund' => true, 'token_billing' => true]
                 ];
                 break;
+            case 7:
+                return [
+                    GatewayType::CREDIT_CARD => ['refund' => true, 'token_billing' => true], // Mollie
+                ];
+                break;
             default:
                 return [];
                 break;
diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 886c5a71bf54..142cf212dd14 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -145,6 +145,14 @@ class MolliePaymentDriver extends BaseDriver
                     'code' => 200,
                 ];
             }
+
+            return [
+                'transaction_reference' => $refund->id,
+                'transaction_response' => json_encode($refund),
+                'success' => true,
+                'description' => $refund->description,
+                'code' => 0,
+            ];
         } catch (ApiException $e) {
             SystemLogger::dispatch(
                 ['server_response' => $refund, 'data' => request()->all()],

From ba361977572e78828cc91c35d659d8fc6bc4bbe9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Wed, 4 Aug 2021 14:40:13 +0200
Subject: [PATCH 51/60] Fixes for profileId

---
 .../2021_08_03_115024_activate_mollie_payment_driver.php       | 2 +-
 database/seeders/PaymentLibrariesSeeder.php                    | 2 +-
 resources/js/clients/payments/mollie-credit-card.js            | 3 ++-
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php b/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php
index cad22a3846be..c01c9df755b5 100644
--- a/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php
+++ b/database/migrations/2021_08_03_115024_activate_mollie_payment_driver.php
@@ -30,7 +30,7 @@ class ActivateMolliePaymentDriver extends Migration
 
             $fields = json_decode($mollie->fields);
             $fields->testMode = false;
-            $fields->publicId = '';
+            $fields->profileId = '';
 
             $mollie->fields = json_encode($fields);
             
diff --git a/database/seeders/PaymentLibrariesSeeder.php b/database/seeders/PaymentLibrariesSeeder.php
index 10ed22d82d2b..193c7ef4212e 100644
--- a/database/seeders/PaymentLibrariesSeeder.php
+++ b/database/seeders/PaymentLibrariesSeeder.php
@@ -31,7 +31,7 @@ class PaymentLibrariesSeeder extends Seeder
             ['id' => 4, 'name' => 'FirstData Connect', 'provider' => 'FirstData_Connect', 'key' => '4e0ed0d34552e6cb433506d1ac03a418', 'fields' => '{"storeId":"","sharedSecret":"","testMode":false}'],
             ['id' => 5, 'name' => 'Migs ThreeParty', 'provider' => 'Migs_ThreeParty', 'key' => '513cdc81444c87c4b07258bc2858d3fa', 'fields' => '{"merchantId":"","merchantAccessCode":"","secureHash":""}'],
             ['id' => 6, 'name' => 'Migs TwoParty', 'provider' => 'Migs_TwoParty', 'key' => '99c2a271b5088951334d1302e038c01a', 'fields' => '{"merchantId":"","merchantAccessCode":"","secureHash":""}'],
-            ['id' => 7, 'name' => 'Mollie', 'provider' => 'Mollie', 'is_offsite' => true, 'sort_order' => 8, 'key' => '1bd651fb213ca0c9d66ae3c336dc77e8', 'fields' => '{"apiKey":"","publicId":"","testMode":false}'],
+            ['id' => 7, 'name' => 'Mollie', 'provider' => 'Mollie', 'is_offsite' => true, 'sort_order' => 8, 'key' => '1bd651fb213ca0c9d66ae3c336dc77e8', 'fields' => '{"apiKey":"","profileId":"","testMode":false}'],
             ['id' => 8, 'name' => 'MultiSafepay', 'provider' => 'MultiSafepay', 'key' => 'c3dec814e14cbd7d86abd92ce6789f8c', 'fields' => '{"accountId":"","siteId":"","siteCode":"","testMode":false}'],
             ['id' => 9, 'name' => 'Netaxept', 'provider' => 'Netaxept', 'key' => '070dffc5ca94f4e66216e44028ebd52d', 'fields' => '{"merchantId":"","password":"","testMode":false}'],
             ['id' => 10, 'name' => 'NetBanx', 'provider' => 'NetBanx', 'key' => '334d419939c06bd99b4dfd8a49243f0f', 'fields' => '{"accountNumber":"","storeId":"","storePassword":"","testMode":false}'],
diff --git a/resources/js/clients/payments/mollie-credit-card.js b/resources/js/clients/payments/mollie-credit-card.js
index 14978ea2bac2..c973f1147c58 100644
--- a/resources/js/clients/payments/mollie-credit-card.js
+++ b/resources/js/clients/payments/mollie-credit-card.js
@@ -11,10 +11,11 @@
 class _Mollie {
     constructor() {
         this.mollie = Mollie(
-            document.querySelector('meta[name=mollie-publicId]')?.content,
+            document.querySelector('meta[name=mollie-profileId]')?.content,
             {
                 testmode: document.querySelector('meta[name=mollie-testmode]')
                     ?.content,
+                locale: 'en_US',
             }
         );
     }

From ff74f4cd6920f5848c4b2770c4c7361ee5fdcf34 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Wed, 4 Aug 2021 14:59:15 +0200
Subject: [PATCH 52/60] Token billing

---
 app/PaymentDrivers/MolliePaymentDriver.php | 93 +++++++++++++++++++++-
 1 file changed, 92 insertions(+), 1 deletion(-)

diff --git a/app/PaymentDrivers/MolliePaymentDriver.php b/app/PaymentDrivers/MolliePaymentDriver.php
index 142cf212dd14..777f5d9e3c4e 100644
--- a/app/PaymentDrivers/MolliePaymentDriver.php
+++ b/app/PaymentDrivers/MolliePaymentDriver.php
@@ -12,13 +12,17 @@
 
 namespace App\PaymentDrivers;
 
+use App\Http\Requests\ClientPortal\Payments\PaymentResponseRequest;
 use App\Http\Requests\Gateways\Mollie\Mollie3dsRequest;
 use App\Http\Requests\Payments\PaymentWebhookRequest;
+use App\Jobs\Mail\PaymentFailureMailer;
 use App\Jobs\Util\SystemLogger;
 use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
+use App\Models\Invoice;
 use App\Models\Payment;
 use App\Models\PaymentHash;
+use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\Mollie\CreditCard;
 use App\Utils\Traits\MakesHash;
@@ -177,7 +181,94 @@ class MolliePaymentDriver extends BaseDriver
 
     public function tokenBilling(ClientGatewayToken $cgt, PaymentHash $payment_hash)
     {
-        return $this->payment_method->yourTokenBillingImplmentation();
+        $amount = array_sum(array_column($payment_hash->invoices(), 'amount')) + $payment_hash->fee_total;
+        $invoice = Invoice::whereIn('id', $this->transformKeys(array_column($payment_hash->invoices(), 'invoice_id')))->withTrashed()->first();
+
+        if ($invoice) {
+            $description = "Invoice {$invoice->number} for {$amount} for client {$this->client->present()->name()}";
+        } else {
+            $description = "Payment with no invoice for amount {$amount} for client {$this->client->present()->name()}";
+        }
+
+        $request = new PaymentResponseRequest();
+        $request->setMethod('POST');
+        $request->request->add(['payment_hash' => $payment_hash->hash]);
+
+        $this->init();
+
+        try {
+            $payment = $this->gateway->payments->create([
+                'amount' => [
+                    'currency' => $this->client->currency()->code,
+                    'value' => $this->convertToMollieAmount($amount),
+                ],
+                'mandateId' => $cgt->token,
+                'customerId' => $cgt->gateway_customer_reference,
+                'sequenceType' => 'recurring',
+                'description' => $description,
+                'webhookUrl'  => $this->company_gateway->webhookUrl(),
+            ]);
+
+            if ($payment->status === 'paid') {
+                $this->confirmGatewayFee($request);
+
+                $data = [
+                    'payment_method' => $cgt->token,
+                    'payment_type' => PaymentType::CREDIT_CARD_OTHER,
+                    'amount' => $amount,
+                    'transaction_reference' => $payment->id,
+                    'gateway_type_id' => GatewayType::CREDIT_CARD,
+                ];
+
+                $payment = $this->createPayment($data, Payment::STATUS_COMPLETED);
+
+                SystemLogger::dispatch(
+                    ['response' => $payment, 'data' => $data],
+                    SystemLog::CATEGORY_GATEWAY_RESPONSE,
+                    SystemLog::EVENT_GATEWAY_SUCCESS,
+                    SystemLog::TYPE_MOLLIE,
+                    $this->client
+                );
+
+                return $payment;
+            }
+
+            $this->unWindGatewayFees($payment_hash);
+
+            PaymentFailureMailer::dispatch(
+                $this->client,
+                $payment->details,
+                $this->client->company,
+                $amount
+            );
+
+            $message = [
+                'server_response' => $payment,
+                'data' => $payment_hash->data,
+            ];
+
+            SystemLogger::dispatch(
+                $message,
+                SystemLog::CATEGORY_GATEWAY_RESPONSE,
+                SystemLog::EVENT_GATEWAY_FAILURE,
+                SystemLog::TYPE_CHECKOUT,
+                $this->client
+            );
+
+            return false;
+        } catch (ApiException $e) {
+            $this->unWindGatewayFees($payment_hash);
+
+            $data = [
+                'status' => '',
+                'error_type' => '',
+                'error_code' => $e->getCode(),
+                'param' => '',
+                'message' => $e->getMessage(),
+            ];
+
+            SystemLogger::dispatch($data, SystemLog::CATEGORY_GATEWAY_RESPONSE, SystemLog::EVENT_GATEWAY_FAILURE, SystemLog::TYPE_MOLLIE, $this->client, $this->client->company);
+        }
     }
 
     public function processWebhookRequest(PaymentWebhookRequest $request)

From 69a77cdf0808eb4e6f515902629c286dc92db080 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Wed, 4 Aug 2021 15:00:23 +0200
Subject: [PATCH 53/60] Production build

---
 public/js/clients/payments/mollie-credit-card.js                | 2 +-
 public/mix-manifest.json                                        | 2 +-
 .../portal/ninja2020/gateways/mollie/credit_card/pay.blade.php  | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/public/js/clients/payments/mollie-credit-card.js b/public/js/clients/payments/mollie-credit-card.js
index e251a471ea48..4737d3dfafca 100644
--- a/public/js/clients/payments/mollie-credit-card.js
+++ b/public/js/clients/payments/mollie-credit-card.js
@@ -1,2 +1,2 @@
 /*! For license information please see mollie-credit-card.js.LICENSE.txt */
-!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=21)}({21:function(e,t,n){e.exports=n("i12I")},i12I:function(e,t){function n(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}(new(function(){function e(){var t,n;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.mollie=Mollie(null===(t=document.querySelector("meta[name=mollie-publicId]"))||void 0===t?void 0:t.content,{testmode:null===(n=document.querySelector("meta[name=mollie-testmode]"))||void 0===n?void 0:n.content})}var t,r,o;return t=e,(r=[{key:"createCardHolderInput",value:function(){var e=this.mollie.createComponent("cardHolder");e.mount("#card-holder");var t=document.getElementById("card-holder-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createCardNumberInput",value:function(){var e=this.mollie.createComponent("cardNumber");e.mount("#card-number");var t=document.getElementById("card-number-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createExpiryDateInput",value:function(){var e=this.mollie.createComponent("expiryDate");e.mount("#expiry-date");var t=document.getElementById("expiry-date-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createCvvInput",value:function(){var e=this.mollie.createComponent("verificationCode");e.mount("#cvv");var t=document.getElementById("cvv-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"handlePayNowButton",value:function(){if(document.getElementById("pay-now").disabled=!0,""!==document.querySelector("input[name=token]").value)return document.querySelector("input[name=gateway_response]").value="",document.getElementById("server-response").submit();this.mollie.createToken().then((function(e){var t=e.token,n=e.error;if(n){document.getElementById("pay-now").disabled=!1;var r=document.getElementById("errors");return r.innerText=n.message,void(r.hidden=!1)}var o=document.querySelector('input[name="token-billing-checkbox"]:checked');o&&(document.querySelector('input[name="store_card"]').value=o.value),document.querySelector("input[name=gateway_response]").value=t,document.querySelector("input[name=token]").value="",document.getElementById("server-response").submit()}))}},{key:"handle",value:function(){var e=this;this.createCardHolderInput().createCardNumberInput().createExpiryDateInput().createCvvInput(),Array.from(document.getElementsByClassName("toggle-payment-with-token")).forEach((function(e){return e.addEventListener("click",(function(e){document.getElementById("mollie--payment-container").classList.add("hidden"),document.getElementById("save-card--container").style.display="none",document.querySelector("input[name=token]").value=e.target.dataset.token}))})),document.getElementById("toggle-payment-with-credit-card").addEventListener("click",(function(e){document.getElementById("mollie--payment-container").classList.remove("hidden"),document.getElementById("save-card--container").style.display="grid",document.querySelector("input[name=token]").value=""})),document.getElementById("pay-now").addEventListener("click",(function(){return e.handlePayNowButton()}))}}])&&n(t.prototype,r),o&&n(t,o),e}())).handle()}});
\ No newline at end of file
+!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=21)}({21:function(e,t,n){e.exports=n("i12I")},i12I:function(e,t){function n(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}(new(function(){function e(){var t,n;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.mollie=Mollie(null===(t=document.querySelector("meta[name=mollie-profileId]"))||void 0===t?void 0:t.content,{testmode:null===(n=document.querySelector("meta[name=mollie-testmode]"))||void 0===n?void 0:n.content,locale:"en_US"})}var t,r,o;return t=e,(r=[{key:"createCardHolderInput",value:function(){var e=this.mollie.createComponent("cardHolder");e.mount("#card-holder");var t=document.getElementById("card-holder-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createCardNumberInput",value:function(){var e=this.mollie.createComponent("cardNumber");e.mount("#card-number");var t=document.getElementById("card-number-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createExpiryDateInput",value:function(){var e=this.mollie.createComponent("expiryDate");e.mount("#expiry-date");var t=document.getElementById("expiry-date-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"createCvvInput",value:function(){var e=this.mollie.createComponent("verificationCode");e.mount("#cvv");var t=document.getElementById("cvv-error");return e.addEventListener("change",(function(e){e.error&&e.touched?t.textContent=e.error:t.textContent=""})),this}},{key:"handlePayNowButton",value:function(){if(document.getElementById("pay-now").disabled=!0,""!==document.querySelector("input[name=token]").value)return document.querySelector("input[name=gateway_response]").value="",document.getElementById("server-response").submit();this.mollie.createToken().then((function(e){var t=e.token,n=e.error;if(n){document.getElementById("pay-now").disabled=!1;var r=document.getElementById("errors");return r.innerText=n.message,void(r.hidden=!1)}var o=document.querySelector('input[name="token-billing-checkbox"]:checked');o&&(document.querySelector('input[name="store_card"]').value=o.value),document.querySelector("input[name=gateway_response]").value=t,document.querySelector("input[name=token]").value="",document.getElementById("server-response").submit()}))}},{key:"handle",value:function(){var e=this;this.createCardHolderInput().createCardNumberInput().createExpiryDateInput().createCvvInput(),Array.from(document.getElementsByClassName("toggle-payment-with-token")).forEach((function(e){return e.addEventListener("click",(function(e){document.getElementById("mollie--payment-container").classList.add("hidden"),document.getElementById("save-card--container").style.display="none",document.querySelector("input[name=token]").value=e.target.dataset.token}))})),document.getElementById("toggle-payment-with-credit-card").addEventListener("click",(function(e){document.getElementById("mollie--payment-container").classList.remove("hidden"),document.getElementById("save-card--container").style.display="grid",document.querySelector("input[name=token]").value=""})),document.getElementById("pay-now").addEventListener("click",(function(){return e.handlePayNowButton()}))}}])&&n(t.prototype,r),o&&n(t,o),e}())).handle()}});
\ No newline at end of file
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index 64ddb1342f6d..26dc6f9418ac 100755
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -11,7 +11,7 @@
     "/js/clients/payments/braintree-paypal.js": "/js/clients/payments/braintree-paypal.js?id=c35db3cbb65806ab6a8a",
     "/js/clients/payments/card-js.min.js": "/js/clients/payments/card-js.min.js?id=5469146cd629ea1b5c20",
     "/js/clients/payments/checkout-credit-card.js": "/js/clients/payments/checkout-credit-card.js?id=065e5450233cc5b47020",
-    "/js/clients/payments/mollie-credit-card.js": "/js/clients/payments/mollie-credit-card.js?id=b2c01dd61bd9e9ba7a70",
+    "/js/clients/payments/mollie-credit-card.js": "/js/clients/payments/mollie-credit-card.js?id=71ab46c999f7a1dbdc9f",
     "/js/clients/payments/stripe-ach.js": "/js/clients/payments/stripe-ach.js?id=81c2623fc1e5769b51c7",
     "/js/clients/payments/stripe-alipay.js": "/js/clients/payments/stripe-alipay.js?id=665ddf663500767f1a17",
     "/js/clients/payments/stripe-credit-card.js": "/js/clients/payments/stripe-credit-card.js?id=f1719b79a2bb274d3f64",
diff --git a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
index 13e41775efa5..5eebdca2f304 100644
--- a/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
+++ b/resources/views/portal/ninja2020/gateways/mollie/credit_card/pay.blade.php
@@ -3,7 +3,7 @@ ctrans('texts.credit_card')])
 
 @section('gateway_head')
     <meta name="mollie-testmode" content="{{ $gateway->company_gateway->getConfigField('testMode') }}">
-    <meta name="mollie-publicId" content="{{ $gateway->company_gateway->getConfigField('publicId') }}">
+    <meta name="mollie-profileId" content="{{ $gateway->company_gateway->getConfigField('profileId') }}">
 
     <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
     <script src="{{ asset('js/clients/payments/card-js.min.js') }}"></script>

From bb2c29dbc32f1d040b7339974f6aee3545b1c6ef Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Mon, 9 Aug 2021 14:33:08 +1000
Subject: [PATCH 54/60] Fixes for paytrace

---
 app/PaymentDrivers/PayTrace/CreditCard.php | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/app/PaymentDrivers/PayTrace/CreditCard.php b/app/PaymentDrivers/PayTrace/CreditCard.php
index eb9fc34bba68..f2a9a744aca7 100644
--- a/app/PaymentDrivers/PayTrace/CreditCard.php
+++ b/app/PaymentDrivers/PayTrace/CreditCard.php
@@ -157,14 +157,16 @@ class CreditCard
     {
         $response_array = $request->all();
 
-        if($request->token)
-            $this->processTokenPayment($request->token, $request);
+        if($request->token){
+            $token = ClientGatewayToken::find($this->decodePrimaryKey($request->token));
+            return $this->processTokenPayment($token->token, $request);
+        }
 
         if ($request->has('store_card') && $request->input('store_card') === true) {
 
             $response = $this->createCustomer($request->all());
             
-            $this->processTokenPayment($response->customer_id, $request);
+            return $this->processTokenPayment($response->customer_id, $request);
         }
 
         //process a regular charge here:
@@ -190,8 +192,8 @@ class CreditCard
     {
 
         $data = [
-            'customer_id' => $request->token,
-            'integrator_id' =>  $this->company_gateway->getConfigField('integratorId'),
+            'customer_id' => $token,
+            'integrator_id' =>  $this->paytrace->company_gateway->getConfigField('integratorId'),
             'amount' => $request->input('amount_with_fee'),
         ];
 

From b4ae1faf64fa6158bb8099d8e1825cc7a9880ccf Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 11 Aug 2021 11:12:03 +1000
Subject: [PATCH 55/60] Logging for email quotas

---
 app/Jobs/Ninja/AdjustEmailQuota.php | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/Jobs/Ninja/AdjustEmailQuota.php b/app/Jobs/Ninja/AdjustEmailQuota.php
index dec4945673b7..8be8db325cdb 100644
--- a/app/Jobs/Ninja/AdjustEmailQuota.php
+++ b/app/Jobs/Ninja/AdjustEmailQuota.php
@@ -60,6 +60,7 @@ class AdjustEmailQuota implements ShouldQueue
     {
 
         Account::query()->cursor()->each(function ($account){
+            nlog("resetting email quota for {$account->key}");
             Cache::forget($account->key);
             Cache::forget("throttle_notified:{$account->key}");
         });

From 3f38a5bfe731bc5f38091dfee060eb17629c1872 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 11 Aug 2021 14:48:54 +1000
Subject: [PATCH 56/60] Update invoice after applying late fee

---
 app/Jobs/Util/ReminderJob.php | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/Jobs/Util/ReminderJob.php b/app/Jobs/Util/ReminderJob.php
index 0a06d380f2ea..27be640a26ad 100644
--- a/app/Jobs/Util/ReminderJob.php
+++ b/app/Jobs/Util/ReminderJob.php
@@ -175,8 +175,9 @@ class ReminderJob implements ShouldQueue
         $invoice->line_items = $invoice_items;
 
         /**Refresh Invoice values*/
-        $invoice = $invoice->calc()->getInvoice();
-
+        $invoice = $invoice->calc()->getInvoice()->save();
+        $invoice->service()->deletePdf();
+        
         nlog("adjusting client balance and invoice balance by ". ($invoice->balance - $temp_invoice_balance));
         $invoice->client->service()->updateBalance($invoice->balance - $temp_invoice_balance)->save();
         $invoice->ledger()->updateInvoiceBalance($invoice->balance - $temp_invoice_balance, "Late Fee Adjustment for invoice {$invoice->number}");

From 60e0d692858ba4dedbe83eb9de8caacd3b5822d8 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Wed, 11 Aug 2021 16:04:47 +1000
Subject: [PATCH 57/60] Fixes for innodb engine

---
 config/database.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/config/database.php b/config/database.php
index 18bf7497f2b9..6e016d9a9130 100644
--- a/config/database.php
+++ b/config/database.php
@@ -46,7 +46,7 @@ return [
             'prefix'         => '',
             'prefix_indexes' => true,
             'strict'         => env('DB_STRICT', false),
-            // 'engine'         => 'InnoDB ROW_FORMAT=DYNAMIC',
+            'engine'         => 'InnoDB',
         ],
 
         'sqlite' => [

From 2761bc1c7f98ec696e857bce386e7ef8c318b330 Mon Sep 17 00:00:00 2001
From: = <turbo124@gmail.com>
Date: Wed, 11 Aug 2021 20:06:28 +1000
Subject: [PATCH 58/60] Fixes for design ids when converting quotes to invoics

---
 app/Services/Quote/ConvertQuote.php | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/app/Services/Quote/ConvertQuote.php b/app/Services/Quote/ConvertQuote.php
index 94722341450c..97f389b48484 100644
--- a/app/Services/Quote/ConvertQuote.php
+++ b/app/Services/Quote/ConvertQuote.php
@@ -15,10 +15,14 @@ namespace App\Services\Quote;
 use App\Factory\CloneQuoteToInvoiceFactory;
 use App\Models\Quote;
 use App\Repositories\InvoiceRepository;
+use App\Utils\Traits\MakesHash;
 
 class ConvertQuote
 {
+    use MakesHash;
+
     private $client;
+
     private $invoice_repo;
 
     public function __construct($client)
@@ -34,7 +38,7 @@ class ConvertQuote
     public function run($quote)
     {
         $invoice = CloneQuoteToInvoiceFactory::create($quote, $quote->user_id);
-        $invoice->design_id = $this->client->getSetting('invoice_design_id');
+        $invoice->design_id = $this->decodePrimaryKey($this->client->getSetting('invoice_design_id'));
         $invoice = $this->invoice_repo->save([], $invoice);
         
         $invoice->fresh();

From 27a7882c09ece595ad5de14e90081f772d7419b5 Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Thu, 12 Aug 2021 10:56:04 +1000
Subject: [PATCH 59/60] Resolve user correctly

---
 app/Jobs/Import/CSVImport.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/Jobs/Import/CSVImport.php b/app/Jobs/Import/CSVImport.php
index 2e3d40befc21..dd6d22392cc6 100644
--- a/app/Jobs/Import/CSVImport.php
+++ b/app/Jobs/Import/CSVImport.php
@@ -573,7 +573,7 @@ class CSVImport implements ShouldQueue {
 	}
 
 	private function findUser( $user_hash ) {
-		$user = User::where( 'company_id', $this->company->id )
+		$user = User::where( 'account_id', $this->company->account->id )
 					->where( \DB::raw( 'CONCAT_WS(" ", first_name, last_name)' ), 'like', '%' . $user_hash . '%' )
 					->first();
 

From 0aecc6da208778f52ee9db81c6ba0274f3fe51df Mon Sep 17 00:00:00 2001
From: David Bomba <turbo124@gmail.com>
Date: Thu, 12 Aug 2021 14:35:25 +1000
Subject: [PATCH 60/60] Check that contacts are an array

---
 app/Http/Requests/Request.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/Http/Requests/Request.php b/app/Http/Requests/Request.php
index 5ad2e358ba1a..c90d9485c742 100644
--- a/app/Http/Requests/Request.php
+++ b/app/Http/Requests/Request.php
@@ -134,7 +134,7 @@ class Request extends FormRequest
             }
         }
 
-        if (isset($input['contacts'])) {
+        if (isset($input['contacts']) && is_array($input['contacts'])) {
             foreach ($input['contacts'] as $key => $contact) {
                 if (array_key_exists('id', $contact) && is_numeric($contact['id'])) {
                     unset($input['contacts'][$key]['id']);