Merge pull request #4729 from turbo124/v5-develop

Update

app/DataMapper/EmailTemplateDefaults.php

@@ -123,7 +123,7 @@ class EmailTemplateDefaults
 
     public static function emailInvoiceTemplate()
     {
-        $invoice_message = '<p>'.self::transformText('invoice_message').'</p><br><br><p>$view_link</p>';
+        $invoice_message = '<p>'.self::transformText('invoice_message').'</p><p>$view_link</p>';
 
         return $invoice_message;
     }
@@ -135,7 +135,7 @@ class EmailTemplateDefaults
 
     public static function emailQuoteTemplate()
     {
-        $quote_message = '<p>'.self::transformText('quote_message').'</p><br><br><p>$view_link</p>';
+        $quote_message = '<p>'.self::transformText('quote_message').'</p><p>$view_link</p>';
 
         return $quote_message;
     }
@@ -147,21 +147,21 @@ class EmailTemplateDefaults
 
     public static function emailPaymentTemplate()
     {
-        $payment_message = '<p>'.self::transformText('payment_message').'</p><br><br><p>$view_link</p>';
+        $payment_message = '<p>'.self::transformText('payment_message').'</p><p>$view_link</p>';
 
         return $payment_message;
     }
 
     public static function emailCreditTemplate()
     {
-        $credit_message = '<p>'.self::transformText('credit_message').'</p><br><br><p>$view_link</p>';
+        $credit_message = '<p>'.self::transformText('credit_message').'</p><p>$view_link</p>';
 
         return $credit_message;
     }
 
     public static function emailPaymentPartialTemplate()
     {
-        $payment_message = '<p>'.self::transformText('payment_message').'</p><br><br><p>$view_link</p>';
+        $payment_message = '<p>'.self::transformText('payment_message').'</p><p>$view_link</p>';
 
         return $payment_message;
     }

app/Http/Livewire/RequiredClientInfo.php

@@ -27,6 +27,11 @@ class RequiredClientInfo extends Component
      */
     public $contact;
 
+    /**
+     * @var array
+     */
+    public $countries;
+
     /**
      * Mappings for updating the database. Left side is mapping from gateway,
      * right side is column in database.
@@ -58,16 +63,18 @@ class RequiredClientInfo extends Component
         'contact_phone' => 'phone',
     ];
 
-    public $show_form = true;
+    public $show_form = false;
 
     public function handleSubmit(array $data): bool
     {
         $rules = [];
 
         collect($this->fields)->map(function ($field) use (&$rules) {
+            if (!array_key_exists('filled', $field)) {
                 $rules[$field['name']] = array_key_exists('validation_rules', $field)
                     ? $field['validation_rules']
                     : 'required';
+            }
         });
 
         $validator = Validator::make($data, $rules);
@@ -120,19 +127,23 @@ class RequiredClientInfo extends Component
 
     public function checkFields()
     {
-        foreach ($this->fields as $field) {
+        foreach ($this->fields as $index => $field) {
             $_field = $this->mappings[$field['name']];
 
             if (Str::startsWith($field['name'], 'client_')) {
-                (empty($this->contact->client->{$_field}) || is_null($this->contact->client->{$_field}))
+                if (empty($this->contact->client->{$_field}) || is_null($this->contact->client->{$_field})) {
-                    ? $this->show_form = true
+                    $this->show_form = true;
-                    : $this->show_form = false;
+                } else {
+                    $this->fields[$index]['filled'] = true;
+                }
             }
 
             if (Str::startsWith($field['name'], 'contact_')) {
-                (empty($this->contact->{$_field}) || is_null($this->contact->{$_field}))
+                if ((empty($this->contact->{$_field}) || is_null($this->contact->{$_field}))) {
-                    ? $this->show_form = true
+                    $this->show_form = true;
-                    : $this->show_form = false;
+                } else {
+                    $this->fields[$index]['filled'] = true;
+                }
             }
         }
     }

app/PaymentDrivers/Authorize/AuthorizeCreditCard.php

@@ -12,7 +12,6 @@
 
 namespace App\PaymentDrivers\Authorize;
 
-use App\Events\Payment\PaymentWasCreated;
 use App\Jobs\Util\SystemLogger;
 use App\Models\ClientGatewayToken;
 use App\Models\GatewayType;
@@ -21,7 +20,6 @@ use App\Models\PaymentHash;
 use App\Models\PaymentType;
 use App\Models\SystemLog;
 use App\PaymentDrivers\AuthorizePaymentDriver;
-use App\Utils\Ninja;
 use App\Utils\Traits\MakesHash;
 
 /**
@@ -46,11 +44,11 @@ class AuthorizeCreditCard
                                     ->get();
 
         $data['tokens'] = $tokens;
-        $data['gateway'] = $this->authorize->company_gateway;
+        $data['gateway'] = $this->authorize;
         $data['public_client_id'] = $this->authorize->init()->getPublicClientKey();
         $data['api_login_id'] = $this->authorize->company_gateway->getConfigField('apiLoginId');
 
-        return render('gateways.authorize.credit_card_payment', $data);
+        return render('gateways.authorize.credit_card.pay', $data);
     }
 
     public function processPaymentResponse($request)
@@ -97,7 +95,6 @@ class AuthorizeCreditCard
 
         /*Refactor and push to BaseDriver*/
         if ($data['response'] != null && $data['response']->getMessages()->getResultCode() == 'Ok') {
-
             $this->storePayment($payment_hash, $data);
 
             $vars = [
@@ -184,7 +181,8 @@ class AuthorizeCreditCard
             SystemLog::CATEGORY_GATEWAY_RESPONSE,
             SystemLog::EVENT_GATEWAY_SUCCESS,
             SystemLog::TYPE_AUTHORIZE,
-            $this->authorize->client);
+            $this->authorize->client
+        );
 
         return redirect()->route('client.payments.show', ['payment' => $this->encodePrimaryKey($payment->id)]);
     }

app/PaymentDrivers/Authorize/AuthorizePaymentMethod.php

@@ -81,7 +81,7 @@ class AuthorizePaymentMethod
         $data['public_client_id'] = $this->authorize->init()->getPublicClientKey();
         $data['api_login_id'] = $this->authorize->company_gateway->getConfigField('apiLoginId');
 
-        return render('gateways.authorize.add_credit_card', $data);
+        return render('gateways.authorize.credit_card.authorize', $data);
     }
 
     public function authorizeBankTransfer()

app/PaymentDrivers/AuthorizePaymentDriver.php

