@extends('backend.app')

@section('title', 'Stripe Settings')

@section('content')
    {{-- PAGE-HEADER --}}
    <div class="page-header">
        <div>
            <h1 class="page-title">Stripe Settings</h1>
        </div>
        <div class="ms-auto pageheader-btn">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="javascript:void(0);">Settings</a></li>
                <li class="breadcrumb-item active" aria-current="page">Stripe Settings</li>
            </ol>
        </div>
    </div>
    {{-- PAGE-HEADER --}}


    <div class="row">
        <div class="col-lg-12 col-xl-12 col-md-12 col-sm-12">
            <div class="card box-shadow-0">
                <div class="card-body">
                    <form method="post" action="{{ route('credentials.update') }}" enctype="multipart/form-data">
                        @csrf
                        @method('PATCH')

                        <div class="mb-4 row">
                            <label for="store_commission" class="col-md-3 form-label">Store Commission (%)</label>
                            <div class="col-md-9">
                                <input class="form-control @error('store_commission') is-invalid @enderror" id="store_commission"
                                    name="store_commission" placeholder="Enter store commission" type="number" step="0.01" min="0" max="100"
                                    value="{{ env('STORE_COMMISSION') }}">
                                @error('store_commission')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="mb-4 row">
                            <label for="stripe_key" class="col-md-3 form-label">STRIPE KEY (Publishable Key)</label>
                            <div class="col-md-9">
                                <input class="form-control @error('stripe_key') is-invalid @enderror" id="stripe_key"
                                    name="stripe_key" placeholder="Enter your STRIPE KEY" type="text"
                                    value="{{ env('STRIPE_KEY') }}">
                                @error('stripe_key')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="mb-4 row">
                            <label for="stripe_secret" class="col-md-3 form-label">STRIPE SECRET(Secret Key)</label>
                            <div class="col-md-9">
                                <input class="form-control @error('stripe_secret') is-invalid @enderror" id="stripe_secret"
                                    name="stripe_secret" placeholder="Enter your paypal client id" type="text"
                                    value="{{ env('STRIPE_SECRET') }}">
                                @error('stripe_secret')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="mb-4 row">
                            <label for="stripe_webhook_secret" class="col-md-3 form-label">STRIPE WEBHOOK SECRET</label>
                            <div class="col-md-9">
                                <input class="form-control @error('stripe_webhook_secret') is-invalid @enderror"
                                    id="stripe_webhook_secret" name="stripe_webhook_secret"
                                    placeholder="Enter your stripe webhook secret" type="text"
                                    value="{{ env('STRIPE_WEBHOOK_SECRET') }}">
                                @error('stripe_webhook_secret')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        {{-- Use Custom URLs Toggle --}}
                        <div class="mb-4 row">
                            <label for="stripe_use_custom_urls" class="col-md-3 form-label">Use Custom Redirect URLs</label>
                            <div class="col-md-9">
                                <label class="mb-0 custom-switch form-switch">
                                    <input type="checkbox" name="stripe_use_custom_urls" id="stripe_use_custom_urls" class="custom-switch-input" {{ env('STRIPE_USE_CUSTOM_URLS') == 'true' ? 'checked' : '' }}>
                                    <span class="custom-switch-indicator"></span>
                                    <span class="custom-switch-description">If enabled, successful/cancelled payments will redirect to the URLs below. Otherwise, they will show a default page.</span>
                                </label>
                            </div>
                        </div>

                        {{-- Checkout Success URL --}}
                        <div class="mb-4 row">
                            <label for="checkout_success_url" class="col-md-3 form-label">Checkout Success URL</label>
                            <div class="col-md-9">
                                <input class="form-control @error('checkout_success_url') is-invalid @enderror"
                                    id="checkout_success_url" name="checkout_success_url"
                                    placeholder="Enter your Checkout Success URL" type="text"
                                    value="{{ env('CHECKOUT_SUCCESS_URL') }}">
                                @error('checkout_success_url')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        {{-- Checkout cancel URL --}}
                        <div class="mb-4 row">
                            <label for="checkout_cancel_url" class="col-md-3 form-label">Checkout Cancel URL</label>
                            <div class="col-md-9">
                                <input class="form-control @error('checkout_cancel_url') is-invalid @enderror"
                                    id="checkout_cancel_url" name="checkout_cancel_url"
                                    placeholder="Enter your Checkout Cancel URL" type="text"
                                    value="{{ env('CHECKOUT_CANCEL_URL') }}">
                                @error('checkout_cancel_url')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="mb-4 row">
                            <label for="stripe_connect_redirect_url" class="col-md-3 form-label">Stripe Connect Redirect URL</label>
                            <div class="col-md-9">
                                <input class="form-control @error('stripe_connect_redirect_url') is-invalid @enderror"
                                    id="stripe_connect_redirect_url" name="stripe_connect_redirect_url"
                                    placeholder="Enter your Stripe Connect Redirect URL" type="text"
                                    value="{{ env('STRIPE_CONNECT_REDIRECT_URL') }}">
                                @error('stripe_connect_redirect_url')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="row justify-content-end">
                            <div class="col-sm-9">
                                <div>
                                    <button class="btn btn-primary" type="submit">Submit</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function () {
        const toggle = document.getElementById('stripe_use_custom_urls');
        const successUrlInput = document.getElementById('checkout_success_url');
        const cancelUrlInput = document.getElementById('checkout_cancel_url');
        const connectRedirectUrlInput = document.getElementById('stripe_connect_redirect_url');

        function updateInputs() {
            if (toggle.checked) {
                successUrlInput.removeAttribute('readonly');
                cancelUrlInput.removeAttribute('readonly');
                connectRedirectUrlInput.removeAttribute('readonly');
                successUrlInput.style.opacity = '1';
                cancelUrlInput.style.opacity = '1';
                connectRedirectUrlInput.style.opacity = '1';
            } else {
                successUrlInput.setAttribute('readonly', 'readonly');
                cancelUrlInput.setAttribute('readonly', 'readonly');
                connectRedirectUrlInput.setAttribute('readonly', 'readonly');
                successUrlInput.style.opacity = '0.6';
                cancelUrlInput.style.opacity = '0.6';
                connectRedirectUrlInput.style.opacity = '0.6';
            }
        }

        toggle.addEventListener('change', updateInputs);
        updateInputs(); // Initialize on load
    });
</script>
@endpush