WordPress Yoast SEO- dynamic title and description in snippet based on GET parameter

I have a WordPress site with Yoast SEO installed on it. I have a certain page, /charts, which accepts the GET parameter id. Based on the value of id, I want to load a title and description from a JSON file on the server, and set it as the title and description that shows up on a snippet when you paste the link on Twitter, Facebook, Slack, etc.

Yoast overrides that with whatever is set up for that particular page on the Edit Page panel, and I could not figure out if a custom variable in Yoast could be set up that sets the title and description from the JSON file based on id's value. I ended up trying this solution to bypass Yoast for that particular page but as a result, no snippet shows up at all when I paste the link.

Note that apart from this /charts page, I do not want to alter Yoast's behaviour anywhere on the site. Is a solution possible to the same that changes the title and meta description - on the page and on snippets - dynamically with the id value in the GET parameter?

Currently I just use this code (for the title) to override Yoast and show our custom title:

add_action( 'template_redirect', 'remove_wpseo' );
function remove_wpseo() {
    if ( is_page('301') ) {
        $front_end = YoastSEO()->classes->get( Yoast\WP\SEO\Integrations\Front_End_Integration::class );
        remove_action( 'wpseo_head', [ $front_end, 'present_head' ], -9999 );
    }
}

add_filter('wpseo_title', 'filter_product_wpseo_title');
function filter_product_wpseo_title($title) {
    if((is_page('301')) && (isset($_GET['sf']))){
        return 'custom title for ' . $_GET['sf'];
    }
}

Solution

I was able to solve the issue - you still need to add the action remove_wpseo above to functions.php to override Yoast on the page.

Turns out link previews on apps are dictated by the Open Graph meta tags, which is what I was missing. I added <meta property = 'og:title' content = '<dynamic title content based on the ID>' /> to my page code, and it worked. Without the 'og:title' property defined for your page title, link previews may not work for an app.

You can use the existing <meta name='description' property to add a description dynamically.