How to addfilter() for Shortcuts?

[sahillangoo]

I have created the child theme for my website and have added some details which worked fine

// PWA App Config
add_filter( 'web_app_manifest', function( $manifest ) {
    $manifest['description'] = 'loremipsome';
    $manifest['start_url'] = '/?source=pwa';
    $manifest['id'] = '/?source=pwa';
    $manifest['scope'] =  #'/';
    $manifest['theme_color'] = '#ffffff';
    $manifest['background_color'] = '#fe852b';
    $manifest['lang'] = 'en-US';
    $manifest['display'] = 'standalone';
    $manifest['orientation'] = 'portrait';
    $manifest['iarc_rating_id'] = 'abcxxx';
    $manifest['prefer_related_applications'] = true;
    return $manifest;
});

and for arrays like icons

add_filter( 'web_app_manifest', static function ( $manifest ) {
    $manifest['categories'] = array('store', 'xyz', 'dfh', 'abc', 'klp');
    $manifest['related_applications'] = array(
        array(
        'platform' => 'play',
        'url' => 'https://play.google.com/store/apps/details?id='),);
    $manifest['icons'] = array(
        array(
            'src'     => home_url( '/wp-content/uploads/icon-192x192.png' ),
            'sizes'   => '192x192',
            'type'    => 'image/png',
            'purpose' => 'any',
        ),
        array(
            'src'     => home_url( '/wp-content/uploads/icon-maskable-192x192.png' ),
            'sizes'   => '192x192',
            'type'    => 'image/png',
            'purpose' => 'maskable',
        ),
        array(
            'src'     => home_url( '/wp-content/uploads/icon-512x512.png' ),
            'sizes'   => '512x512',
            'type'    => 'image/png',
            'purpose' => 'any',
        ),
        array(
            'src'     => home_url( '/wp-content/uploads/icon-maskable-512x512.png' ),
            'sizes'   => '512x512',
            'type'    => 'image/png',
            'purpose' => 'maskable',
        ),
        array(
            'src'     => home_url( '/wp-content/uploads/icon-monochrome-512x512.png' ),
            'sizes'   => '512x512',
            'type'    => 'image/png',
            'purpose' => 'monochrome',
        ),
    );
    $manifest['screenshots'] = array(
            array(
            'src' => home_url( '/wp-content/uploads/screenshot-1.jpg' ),
            'type' => 'image/jpg',
            'sizes' => '1080x2400',
        ),
        array(
            'src' => home_url( '/wp-content/uploads/screenshot-2.jpg' ),
            'type' => 'image/jpg',
            'sizes' => '1080x2400',
        ),
        array(
            'src' => home_url( '/wp-content/uploads/screenshot-3.jpg' ),
            'type' => 'image/jpg',
            'sizes' => '1080x2400',
        ),
        array(
            'src' => home_url( '/wp-content/uploads/screenshot-4.jpg' ),
            'type' => 'image/jpg',
            'sizes' => '1080x2400',
        ),
        array(
            'src' => home_url( '/wp-content/uploads/screenshot-4.jpg' ),
            'type' => 'image/jpg',
            'sizes' => '1080x2400',
        ),
    );
  return $manifest;
} );

This works fine but how to add shortcuts? i.e array in array and output should be like this:

"shortcuts": [
    {
      "name": "option",
      "short_name": "option",
      "description": "lorem",
      "url": "https://xyz.com/options?source=pwa",
      "icons": [
        {
          "src": "url+path",
          "sizes": "96x96"
        }
      ]
    },]

this throws error:

$manifest['shortcuts'] = array(
        array(
            'name' => 'option',
            'short_name' => 'option',
            'description' => lorem',
            'url' => 'home_url( 'shop?source=pwa' ),
            'icons' => array(
            'src' => 'home_url( 'wp-content/uploads/icon.png')',
            'sizes' => '96x96',)
            ,)
            ,),);

PS: Im open to suggestions!

[thelovekesh]

You can add shortcuts in your manifest just like you add the screenshots, e.g.

add_filter(
    'web_app_manifest',
    static function ( $manifest ) {
        $manifest['shortcuts'] = array(
            array(
                'name'        => __( 'App Shortcut-1', 'text-domain' ),
                'short_name'  => __( 'Shortcut 1', 'text-domain' ),
                'description' => __( 'Shortcut 1 description.', 'text-domain' ),
                'url'         => home_url( '/shortcut-1/?utm_source=pwa' ),
                'icons'       => array(
                    array(
                        'src'   => 'https://example.com/shortcut-1.png',
                        'sizes' => '192x192',
                    ),
                ),
            ),
            array(
                'name'        => __( 'App Shortcut-2', 'text-domain' ),
                'short_name'  => __( 'Shortcut 2', 'text-domain' ),
                'description' => __( 'Shortcut 2 description.', 'text-domain' ),
                'url'         => home_url( '/shortcut-2/?utm_source=pwa' ),
                'icons'       => array(
                    array(
                        'src'   => 'https://example.com/shortcut-2.png',
                        'sizes' => '192x192',
                    ),
                ),
            ),
        );

        return $manifest;
    }
);

You can confirm your manifest output in the DevTools under Application > Manifest or by visiting the route /wp-json/wp/v2/web-app-manifest