Add to home screen working on windows but not on Android in React

I am trying to create a simple add to home screen button for react app but the promt is working on windows but when i try to click in android it doesn't work what should i do ? the main code is shown below. I have added all the required files and the content as shown on https://web.dev

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta name="description" content="Web site created using create-react-app" />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.webmanifest" />

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <title>Vedic Wellness | Lucky Drawer</title>
</head>

<body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>

    <div id="installer">
        <button id="mkbutton">Add to homescreen</button>
    </div>
    <script>
        let buttonInstall = document.getElementById("mkbutton");
        let installerPromo = document.getElementById("installer");

        if ('serviceWorker' in navigator) {

            navigator.serviceWorker.register('service-worker.js')
                .then(function(reg) {

                }).catch(function(err) {
                    console.log(err);
                });
        }

        // Initialize deferredPrompt for use later to show browser install prompt.
        let deferredPrompt;

        window.addEventListener('beforeinstallprompt', (e) => {
            deferredPrompt = e;
        });

        buttonInstall.addEventListener('click', async() => {
            deferredPrompt.prompt();
            const {
                outcome
            } = await deferredPrompt.userChoice;
            deferredPrompt = null;
        });
    </script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>