<div class="rare-social-links d-flex align-items-center mb-3">
    <a href="https://api.whatsapp.com/send?text={{ urlencode(request()->fullUrl()) }}" class="instagram" target="_blank" data-bs-toggle="tooltip" data-bs-placement="top" title="Whats App">
        <i class="fa-brands fa-whatsapp"></i>
    </a>
    <a href="https://www.facebook.com/share.php?u={{ urlencode(request()->fullUrl()) }}" target="_blank" class="facebook" data-bs-toggle="tooltip" data-bs-placement="top" title="Facebook">
        <i class="fa-brands fa-facebook"></i>
    </a>
    <a href="https://twitter.com/intent/tweet?text={{ request()->fullUrl() }}" class="twitter" target="_blank" data-bs-toggle="tooltip" data-bs-placement="top" title="Twitter">
        <i class="fa-brands fa-twitter"></i>
    </a>
    <a href="https://www.linkedin.com/shareArticle?url={{ request()->fullUrl() }}" class="linked-in" target="_blank" data-bs-toggle="tooltip" data-bs-placement="top" title="Linked In">
        <i class="fa-brands fa-linkedin"></i>
    </a>
    <a href="javascript:void(0)"
        class="copyUrls"
        data-bs-toggle="tooltip"
        data-bs-placement="top"
        title="Copy Link"
        data-url="{{ request()->fullurl() }}"
        >
        <i class="fa-solid fa-clipboard"></i>
    </a>
</div>

@section('javascript')
    @parent
    <script>
        $(document).ready(function() {
            $('.copyUrls').on('click', function() {
                let copiedLink = $(this).attr('data-url');
                var textArea = document.createElement("textarea");
                textArea.value = copiedLink;
                document.body.appendChild(textArea);
                textArea.select();

                try {
                    var successful = document.execCommand('copy');
                    var msg = successful ? 'Copied Successful' : 'Unsuccessful';
                    var copyStatus = successful ? 'Success' : 'Error';

                    Swal.fire(copyStatus, msg, 'success');

                    Swal.fire({
                        position: 'center',
                        icon: copyStatus,
                        title: msg,
                        showConfirmButton: false,
                        timer: 1000
                    })

                } catch (err) {
                    console.log('Oops, unable to copy');
                }
                document.body.removeChild(textArea);

            });
        })
    </script>
@stop