Display alert that current page has drafted changes

bb-draft-warning.php

<?php

// Avoid losing drafted changes by alerting other users with editing roles
// that the current page has a draft.

// Place the code below in a plugin file or in functions.php

// NOTES:
// The alert will only display for users with `edit_posts` capability
// when the builder is open. Triggered by the 'fl_body_open' hook, which is part
// of the Beaver Builder Theme.

add_action( 'fl_body_open', function(){

    // if current user can edit posts
    if ( current_user_can('edit_posts') ) :
        if ( 
            // if in Edit mode
            isset($_GET['fl_builder']) 
            // and the page has drafted changes
            &&  FLBuilderModel::layout_has_drafted_changes() ) :

            $style = '<style type="text/css">
            .bb-draft-warning {
                background-color: #ff6961;
                padding: 5px;
                color: #fff;
                text-align: center;
            }
            </style>';

            // Throw alert on the page
            echo $style . '<div class="bb-draft-warning">This page has drafted changes.</div>';
        endif;
    endif; 
});