Facetwp change select dropdown sort into radio buttons

<?php
/**
 * filter html for sort to output radio buttons 
 * Note: this code does NOT work Sort facets, only for the OLD sort box: 
 * https://facetwp.com/help-center/developers/shortcodes-reference/#display-a-sort-box
 * For the Sort facet, see this solution to achieve the same:
 * https://facetwp.com/help-center/facets/facet-types/sort/#display-sort-options-as-radio-buttons
*/

add_filter( 'facetwp_sort_html', function( $output, $params ) {
	$output = '<div class="facetwp-sort-radio">';
	foreach ( $params['sort_options'] as $key => $atts ) {
		$output .= '<input type="radio" name="sort" value="' . $key . '"> ' . $atts['label'] . '<br>';
	}
	$output .= '</div>';
	return $output;
}, 10, 2 );

/**
 * js to handle:
 * selecting the correct radio button on load
 * updating the sort when a new button is selected
 */
add_action( 'wp_head', function() {
	?>
	<script>
        (function($) {
            $(document).on('facetwp-loaded', function() {
                if ('undefined' !== typeof FWP.extras.sort ) {
                    $( '.facetwp-sort-radio input:radio[name="sort"]').filter('[value="'+FWP.extras.sort+'"]').prop("checked", true);
                }
            });
            // Sorting
            $(document).on('change', '.facetwp-sort-radio input', function() {
                FWP.extras.sort = $(this).val();
                FWP.soft_refresh = true;
                FWP.autoload();
            });
        })(jQuery);
	</script>
	<?php
}, 100 );