Send request when close preview modal

[lotarbo]

Hello, I'm using this package with Next.js and we need to terminate the preview mode when the preview popup is closed.
Next.js says that we need send request to endpoint for this https://nextjs.org/docs/pages/building-your-application/configuring/preview-mode#clear-the-preview-mode-cookies

Is there any way to do this without editing package view file?

[pboivin]

Hi @lotarbo, I'm trying to think of a solution for you... Which version of the package are you on?

[lotarbo]

@pboivin, thank you)
v1.0.2
i have abstract code for this, and i think we can call in _closeModal function if we set up url for this

const closePreviewSession = () => {
  window.navigator.sendBeacon(
    `${endpoint}/api/clear-preview-mode-cookies`,
  );
};

[pboivin]

@lotarbo If this can be done on the client side, I think the simplest option is to listen to the close-preview-modal event on the window. Here's a quick inline example you can add to AppServiceProvider,

    public function boot()
    {
        Filament::registerRenderHook(
            'body.end',
            fn (): string => <<<JS
                <script>
                    window.addEventListener('close-preview-modal', () => {
                        alert('Preview is closing!');
                    });
                </script>
            JS
        );
    }

Of course, you can extract this to an external JS file and make it as nice as you need. I hope this can help!

[lotarbo]

Thank you, but it doesn't work when we press esc button.
i think it might be part of the package in the future, what do you think?

[pboivin]

I'll get back to you about the esc. key, I think I'll have some time in the next few days to add a cleaner hook for this. And thank you for the feedback, I really appreciate it :)

[pboivin]

Hi @lotarbo, I just released v1.1.0 with a bunch of new JavaScript hooks. I added a short page to the documentation also:

https://github.com/pboivin/filament-peek/blob/1.x/docs/javascript-hooks.md

Thanks again for the idea!

[lotarbo]

Thank you, it works great)