Random Post Doesnt Work | WordPress.org

Hi. I tried to execute the random post by using shortcode (because it is not technically possible to put PHP code in gutenberg) but it shows nothing.

Here is the code in function.php

function random_post () {
$post_ids = [];
// Query ALL posts ordered by random
$args = [
'post_type' => [ 'post' ],
'orderby' => 'rand',
'posts_per_page' => -1,
'ignore_sticky_posts' => true,
];
$the_query = new WP_Query( $args );

while ( $the_query->have_posts() ) : $the_query->the_post();
// Build array of post IDs.
$post_ids[] = $post->ID;
endwhile; wp_reset_query();

// Pass $post_ids array to Ajax Load More post__in parameter.
echo do_shortcode('[ajax_load_more post__in="'. implode(',', $post_ids) .'" orderby="post__in"]');
}
add_shortcode('random_post_order', 'random_post');

After the page loads, its just blank. I checked the HTML and it shows that the post count is recognized (800+ posts | 800 char of comma showed).

<div aria-live="polite" aria-atomic="true" class="alm-listing alm-ajax alm-has-transition" data-container-type="div" data-loading-style="blue" data-repeater="default" data-post-type="post" data-post-in=",,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,," data-order="DESC" data-orderby="post__in" data-offset="0" data-posts-per-page="5" data-scroll-distance="100" data-button-label="Load More"></div>

(It was 800+ of pure comma, i remove some in the comment because it is so long)

Any help is appreciated. Thank you!