Restrict Access to Webpage with Amplify & Cognito

I am looking to restrict access to a basic html, css, javascript web application (simple web map). I have not integrated amplify auth library with my web app. I uploaded my application to Amplify and it fetches the index.html file to display the map (https://main.d3ungex01leet7.amplifyapp.com). My goal is to restrict access to this web map/application only to users who are logged in. I have followed the instructions in this aws tutorial https://www.youtube.com/watch?v=oFSU6rhFETk (Secure your API Gateway with Amazon Cognito Users Pools) which handles the code/token creation when a user logs in.

I am using this link (https://main.d3ungex01leet7.amplifyapp.com) as my Callback URL in my cognito User Pool which gives me something like this when I login (https://main.d3ungex01leet7.amplifyapp.com/?code=d1c1e063-4094-4bd0-a110-12e895147533#3/37.09/-95.71). This works great and all, but when anyone enters in https://main.d3ungex01leet7.amplifyapp.com, it will bypass cognito and they will have access to the web map that I am trying to restrict via cognito.

I am wondering if there is some javascript that I can add to my main html file that can extract the token out of the URL params and store it in a cookie/localstorage on the browser? Before the web app/map is loaded, it should check for the token in the browser's cookies and validate it. Once it is validated, the web app should fully load. If it is not validated, it should say something like "Access Denied"

I have read this article https://docs.aws.amazon.com/cognito/latest/developerguide/amazon-cognito-user-pools-using-tokens-verifying-a-jwt.html but am having trouble understanding the process as it pertains to my specific situation.