ArcGIS Enterprise & ArcGIS JS API Authentication

[MahreenKohkar]

I 

 have an ArcGIS Enterprise instance configured on my system. And a custom web application built using React. My main objective is to be able to render a map that is already built using ArcGIS Enterprise inside the custom web app. As of current understanding, the best way to implement ArcGIS functionalities is by using the JS API with an API key. However, when it comes to ArcGIS Enterprise, as per my research, i am not able to use an API key, i need another way to authenticate and be able to use the API functionalities. The best way it seems is retrieving an authentication token and registering that with the IdentityManager as per the below code (which i am currently unable to test).

require([
            "esri/Map",
            "esri/views/MapView",
            "esri/layers/FeatureLayer",
            "esri/identity/IdentityManager"
        ], function(Map, MapView, FeatureLayer, IdentityManager) {
            async function fetchToken(username, password) {
                // OR https://your-arcgis-server-url/arcgis/tokens/generateToken
                const response = await fetch("https://<arcgis-enterprise-domain>/sharing/rest/generateToken", {
                    method: "POST",
                    headers: {
                        "Content-Type": "application/x-www-form-urlencoded"
                    },
                    body: new URLSearchParams({
                        'f': 'json',
                        'username': username,
                        'password': password,
                        'client': 'referer',
                        'referer': window.location.origin,
                        'expiration': 60
                    })
                });
                const data = await response.json();
                return data.token;
            }

            const username = "your-username";
            const password = "your-password";

            fetchToken(username, password).then(token => {
                IdentityManager.registerToken({
                    server: "https://<arcgis-enterprise-domain>/sharing/rest",
                    token: token
                });

                const map = new Map({
                    basemap: "streets-navigation-vector"
                });

                const view = new MapView({
                    container: "viewDiv",
                    map: map,
                    center: [-118.80543,34.02700],
                    zoom: 13
                });

                const featureLayer = new FeatureLayer({
                    url: "https://<arcgis-enterprise-domain>/server/rest/services/YourFeatureService/FeatureServer/0"
                });

                map.add(featureLayer);
            }).catch(error => {
                console.error("Error fetching token:", error);
            });
        });

I haven't been able to find samples or tutorials that achieve this. Is there another way i can use to implement ArcGIS Enterprise functionalities in a custom web app ?