@@ -68,6 +68,12 @@ class AuthorizePaymentDriver extends BaseDriver
         return [
             ['name' => 'client_name', 'label' => ctrans('texts.name'), 'type' => 'text', 'validation' => 'required|min:2'],
             ['name' => 'contact_email', 'label' => ctrans('texts.email'), 'type' => 'text', 'validation' => 'required|email:rfc'],
+            ['name' => 'client_address_line_1', 'label' => ctrans('texts.address1'), 'type' => 'text', 'validation' => 'required'],
+            ['name' => 'client_address_line_2', 'label' => ctrans('texts.address1'), 'type' => 'text', 'validation' => 'sometimes'],
+            ['name' => 'client_city', 'label' => ctrans('texts.city'), 'type' => 'text', 'validation' => 'required'],
+            ['name' => 'client_state', 'label' => ctrans('texts.state'), 'type' => 'text', 'validation' => 'required'],
+            ['name' => 'client_postal_code', 'label' => ctrans('texts.postal_code'), 'type' => 'text', 'validation' => 'required'],
+            ['name' => 'client_country_id', 'label' => ctrans('texts.country'), 'type' => 'select', 'validation' => 'required'],
         ];
     }
 

app/PaymentDrivers/Stripe/SOFORT.php

@@ -31,6 +31,11 @@ class SOFORT
         $this->stripe = $stripe;
     }
 
+    public function authorizeView($data)
+    {
+        return render('gateways.stripe.sofort.authorize', $data);
+    }
+
     public function paymentView(array $data)
     {
         $data['gateway'] = $this->stripe;

app/PaymentDrivers/StripePaymentDriver.php

@@ -21,6 +21,7 @@ use App\Models\GatewayType;
 use App\Models\Payment;
 use App\Models\PaymentHash;
 use App\Models\SystemLog;
+use App\PaymentDrivers\Stripe\ACH;
 use App\PaymentDrivers\Stripe\Alipay;
 use App\PaymentDrivers\Stripe\Charge;
 use App\PaymentDrivers\Stripe\CreditCard;
@@ -56,7 +57,7 @@ class StripePaymentDriver extends BaseDriver
 
     public static $methods = [
         GatewayType::CREDIT_CARD => CreditCard::class,
-        GatewayType::BANK_TRANSFER => SOFORT::class,
+        GatewayType::BANK_TRANSFER => ACH::class,
         GatewayType::ALIPAY => Alipay::class,
         GatewayType::SOFORT => SOFORT::class,
         GatewayType::APPLE_PAY => 1, // TODO

app/Utils/HtmlEngine.php

@@ -123,7 +123,7 @@ class HtmlEngine
             $data['$number'] = ['value' => $this->entity->number ?: ' ', 'label' => ctrans('texts.invoice_number')];
             $data['$entity.terms'] = ['value' => $this->entity->terms ?: ' ', 'label' => ctrans('texts.invoice_terms')];
             $data['$terms'] = &$data['$entity.terms'];
-            $data['$view_link'] = ['value' => '<a href="'.$this->invitation->getLink().'">'.ctrans('texts.view_invoice').'</a>', 'label' => ctrans('texts.view_invoice')];
+            $data['$view_link'] = ['value' => '<a class="button" href="'.$this->invitation->getLink().'">'.ctrans('texts.view_invoice').'</a>', 'label' => ctrans('texts.view_invoice')];
             $data['$view_url'] = ['value' => $this->invitation->getLink(), 'label' => ctrans('texts.view_invoice')];
         }
 
@@ -132,7 +132,7 @@ class HtmlEngine
             $data['$number'] = ['value' => $this->entity->number ?: '&nbsp;', 'label' => ctrans('texts.quote_number')];
             $data['$entity.terms'] = ['value' => $this->entity->terms ?: '&nbsp;', 'label' => ctrans('texts.quote_terms')];
             $data['$terms'] = &$data['$entity.terms'];
-            $data['$view_link'] = ['value' => '<a href="'.$this->invitation->getLink().'">'.ctrans('texts.view_quote').'</a>', 'label' => ctrans('texts.view_quote')];
+            $data['$view_link'] = ['value' => '<a class="button" href="'.$this->invitation->getLink().'">'.ctrans('texts.view_quote').'</a>', 'label' => ctrans('texts.view_quote')];
             $data['$view_url'] = ['value' => $this->invitation->getLink(), 'label' => ctrans('texts.view_quote')];
         }
 
@@ -141,7 +141,7 @@ class HtmlEngine
             $data['$number'] = ['value' => $this->entity->number ?: '&nbsp;', 'label' => ctrans('texts.credit_number')];
             $data['$entity.terms'] = ['value' => $this->entity->terms ?: '&nbsp;', 'label' => ctrans('texts.credit_terms')];
             $data['$terms'] = &$data['$entity.terms'];
-            $data['$view_link'] = ['value' => '<a href="'.$this->invitation->getLink().'">'.ctrans('texts.view_credit').'</a>', 'label' => ctrans('texts.view_credit')];
+            $data['$view_link'] = ['value' => '<a class="button" href="'.$this->invitation->getLink().'">'.ctrans('texts.view_credit').'</a>', 'label' => ctrans('texts.view_credit')];
             $data['$view_url'] = ['value' => $this->invitation->getLink(), 'label' => ctrans('texts.view_credit')];
             // $data['$view_link']          = ['value' => $this->invitation->getLink(), 'label' => ctrans('texts.view_credit')];
         }

composer.json

@@ -38,7 +38,6 @@
         "composer/composer": "^2",
         "czproject/git-php": "^3.17",
         "doctrine/dbal": "^2.10",
-        "fedeisas/laravel-mail-css-inliner": "^3",
         "fideloper/proxy": "^4.2",
         "fzaninotto/faker": "^1.4",
         "google/apiclient": "^2.7",

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": "0afe2d541cb6e16cfb9d29faf3425c2d",
+    "content-hash": "94ab2953278081e3fdf663e1e7cf14c4",
     "packages": [
         {
             "name": "asgrim/ofxparser",
@@ -1657,66 +1657,6 @@
             ],
             "time": "2020-12-29T14:50:06+00:00"
         },
