AbanoubNassem / filament-grecaptcha-field

Provides a Google reCaptcha V2 field for the Filament Forms(V2-V3), works in Admin-Panel and Forntend-Forms.
MIT License
18 stars 7 forks source link

Recaptcha disappear if validation fails #2

Closed icaliman closed 1 year ago

icaliman commented 1 year ago

I am using your plugin in a custom livewire form. In the image you can see how recaptcha desapear if validation fails.

filament-recaptcha

AbanoubNassem commented 1 year ago

can you please share the code of the custom form?

have you initialized the captcha field? also is there any console errors?

because I can't reproduce the issue.

icaliman commented 1 year ago

Livewire Component app/Http/Livewire/TestCaptcha.php

<?php

namespace App\Http\Livewire;

use AbanoubNassem\FilamentGRecaptchaField\Forms\Components\GRecaptcha;
use Exception;
use Filament\Forms\Concerns\InteractsWithForms;
use Filament\Forms\Contracts\HasForms;
use Livewire\Component;
use Filament\Forms;
use Illuminate\Support\Facades\Log;
use Illuminate\Validation\Rule;

class TestCaptcha extends Component implements HasForms
{
    use InteractsWithForms;

    public $email;
    public $captcha = '';

    public $submited = false;

    public function mount(): void
    {
        $this->form->fill([
            'email' => '',
            'captcha' => '',
        ]);
    }

    protected function getFormSchema(): array
    {
        return [
            Forms\Components\TextInput::make('email')->rules(['email:rfc,dns'])->email()
                ->disableAutocomplete()->required(),
            GRecaptcha::make('captcha'),
        ];
    }

    public function submit()
    {
        $data = $this->form->getState();
        $this->submited = true;
        $this->form->reset();
    }

    public function render()
    {
        return view('livewire.test-captcha');
    }
}

Component View: resources/views/livewire/test-captcha.blade.php


<div class="p-10 my-8 rounded-lg bg-white">
    <form wire:submit.prevent="submit">
        {{ $this->form }}

        <button class="btn btn-primary w-full">
            {{ __('Submit') }}
        </button>
    </form>
</div>

Component usage:

<livewire:test-captcha />
AbanoubNassem commented 1 year ago

@icaliman

can you please pull this : https://github.com/AbanoubNassem/filament-grecaptcha-field/pull/3 , and test if it fixes your issue.

icaliman commented 1 year ago

@AbanoubNassem Thanks for your help.

Now the captcha field does not appear. There are no errors in the console. I think captcha scripts are not loaded.

image
AbanoubNassem commented 1 year ago

@icaliman

please re-pull again , and test , hopefully it works , since I can't reproduce the issue.

icaliman commented 1 year ago

@AbanoubNassem

Hi! It's not working. Here is a reproduction repo: https://github.com/icaliman/filament-bug-captcha

Try to submit the form with unchecked captcha field.

icaliman commented 1 year ago

@AbanoubNassem

I found the fix and made a pull request #4

AbanoubNassem commented 1 year ago

@icaliman

thank you, a new version was released.