-        {
-            "name": "fedeisas/laravel-mail-css-inliner",
-            "version": "3.1",
-            "source": {
-                "type": "git",
-                "url": "https://github.com/fedeisas/laravel-mail-css-inliner.git",
-                "reference": "263f395b46ef9666151ac78daf429632b0b2e2c3"
-            },
-            "dist": {
-                "type": "zip",
-                "url": "https://api.github.com/repos/fedeisas/laravel-mail-css-inliner/zipball/263f395b46ef9666151ac78daf429632b0b2e2c3",
-                "reference": "263f395b46ef9666151ac78daf429632b0b2e2c3",
-                "shasum": ""
-            },
-            "require": {
-                "ext-dom": "*",
-                "illuminate/mail": "^7.4 || ^8.0",
-                "illuminate/support": "^7.4 || ^8.0",
-                "php": "^7.2.5",
-                "tijsverkoyen/css-to-inline-styles": "~2.0"
-            },
-            "require-dev": {
-                "phpunit/phpunit": "^8.5",
-                "swiftmailer/swiftmailer": "^6.0"
-            },
-            "type": "library",
-            "extra": {
-                "laravel": {
-                    "providers": [
-                        "Fedeisas\\LaravelMailCssInliner\\LaravelMailCssInlinerServiceProvider"
-                    ]
-                }
-            },
-            "autoload": {
-                "psr-4": {
-                    "Fedeisas\\LaravelMailCssInliner\\": "src/"
-                }
-            },
-            "notification-url": "https://packagist.org/downloads/",
-            "license": [
-                "MIT"
-            ],
-            "authors": [
-                {
-                    "name": "Fede Isas",
-                    "email": "fedeisas@hotmail.com"
-                }
-            ],
-            "description": "Inline the CSS of your HTML emails using Laravel",
-            "keywords": [
-                "css",
-                "laravel",
-                "mailer"
-            ],
-            "support": {
-                "issues": "https://github.com/fedeisas/laravel-mail-css-inliner/issues",
-                "source": "https://github.com/fedeisas/laravel-mail-css-inliner/tree/3.1"
-            },
-            "time": "2020-09-12T05:00:14+00:00"
-        },
         {
             "name": "fideloper/proxy",
             "version": "4.4.1",

public/flutter_service_worker.js

@@ -27,7 +27,7 @@ const RESOURCES = {
 "assets/AssetManifest.json": "659dcf9d1baf3aed3ab1b9c42112bf8f",
 "version.json": "6b7a4ad416a3730ae32b64e007cef7f3",
 "favicon.png": "dca91c54388f52eded692718d5a98b8b",
-"main.dart.js": "1e4432ea8822b383364c591ad3798039",
+"main.dart.js": "970638cb2278a4390edc11bc44e7adf8",
 "manifest.json": "77215c1737c7639764e64a192be2f7b8",
 "/": "23224b5e03519aaa87594403d54412cf",
 "icons/Icon-512.png": "0f9aff01367f0a0c69773d25ca16ef35",

public/mix-manifest.json

@@ -1,6 +1,6 @@
 {
     "/js/app.js": "/js/app.js?id=a33a5a58bfc6e2174841",
-    "/css/app.css": "/css/app.css?id=7f1ae2f30438771b9dbe",
+    "/css/app.css": "/css/app.css?id=0bc73459b671b24af838",
     "/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/payment_methods/authorize-authorize-card.js": "/js/clients/payment_methods/authorize-authorize-card.js?id=cddcd46c630c71737bda",

resources/lang/en/texts.php

@@ -3262,6 +3262,7 @@ return [
     'cancelled' => 'Cancelled',
 
     'checkout_authorize_label' => 'Checkout.com can be can saved as payment method for future use, once you complete your first transaction. Don\'t forget to check "Store credit card details" during payment process.',
+    'sofort_authorize_label' => 'Bank account (SOFORT) can be can saved as payment method for future use, once you complete your first transaction. Don\'t forget to check "Store payment details" during payment process.',
 
     'node_status' => 'Node status',
     'npm_status' => 'NPM status',

resources/views/email/auth/password-reset.blade.php

@@ -1,22 +1,19 @@
-@component('email.template.master', ['design' => 'light'])
+@component('email.template.master', ['design' => 'light', 'whitelabel' => false])
 
     @slot('header')
-    @component('email.components.header', ['p' => '', 'logo' => 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        Hello!
-    @endcomponent
-
     @endslot
 
-You are receiving this email because we received a password reset request for your account.
+    <p>You are receiving this email because we received a password reset request for your account.</p>
 
-@component('email.components.button', ['url' => $link, 'show_link' => true])
+    <a href="{{ $link }}" target="_blank" class="button">
         Reset Password
-@endcomponent
+    </a>
 
+    <p>
+        If you’re having trouble clicking the "Reset Password" button, copy and paste the URL below into your web
+        browser:
+    </p>
 
-@component('email.components.footer', ['url' => 'https://invoiceninja.com', 'url_text' => '&copy; InvoiceNinja'])
-    If you’re having trouble clicking the "Reset Password" button, copy and paste the URL below into your web browser:
     <a href="{{ $link }}">{{ $link }}</a>
 @endcomponent
-
-@endcomponent

resources/views/email/auth/verify.blade.php

@@ -1,35 +1,12 @@
-@component('mail::layout')
+@component('email.template.master', ['design' => 'light', 'whitelabel' => false])
 
-{{-- Header --}}
     @slot('header')
-@component('mail::header', ['url' => config('app.url')])
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-Header Title
-@endcomponent
     @endslot
 
-{{-- Body --}}
+    <p>{{ ctrans('texts.confirmation_message') }}</p>
-{{ $user }}
-trans('texts.confirmation_message')
-
-@component('mail::button', ['url' => url("/user/confirm/{$user->confirmation_code}")])
-trans('texts.confirm')
-@endcomponent
-
-{{-- Subcopy --}}
-@isset($subcopy)
-@slot('subcopy')
-@component('mail::subcopy')
-{{ $subcopy }}
-@endcomponent
-@endslot
-@endisset
-
-
-{{-- Footer --}}
-@slot('footer')
-@component('mail::footer')
-© {{ date('Y') }} {{ config('ninja.app_name') }}.
-@endcomponent
-@endslot
 
+    <a href="{{ url("/user/confirm/{$user->confirmation_code}") }}" target="_blank" class="button">
+        {{ ctrans('texts.confirm') }}
+    </a>
 @endcomponent

resources/views/email/components/header.blade.php

@@ -1,14 +1,3 @@
-<div id="header" class="border-b {{ isset($logo) ? 'p-6' : '' }} flex justify-center">
 @isset($logo)
-        <img src="{{ $logo }}" style="height: 6rem;">
+    <img src="{{ $logo }}" style="height: 4rem;">
 @endisset
-</div>
-
-<div class="flex flex-col items-center mt-8 mb-4">
-    <h1 id="title" class="text-2xl md:text-3xl mt-5">
-        {{ $slot }}
-    </h1>
-    @isset($p)
-        {!! $p !!}
-    @endisset
-</div>

resources/views/email/import/completed.blade.php

@@ -1,25 +1,16 @@
 @component('email.template.master', ['design' => 'light', 'settings' => $settings])
-
     @slot('header')
-    @component('email.components.header')
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        Import completed
-    @endcomponent
     @endslot
 
-@slot('greeting')
+    <h1>Import completed</h1>
-	Hello,
+    <p>Hello, here is the output of your recent import job.</p>
-@endslot
-
-Here is the output of your recent import job. <br><br>
 
     @if(isset($clients) && count($clients) >=1)
-
         <h3>Clients Imported: {{ count($clients) }} </h3>
-
     @endif
 
     @if(isset($errors['clients']) && count($errors['clients']) >=1)
-
         <h3>Client Errors</h3>
 
         <ul>
@@ -36,7 +27,6 @@ Here is the output of your recent import job. <br><br>
     @endif
 
     @if(isset($errors['invoices']) && count($errors['invoices']) >=1)
-
         <h3>Invoices Errors</h3>
 
         <ul>
@@ -47,13 +37,10 @@ Here is the output of your recent import job. <br><br>
     @endif
 
     @if(isset($products) && count($products) >=1)
-
         <h3>Products Imported: {{ count($products) }} </h3>
-
     @endif
 
     @if(isset($errors['products']) && count($errors['products']) >=1)
-
         <h3>Client Errors</h3>
 
         <ul>
@@ -63,20 +50,7 @@ Here is the output of your recent import job. <br><br>
         </ul>
     @endif
 
-@component('email.components.button', ['url' => url('/')])
+    <a href="{{ url('/') }}" target="_blank" class="button">Visit portal</a>
-    Visit portal
+
-@endcomponent
+    <p>Thank you, <br/> Invoice Ninja.</p>
-
-
-@slot('signature')
-Thank you, <br>
-Invoice Ninja    
-@endslot
-
-@slot('footer')
-    @component('email.components.footer', ['url' => 'https://invoiceninja.com', 'url_text' => '&copy; InvoiceNinja'])
-        For any info, please visit InvoiceNinja.
-    @endcomponent
-@endslot
-
 @endcomponent

resources/views/email/invoices/paid.blade.php

@@ -1,26 +1,10 @@
 @component('email.template.master', ['design' => 'light', 'settings' => $settings])
-
     @slot('header')
-    @component('email.components.header', ['p' => 'Payment for your invoice has been completed!', 'logo' => 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        Invoice paid
-    @endcomponent
-
     @endslot
 
-@slot('greeting')
+    <h1>Payment for your invoice has been completed!</h1>
-    Hello,
+    <p>We want to inform you that payment was completed for your invoice.</p>
-@endslot
-
-We want to inform you that payment was completed for your invoice. Amount: $10,000.00.
-
-@component('email.components.button', ['url' => 'https://invoiceninja.com', 'show_link' => true])
-    Visit InvoiceNinja
-@endcomponent
-
-@slot('below_card')
-    @component('email.components.footer', ['url' => 'https://invoiceninja.com', 'url_text' => '&copy; InvoiceNinja'])
-        For any info, please visit InvoiceNinja.
-    @endcomponent
-@endslot    
 
+    <a href="https://invoiceninja.com" target="_blank" class="button">Visit Invoice Ninja</a>
 @endcomponent

resources/views/email/migration/completed.blade.php

@@ -1,31 +1,13 @@
 @component('email.template.master', ['design' => 'light', 'settings' => $settings])
 
     @slot('header')
-    @component('email.components.header')
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        Migration completed
-    @endcomponent
     @endslot
 
-@slot('greeting')
+    <h1>Migration completed</h1>
-	Hello,
+    <p>We're happy to inform you that migration has been completed successfully. It is ready for you to review it.</p>
-@endslot
 
-We're happy to inform you that migration has been completed successfully. It is ready for you to review it.
+    <a href="{{ url('/') }}" target="_blank" class="button">Visit portal</a>
-
-@component('email.components.button', ['url' => url('/')])
-    Visit portal
-@endcomponent
-
-
-@slot('signature')
-Thank you, <br>
-Invoice Ninja    
-@endslot
-
-@slot('footer')
-    @component('email.components.footer', ['url' => 'https://invoiceninja.com', 'url_text' => '&copy; InvoiceNinja'])
-        For any info, please visit InvoiceNinja.
-    @endcomponent
-@endslot
 
+    <p>Thank you, <br/> Invoice Ninja</p>
 @endcomponent

resources/views/email/migration/failed.blade.php

@@ -1,7 +1,13 @@
-Whoops!
+@component('email.template.master', ['design' => 'light', 'settings' => $settings])
-Looks like your migration failed.
+    @slot('header')
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
+    @endslot
+
+    <h1>Whoops, migration failed.</h1>
+    <p>Looks like your migration failed. Here's the error message:</p>
 
     <pre>
         {!! $exception->getMessage() !!}
         {!! $content !!}
     </pre>
+@endcomponent

resources/views/email/quotes/approved.blade.php

@@ -1,26 +1,10 @@
 @component('email.template.master', ['design' => 'light', 'settings' => $settings])
-
     @slot('header')
-    @component('email.components.header', ['p' => 'Your quote was approved!', 'logo' => 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        Quote approved
-    @endcomponent
-
     @endslot
 
-@slot('greeting')
+    <h1>Quote approved!</h1>
-    Hello,
+    <p>We want to inform you that quote was approved.</p>
-@endslot
-
-We want to inform you that quote was approved. Put nicer text here.
-
-@component('email.components.button', ['url' => 'https://invoiceninja.com', 'show_link' => true])
-    Visit InvoiceNinja
-@endcomponent
-
-@slot('below_card')
-    @component('email.components.footer', ['url' => 'https://invoiceninja.com', 'url_text' => '&copy; InvoiceNinja'])
-        For any info, please visit InvoiceNinja.
-    @endcomponent
-@endslot    
 
+    <a href="https://invoiceninja.com" target="_blank" class="button">Visit Invoice Ninja</a>
 @endcomponent

resources/views/email/support/cancellation.blade.php

@@ -1,30 +1,7 @@
-@component('mail::layout')
+@component('email.template.master', ['design' => 'light', 'settings' => $settings])
-
-{{-- Header --}}
     @slot('header')
-@component('mail::header', ['url' => config('app.url')])
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-Header Title
-@endcomponent
     @endslot
 
-{{-- Body --}}
     {{ $message }}
-
-{{-- Subcopy --}}
-@isset($subcopy)
-@slot('subcopy')
-@component('mail::subcopy')
-{{ $subcopy }}
-@endcomponent
-@endslot
-@endisset
-
-
-{{-- Footer --}}
-@slot('footer')
-@component('mail::footer')
-© {{ date('Y') }} {{ config('ninja.app_name') }}.
-@endcomponent
-@endslot
-
 @endcomponent

resources/views/email/support/message.blade.php

@@ -1,10 +1,6 @@
-@component('mail::layout')
+@component('email.template.master', ['design' => 'light', 'settings' => $settings])
-
-{{-- Header --}}
     @slot('header')
-@component('mail::header', ['url' => config('app.url')])
+        @include('email.components.header', ['logo' => 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-Header Title
-@endcomponent
     @endslot
 
     {{-- Body --}}
@@ -20,21 +16,4 @@ Header Title
             @endforeach
         </details>
     @endif
-{{-- Subcopy --}}
-@isset($subcopy)
-@slot('subcopy')
-@component('mail::subcopy')
-{{ $subcopy }}
-@endcomponent
-@endslot
-@endisset
-
-
-{{-- Footer --}}
-@slot('footer')
-@component('mail::footer')
-© {{ date('Y') }} {{ config('ninja.app_name') }}.
-@endcomponent
-@endslot
-
 @endcomponent

resources/views/email/template/dark.blade.php

@@ -1,22 +1,15 @@
 @component('email.template.master', ['design' => 'dark', 'settings' => $settings, 'whitelabel' => $whitelabel])
 
     @slot('header')
-    @component('email.components.header', ['p' => $body, 'logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
+        @include('email.components.header', ['logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        
-        @if(isset($title))
-        {{$title}}
-        @endif
-
-    @endcomponent
-
-    @if($footer)
-        @component('email.components.button', ['url' => $view_link])
-            {{$view_text}}
-        @endcomponent
-    @endif
-
-
     @endslot
 
+    {!! $body !!}
+
+    @slot('below_card')
+        @if($signature)
+            {{ $signature }}
+        @endif
+    @endslot
 
 @endcomponent

resources/views/email/template/light.blade.php

@@ -1,30 +1,15 @@
 @component('email.template.master', ['design' => 'light', 'settings' => $settings, 'whitelabel' => $whitelabel])
 
 @slot('header')
-    @component('email.components.header', ['p' => $body, 'logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
+    @include('email.components.header', ['logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
-        
-        @if(isset($title))
-            {{$title}}
-        @endif
-
-    @endcomponent
-
-
-    @if($footer)
-        @component('email.components.button', ['url' => $view_link])
-            {{$view_text}}
-        @endcomponent
-    @endif
-
-
 @endslot
 
-@slot('below_card')
+{!! $body !!}
 
+@slot('below_card')
     @if($signature)
         {{ $signature }}
     @endif
-
 @endslot
 
 @endcomponent

resources/views/email/template/master.blade.php

@@ -1,78 +1,95 @@
 @php
-if(!isset($design)) $design = 'light';
+    if(!isset($design)) {
+        $design = 'light';
+    }
 @endphp
 
-<!DOCTYPE html>
+    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-<html lang="en">
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
 
 <head>
-    <meta charset="UTF-8">
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <title>@yield('title')</title>
 </head>
 
 <style>
     :root {
-    @isset($settings)
+        --primary-color: {{ isset($settings) ? $settings->primary_color : '#4caf50' }};
-    --primary-color: {{ $settings->primary_color }};
-    @else
-    --primary-color: #4caf50;
-    @endisset
     }
 
-  .border-primary {
+    .primary-color-bg {
-    border-color: var(--primary-color);
+        background-color: var(--primary-color);
+    }
+
+    #email-content h1, h2, h3, h4 {
+        display: block;
+        color: {{ $design == 'light' ? 'black' : 'white' }};
+        padding-bottom: 20px;
+        padding-top: 20px;
+    }
+
+    #email-content p {
+        display: block;
+        color: {{ $design == 'light' ? 'black' : 'white' }};
+        padding-bottom: 20px;
+        padding-top: 20px;
+    }
+
+    .button {
+        background-color: var(--primary-color);
+        color: white;
+        padding: 10px 16px;
+        text-decoration: none;
+    }
+
+    #email-content a, .link {
+        word-break: break-all;
     }
 </style>
 
-@if($design == 'dark')
+<body style="margin: 0; padding: 0; background-color: {{ $design == 'light' ? '#F9FAFB' : '#111827' }};">
-<style>
+<table role="presentation" cellpadding="0" cellspacing="0" width="100%">
-  * {
+    <tr>
-    color: #cbd5e0 !important;
+        <td style="padding: 20px; font-family: Arial, sans-serif, 'Open Sans'">
-  }
+            <table align="center" cellpadding="0" cellspacing="0" width="600"
-</style>
+                   style="box-shadow: 0 1px 3px 0 rgba(0,0,0,.1), 0 1px 2px 0 rgba(0,0,0,.06)">
-@endif
+                <tr>
-
+                    <td align="center" bgcolor="#4caf50" class="primary-color-bg" style="padding: 40px 0 30px 0;">
-<body class="{{ $design == 'light' ? 'bg-gray-200' : 'bg-gray-800' }} my-10 font-sans {{ $design == 'light' ? 'text-gray-700' : 'text-gray-400' }}">
-  <div class="grid grid-cols-6">
-    <div class="col-span-4 col-start-2">
-      <div class="{{ $design == 'light' ? 'bg-white' : 'bg-gray-900' }} shadow border-t-2 {{ $design == 'light' ? 'border-primary' : 'border-gray-800' }}">
-        <div class="px-10 break-all">
                         {{ $header }}
-        </div>
+                    </td>
-        <div id="text" class="flex flex-col px-10 py-6">
+                </tr>
-          @isset($greeting)
+                <tr>
-          {{ $greeting }}
+                    <td bgcolor="{{ $design == 'light' ? '#ffffff' : '#1F2937'}}" style="padding: 40px 30px 40px 30px;">
-          @endisset
+                        <table cellpadding="0" cellspacing="0" width="100%" style="border-collapse: collapse;">
-
+                            <tr>
-          <div class="break-all">
+                                <td align="center" id="email-content">
                                     {{ $slot }}
-          </div>
+                                </td>
-
+                            </tr>
-          @isset($signature)
+                        </table>
-          {{ $signature }}
+                    </td>
-          @endisset
+                </tr>
-        </div>
+                <tr>
-      </div>
-
-      @isset($below_card)
-      <div id="bottomText" class="px-10 my-4 text-center">
-        {{ $below_card }}
-      </div>
-      @endisset
-
-    </div>
-  </div>
-
-  <!-- Whitelabel -->
                     @isset($whitelabel)
                         @if(!$whitelabel)
-      <div style="display: flex; flex-direction: row; justify-content: center; margin-top: 1rem; margin-bottom: 1rem;">
+                            <td bgcolor="{{ $design == 'light' ? '#ffffff' : '#1F2937'}}" style="padding-top: 20px; padding-bottom: 20px;" align="center">
+                                <p style="margin: 0; border-top: 1px solid {{ $design == 'light' ? '#F3F4F6' : '#374151' }}; padding-top: 20px;">
                                     <a href="https://invoiceninja.com" target="_blank">
-            <img style="height: 4rem; {{ $design == 'dark' ? 'filter: invert(100%);' : '' }}" src="{{ asset('images/created-by-invoiceninja-new.png') }}" alt="Invoice Ninja">
+                                        <img
+                                            style="height: 4rem; {{ $design == 'dark' ? 'filter: invert(100%);' : '' }}"
+                                            src="{{ asset('images/created-by-invoiceninja-new.png') }}"
+                                            alt="Invoice Ninja">
                                     </a>
-      </div>
+                                </p>
+                            </td>
                         @endif
                     @endif
+                </tr>
+            </table>
+        </td>
+    </tr>
+</table>
 </body>
+
 </html>

resources/views/email/template/plain.blade.php

@@ -1,30 +1,47 @@
-<!DOCTYPE html>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-<html lang="{{ App::getLocale() }}" class="bg-white">
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
 
 <head>
-	<meta charset="utf-8">
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>Invoice Ninja</title>
 </head>
 
-<body class="bg-white p-4">
+<body>
+<table role="presentation" cellpadding="0" cellspacing="0" width="100%">
+    <tr>
+        <td style="font-family: Arial, sans-serif, 'Open Sans'">
+            <table cellpadding="0" cellspacing="0" width="100%">
+                <tr>
+                    <td>
+                        <table cellpadding="0" cellspacing="0" width="100%">
+                            <tr>
+                                <td id="email-content">
                                     {!! $body !!}
-
+                                </td>
-	@if($signature)
+                            </tr>
-		<div style="margin-top: 20px">
+                        </table>
-			{!! $signature !!}
+                    </td>
-		</div>
+                </tr>
-	@endif
+                <tr>
-</body>
+                    @isset($whitelabel)
-
-<footer class="p-4">
-	{!! $footer !!}
-</footer>
-
                         @if(!$whitelabel)
-	<div style="display: block; margin-top: 1rem; margin-bottom: 1rem;">
+                            <td>
+                                <p>
                                     <a href="https://invoiceninja.com" target="_blank">
                                         {{ __('texts.ninja_email_footer', ['site' => 'Invoice Ninja']) }}
                                     </a>
-	</div>
+                                </p>
+                            </td>
                         @endif
+                    @endif
+                </tr>
+            </table>
+        </td>
+    </tr>
+</table>
+</body>
 
 </html>
+

resources/views/portal/ninja2020/components/livewire/required-client-info.blade.php

@@ -12,13 +12,27 @@
 
         <form wire:submit.prevent="handleSubmit(Object.fromEntries(new FormData($event.target)))">
             @foreach($fields as $field)
+                @if(!array_key_exists('filled', $field))
                     @component('portal.ninja2020.components.general.card-element', ['title' => $field['label']])
+                        @if($field['name'] == 'client_country_id' || $field['name'] == 'client_shipping_country_id')
+                            <select id="country" class="input w-full form-select" name="{{ $field['name'] }}">
+                                <option value="none"></option>
+
+                                @foreach($countries as $country)
+                                    <option value="{{ $country->id }}">
+                                        {{ $country->iso_3166_2 }} ({{ $country->name }})
+                                    </option>
+                                @endforeach
+                            </select>
+                        @else
                             <input class="input w-full" type="{{ $field['type'] }}" name="{{ $field['name'] }}">
+                        @endif
 
                         @if(session()->has('validation_errors') && array_key_exists($field['name'], session('validation_errors')))
                             <p class="mt-2 text-gray-900 border-red-300 px-2 py-1 bg-gray-100">{{ session('validation_errors')[$field['name']][0] }}</p>
                         @endif
                     @endcomponent
+                @endif
             @endforeach
 
             @component('portal.ninja2020.components.general.card-element-single')

resources/views/portal/ninja2020/gateways/authorize/add_credit_card.blade.php

@@ -1,88 +0,0 @@
-@extends('portal.ninja2020.layout.app')
-@section('meta_title', ctrans('texts.add_credit_card'))
-
-@push('head')
-<meta name="authorize-public-key" content="{{ $public_client_id }}">
-<meta name="authorize-login-id" content="{{ $api_login_id }}">
-
-<meta name="year-invalid" content="{{ ctrans('texts.year_invalid') }}">
-<meta name="month-invalid" content="{{ ctrans('texts.month_invalid') }}">
-<meta name="credit-card-invalid" content="{{ ctrans('texts.credit_card_invalid') }}">
-
-
-<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">
-
-@endpush
-
-@section('body')
-<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->id }}">
-    <input type="hidden" name="payment_method_id" value="1">
-    <input type="hidden" name="gateway_response" id="gateway_response">
-    <input type="hidden" name="is_default" id="is_default">
-    <input type="hidden" name="dataValue" id="dataValue" />
-    <input type="hidden" name="dataDescriptor" id="dataDescriptor" />
-</form>
-<div class="container mx-auto">
-    <div class="grid grid-cols-6 gap-4">
-        <div class="col-span-6 md:col-start-2 md:col-span-3">
-            <div class="alert alert-failure mb-4" hidden id="errors"></div>
-            @if(!Request::isSecure())
-            <p class="alert alert-failure">{{ ctrans('texts.https_required') }}</p>
-            @endif
-            <div class="bg-white shadow overflow-hidden sm:rounded-lg">
-                <div class="px-4 py-5 border-b border-gray-200 sm:px-6">
-                    <h3 class="text-lg leading-6 font-medium text-gray-900">
-                        {{ ctrans('texts.add_credit_card') }}
-                    </h3>
-                    <p class="mt-1 max-w-2xl text-sm leading-5 text-gray-500" translate>
-                        {{ ctrans('texts.authorize_for_future_use') }}
-                    </p>
-                </div>
-                <div>
-                    <dl>
-                        <div class="bg-gray-50 px-4 py-5 sm:px-6">
-                            <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 flex justify-center">
-                                @include('portal.ninja2020.gateways.authorize.credit_card')
-                            </dd>
-                        </div>
-                        <div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
-                            <dt class="text-sm leading-5 font-medium text-gray-500">
-                                {{ ctrans('texts.save_as_default') }}
-                            </dt>
-                            <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                <input type="checkbox" class="form-checkbox cursor-pointer" name="proxy_is_default" id="proxy_is_default" />
-                            </dd>
-                        </div>
-                        <div class="bg-gray-50 px-4 py-5 flex justify-end">
-                            <div id="errors"></div>
-                            <button type="primary" class="button button-primary bg-primary" id="card_button">
-                                <svg class="animate-spin h-5 w-5 text-white hidden" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
-                                    <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                                    <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
-                                </svg>
-                                <span>{{ __('texts.save') }}</span>
-                            </button>
-                        </div>
-                    </dl>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-@endsection
-
-@push('footer')
-
-@if($gateway->getConfigField('testMode'))
-<script src="https://jstest.authorize.net/v1/Accept.js" charset="utf-8"></script>
-@else
-<script src="https://js.authorize.net/v1/Accept.js" charset="utf-8"></script>
-@endif
-
-<script src="{{ asset('js/clients/payment_methods/authorize-authorize-card.js') }}"></script>
-@endpush

resources/views/portal/ninja2020/gateways/authorize/credit_card.blade.php

@@ -1,10 +0,0 @@
-<div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6" style="display: flex!important; justify-content: center!important;">
-    <div class="card-js" id="my-card" data-capture-name="true">
-      <input class="name" id="cardholder_name" name="card-holders-name" placeholder="{{ ctrans('texts.name')}}">
-      <input class="card-number my-custom-class" id="card_number" name="card-number">
-      <input class="expiry-month" name="expiry-month" id="expiration_month">
-      <input class="expiry-year" name="expiry-year" id="expiration_year">
-      <input class="cvc" name="cvc" id="cvv">
-    </div>
-    <div id="errors"></div>
-</div>

resources/views/portal/ninja2020/gateways/authorize/credit_card/authorize.blade.php

@@ -0,0 +1,54 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' => ctrans('texts.credit_card')])
+
+@section('gateway_head')
+    <meta name="authorize-public-key" content="{{ $public_client_id }}">
+    <meta name="authorize-login-id" content="{{ $api_login_id }}">
+    <meta name="year-invalid" content="{{ ctrans('texts.year_invalid') }}">
+    <meta name="month-invalid" content="{{ ctrans('texts.month_invalid') }}">
+    <meta name="credit-card-invalid" content="{{ ctrans('texts.credit_card_invalid') }}">
+
+    <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.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"
+          method="post" id="server_response">
+        @csrf
+
+        <input type="hidden" name="company_gateway_id" value="{{ $gateway->id }}">
+        <input type="hidden" name="payment_method_id" value="1">
+        <input type="hidden" name="gateway_response" id="gateway_response">
+        <input type="hidden" name="is_default" id="is_default">
+        <input type="hidden" name="dataValue" id="dataValue"/>
+        <input type="hidden" name="dataDescriptor" id="dataDescriptor"/>
+    </form>
+
+    @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>
+
+    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.method')])
+        {{ ctrans('texts.credit_card') }}
+    @endcomponent
+
+    @include('portal.ninja2020.gateways.authorize.includes.credit_card')
+
+    @component('portal.ninja2020.gateways.includes.pay_now', ['id' => 'card_button'])
+        {{ ctrans('texts.add_payment_method') }}
+    @endcomponent
+@endsection
+
+@section('gateway_footer')
+    @if($gateway->getConfigField('testMode'))
+        <script src="https://jstest.authorize.net/v1/Accept.js" charset="utf-8"></script>
+    @else
+        <script src="https://js.authorize.net/v1/Accept.js" charset="utf-8"></script>
+    @endif
+
+    <script src="{{ asset('js/clients/payment_methods/authorize-authorize-card.js') }}"></script>
+@endsection

resources/views/portal/ninja2020/gateways/authorize/credit_card/pay.blade.php

@@ -0,0 +1,55 @@
+@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="authorize-public-key" content="{{ $public_client_id }}">
+    <meta name="authorize-login-id" content="{{ $api_login_id }}">
+
+    <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="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="gateway_response" id="gateway_response">
+        <input type="hidden" name="dataValue" id="dataValue"/>
+        <input type="hidden" name="dataDescriptor" id="dataDescriptor"/>
+        <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'] }}"/>
+    </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')
+
+    @if($token)
+        @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.credit_card')])
+            {{ strtoupper($token->meta->brand) }} - **** {{ $token->meta->last4 }}
+        @endcomponent
+
+        @include('portal.ninja2020.gateways.includes.pay_now', ['id' => 'card_button', 'class' => 'pay_now_button', 'data' => ['id' => $token->hashed_id]])
+    @else
+        @include('portal.ninja2020.gateways.authorize.includes.credit_card')
+        @include('portal.ninja2020.gateways.includes.pay_now', ['id' => 'card_button'])
+    @endif
+@endsection
+
+@section('gateway_footer')
+    @if($gateway->company_gateway->getConfigField('testMode'))
+        <script src="https://jstest.authorize.net/v1/Accept.js" charset="utf-8"></script>
+    @else
+        <script src="https://js.authorize.net/v1/Accept.js" charset="utf-8"></script>
+    @endif
+
+    <script src="{{ asset('js/clients/payments/authorize-credit-card-payment.js') }}"></script>
+@endsection

resources/views/portal/ninja2020/gateways/authorize/credit_card_payment.blade.php

@@ -1,154 +0,0 @@
-@extends('portal.ninja2020.layout.app')
-@section('meta_title', ctrans('texts.payment_type_credit_card'))
-
-@push('head')
-    <meta name="authorize-public-key" content="{{ $public_client_id }}">
-    <meta name="authorize-login-id" content="{{ $api_login_id }}">
-    <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">
-
-@endpush
-
-@section('body')
-    <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->id }}">
-        <input type="hidden" name="payment_method_id" value="1">
-        <input type="hidden" name="gateway_response" id="gateway_response">
-        <input type="hidden" name="dataValue" id="dataValue" />
-        <input type="hidden" name="dataDescriptor" id="dataDescriptor" />
-        <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'] }}" />
-    </form>
-    <div class="container mx-auto">
-        <div class="grid grid-cols-6 gap-4">
-            <div class="col-span-6 md:col-start-2 md:col-span-4">
-                <div class="alert alert-failure mb-4" hidden id="errors"></div>
-                <div class="bg-white shadow overflow-hidden sm:rounded-lg">
-                    <div class="px-4 py-5 border-b border-gray-200 sm:px-6">
-                        <h3 class="text-lg leading-6 font-medium text-gray-900">
-                            {{ ctrans('texts.enter_payment') }}
-                        </h3>
-                    </div>
-                    <div>
-                        @if($tokens->count() == 0)
-                        <dl>
-                            <div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
-                                <dt class="text-sm leading-5 font-medium text-gray-500">
-                                    {{ ctrans('texts.subtotal') }}
-                                </dt>
-                                <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                    {{ App\Utils\Number::formatMoney($total['invoice_totals'], $client) }}
-                                </dd>
-                                <dt class="text-sm leading-5 font-medium text-gray-500">
-                                    {{ ctrans('texts.gateway_fees') }}
-                                </dt>
-                                <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                    {{ App\Utils\Number::formatMoney($total['fee_total'], $client) }}
-                                </dd>
-                                <dt class="text-sm leading-5 font-medium text-gray-500">
-                                    {{ ctrans('texts.total') }}
-                                </dt>
-                                <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                    {{ App\Utils\Number::formatMoney($total['amount_with_fee'], $client) }}
-                                </dd>
-                            </div>
-        
-                            @include('portal.ninja2020.gateways.authorize.credit_card')
-                            
-                            <div class="{{ ($gateway->token_billing == 'optin' || $gateway->token_billing == 'optout') ? 'sm:grid' : 'hidden' }} bg-gray-50 px-4 py-5 sm:grid-cols-3 sm:gap-4 sm:px-6">
-                                <dt class="text-sm leading-5 font-medium text-gray-500">
-                                    {{ ctrans('texts.token_billing_checkbox') }}
-                                </dt>
-                                <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                    <label class="mr-4">
-                                        <input 
-                                            type="radio"
-                                            class="form-radio cursor-pointer" 
-                                            name="store_card_checkbox" 
-                                            id="proxy_is_default"
-                                            value="true"
-                                            {{ ($gateway->token_billing == 'always' || $gateway->token_billing == 'optout') ? 'checked' : '' }} />
-                                        <span class="ml-1 cursor-pointer">{{ ctrans('texts.yes') }}</span>
-                                    </label>
-                                    <label>
-                                        <input 
-                                            type="radio" 
-                                            class="form-radio cursor-pointer" 
-                                            name="store_card_checkbox" 
-                                            id="proxy_is_default" 
-                                            value="false"
-                                            {{ ($gateway->token_billing == 'off' || $gateway->token_billing == 'optin') ? 'checked' : '' }} />
-                                        <span class="ml-1 cursor-pointer">{{ ctrans('texts.no') }}</span>
-                                    </label>
-                                </dd>
-                            </div>
-                            <div class="bg-white px-4 py-5 flex justify-end">
-                                <button class="button button-primary bg-primary" id="card_button">
-                                    <svg class="animate-spin h-5 w-5 text-white hidden" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
-                                        <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                                        <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
-                                    </svg>
-                                    <span>{{ __('texts.pay_now') }}</span>
-                                </button>
-                            </div>
-                        </dl>
-                        @else
-
-                            <div>
-                                <dl>
-                                    <div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
-                                        <dt class="text-sm leading-5 font-medium text-gray-500">
-                                            {{ ctrans('texts.totals') }}
-                                        </dt>
-                                        <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                            {{ App\Utils\Number::formatMoney($total['invoice_totals'], $client) }}
-                                        </dd>
-                                        <dt class="text-sm leading-5 font-medium text-gray-500">
-                                            {{ ctrans('texts.gateway_fees') }}
-                                        </dt>
-                                        <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                            {{ App\Utils\Number::formatMoney($total['fee_total'], $client) }}
-                                        </dd>
-                                        <dt class="text-sm leading-5 font-medium text-gray-500">
-                                            {{ ctrans('texts.amount') }}
-                                        </dt>
-                                        <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                            {{ App\Utils\Number::formatMoney($total['amount_with_fee'], $client) }}
-                                        </dd>
-                                    </div>
-                                    @foreach($tokens as $token)
-                                    <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
-                                        <dt class="text-sm leading-5 font-medium text-gray-500">
-                                            {{ $token->meta->brand }} : {{ $token->meta->last4 }}
-                                        </dt>
-                                        <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                                            <button class="button button-primary bg-primary pay_now_button" data-id="{{ $token->hashed_id }}">{{ ctrans('texts.pay_now') }}</button>
-                                        </dd>
-                                    </div>
-                                    @endforeach 
-
-                                </dl>
-                            </div>
-
-                        @endif
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-@endsection
-
-@push('footer')
-
-    @if($gateway->getConfigField('testMode'))
-        <script src="https://jstest.authorize.net/v1/Accept.js" charset="utf-8"></script>
-    @else
-        <script src="https://js.authorize.net/v1/Accept.js" charset="utf-8"></script>
-    @endif
-
-    <script src="{{ asset('js/clients/payments/authorize-credit-card-payment.js') }}"></script>
-@endpush

resources/views/portal/ninja2020/gateways/authorize/includes/credit_card.blade.php

@@ -0,0 +1,12 @@
+<div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
+     style="display: flex!important; justify-content: center!important;">
+    <div class="card-js" id="my-card" data-capture-name="true">
+        <input class="name" id="cardholder_name" name="card-holders-name" placeholder="{{ ctrans('texts.name')}}">
+        <input class="card-number my-custom-class" id="card_number" name="card-number">
+        <input class="expiry-month" name="expiry-month" id="expiration_month">
+        <input class="expiry-year" name="expiry-year" id="expiration_year">
+        <input class="cvc" name="cvc" id="cvv">
+    </div>
+
+    <div id="errors"></div>
+</div>

resources/views/portal/ninja2020/gateways/includes/pay_now.blade.php

@@ -3,7 +3,8 @@
         @isset($form) form="{{ $form }}" @endisset
         type="{{ $type ?? 'button' }}"
         id="{{ $id ?? 'pay-now' }}"
-        class="button button-primary bg-primary">
+        @isset($data) @foreach($data as $prop => $value) data-{{ $prop }}="{{ $value }}" @endforeach @endisset
+        class="button button-primary bg-primary {{ $class ?? '' }}">
             <svg class="animate-spin h-5 w-5 text-white hidden" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                 <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                 <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>

resources/views/portal/ninja2020/gateways/stripe/sofort/authorize.blade.php

@@ -0,0 +1,7 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.bank_account'), 'card_title' => ctrans('texts.bank_account')])
+
+@section('gateway_content')
+    @component('portal.ninja2020.components.general.card-element-single', ['title' => ctrans('texts.bank_account'), 'show_title' => false])
+        {{ __('texts.sofort_authorize_label') }}
+    @endcomponent
+@endsection

resources/views/portal/ninja2020/layout/payments.blade.php

@@ -11,7 +11,7 @@
 @endpush
 
 @section('body')
-    @livewire('required-client-info', ['fields' => method_exists($gateway, 'getClientRequiredFields') ? $gateway->getClientRequiredFields() : [], 'contact' => auth('contact')->user()])
+    @livewire('required-client-info', ['fields' => method_exists($gateway, 'getClientRequiredFields') ? $gateway->getClientRequiredFields() : [], 'contact' => auth('contact')->user(), 'countries' => $countries])
 
     <div class="container mx-auto grid grid-cols-12 opacity-25 pointer-events-none" data-ref="gateway-container">
         <div class="col-span-12 lg:col-span-6 lg:col-start-4 overflow-hidden bg-white shadow rounded-lg">