Bring sample to readiness for samples browser

Author: localden

1-Authentication/1-sign-in/README.md

@@ -1,3 +1,24 @@
+---
+page_type: sample
+description: This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with Azure Active Directory (Azure AD) using the Microsoft Authentication Library for Angular (MSAL Angular).
+languages:
+ -  javascript
+ -  typescript
+products:
+ - azure-active-directory-b2c
+ - msal-js
+ - msal-angular
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-aad
+extensions:
+- services: ms-identity
+- platform: JavaScript
+- endpoint: AAD v2.0
+- level: 100
+- client: Angular SPA
+- service: 
+---
+
 # Angular single-page application using MSAL Angular to sign-in users with Azure Active Directory
 
  1. [Overview](#overview)

1-Authentication/2-sign-in-b2c/README.md

@@ -9,7 +9,7 @@ products:
  - msal-js
  - msal-angular
  - microsoft-authentication-library
-urlFragment: spa-msal-angular
+urlFragment: spa-msal-angular-b2c
 extensions:
 - services: ms-identity
 - platform: JavaScript

2-Authorization-I/1-call-graph/README.md

@@ -1,15 +1,16 @@
 ---
 page_type: sample
-name: Angular single-page application using MSAL Angular to sign-in users with Azure AD and call the Microsoft Graph API
-services: ms-identity
-platform: Javascript
+extensions:
+- services: ms-identity
+- platform: javascript
 languages:
  - javascript
 products:
  - azure-active-directory
  - ms-graph
  - msal-angular
-urlFragment: ms-identity-javascript-angular-tutorial
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-graph
 description: This sample demonstrates an Angular single-page application (SPA) that uses Microsoft Authentication Library for Angular (MSAL Angular) to sign-in users with Azure Active Directory (Azure AD) and calls Microsoft Graph API
 ---
 

3-Authorization-II/1-call-api/README.md

@@ -1,17 +1,18 @@
 ---
 page_type: sample
-name: Angular single-page application using MSAL Angular to sign-in users with Azure Active Directory and call a .NET Core web API
-services: ms-identity
-platform: javascript
+extensions:
+- services: ms-identity
+- platform: javascript
 languages:
  - typescript
  - csharp
 products:
  - azure-active-directory
  - aspnet-core
  - msal-angular
-urlFragment: ms-identity-javascript-angular-tutorial
-description: An Angular SPA using MSAL Angular to sign-in users with Azure Active Directory and call a protected .NET Core web API
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-netcore
+description: This sample demonstrates an Angular single-page application (SPA) to sign-in users and call a ASP.NET Core web API secured with Azure Active Directory (Azure AD) using the Microsoft Authentication Library for Angular (MSAL Angular) for the SPA and the Microsoft.Identity.Web (MIW) for the web API.
 ---
 
 # Angular single-page application using MSAL Angular to sign-in users with Azure Active Directory and call a .NET Core web API

3-Authorization-II/2-call-api-b2c/README.md

@@ -1,7 +1,6 @@
 ---
 page_type: sample
-name: Angular single-page application that authenticates users with Azure AD B2C and calls a protected .NET Core web API
-description: An Angular single-page application that authenticates users with Azure AD B2C and calls a protected .NET Core web API
+description: This sample demonstrates an Angular single-page application (SPA) calling a ASP.NET Core web API secured with Azure AD B2C. It uses the Microsoft Authentication Library for Angular (MSAL Angular) to sign-in a users in the SPA and get a token for the web API. The Web API is protected using the Microsoft.Identity.Web.
 languages:
  - javascript
  - typescript
@@ -11,7 +10,8 @@ products:
  - msal-js
  - msal-angular
  - microsoft-identity-web
-urlFragment: ms-identity-javascript-angular-tutorial
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-b2c-netcore
 extensions:
 - services: ms-identity
 - platform: JavaScript
@@ -36,7 +36,7 @@ extensions:
 
 ## Overview
 
-This sample demonstrates an Angular single-page application (SPA) calling a ASP.NET Core web API secured with [Azure AD B2C](https://docs.microsoft.com/azure/active-directory-b2c/overview). It uses the [Microsoft Authentication Library for Angular](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular) to sign-in a users in the SPA and get a token for the web Api. The Web Api is protected using the [Microsoft.Identity.Web](https://github.com/AzureAD/microsoft-identity-web).
+This sample demonstrates an Angular single-page application (SPA) calling a ASP.NET Core web API secured with [Azure AD B2C](https://docs.microsoft.com/azure/active-directory-b2c/overview). It uses the [Microsoft Authentication Library for Angular](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular) to sign-in a users in the SPA and get a token for the web API. The Web API is protected using the [Microsoft.Identity.Web](https://github.com/AzureAD/microsoft-identity-web).
 
 > :information_source: To learn how to integrate a JavaScript Angular application with Azure AD,consider going through the recorded session: [Deep dive on using MSAL.js to integrate Angular single-page applications with Azure Active Directory](https://www.youtube.com/watch?v=EJey9KP1dZA)
 

4-Deployment/README.md

@@ -1,3 +1,17 @@
+---
+page_type: sample
+description: This sample demonstrates how to deploy an Angular single-page application (SPA) coupled with a .NET Core web API to Azure Cloud using Azure Storage and Azure App Service, respectively. To do so, we will use the same code sample from Chapter 3.
+languages:
+ - javascript
+ - typescript
+ - csharp
+products:
+ - msal-js
+ - msal-angular
+ - microsoft-authentication-library
+urlFragment: msal-angular-deploy-azure-cloud
+---
+
 # Deploy your Angular application to Azure Cloud and use Azure services to manage your operations
 
  1. [Overview](#overview)

5-AccessControl/1-call-api-roles/README.md

@@ -1,9 +1,5 @@
 ---
 page_type: sample
-services: ms-identity
-client: Angular SPA
-service: ASP.NET Core Web Api
-level: 300
 languages:
  - typescript
  - csharp
@@ -13,11 +9,16 @@ products:
  - msal-js
  - msal-angular
  - microsoft-identity-web
-platform: JavaScript
-endpoint: AAD v2.0
-urlFragment: ms-identity-javascript-angular-tutorial
-name: Angular single-page application calling a protected web API and using App Roles to implement Role-Based Access Control
-description: An Angular single-page application calling a protected web API using App Roles to implement Role-Based Access Control
+ - microsoft-authentication-library
+extensions:
+- endpoint: AAD v2.0
+- services: ms-identity
+- client: Angular SPA
+- service: ASP.NET Core Web Api
+- level: 300
+- platform: JavaScript
+urlFragment: spa-msal-angular-app-roles
+description: This sample demonstrates a cross-platform application suite involving an Angular single-page application (TodoListSPA) calling an ASP.NET Core web API (TodoListAPI) secured with the Microsoft identity platform. In doing so, it implements Role-based Access Control (RBAC) by using Azure AD App Roles.
 ---
 
 # Angular single-page application calling a protected web API and using App Roles to implement Role-Based Access Control

5-AccessControl/2-call-api-groups/README.md

@@ -1,7 +1,6 @@
 ---
 page_type: sample
-name: Angular single-page application calling a protected ASP.NET Core web API and using Security Groups to implement Role-Based Access Control
-description: An Angular single-page application calling a protected AspNet web API and using Security Groups to implement Role-Based Access Control (RBAC)
+description: This sample demonstrates a cross-platform application suite involving an Angular single-page application (TodoListSPA) calling an ASP.NET Core web API (TodoListAPI) secured with the Microsoft identity platform. In doing so, it implements Role-based Access Control (RBAC) by using Azure AD Security Groups.
 languages:
  - typescript
  - csharp
@@ -12,7 +11,8 @@ products:
  - msal-js
  - msal-angular
  - microsoft-identity-web
-urlFragment: ms-identity-javascript-angular-tutorial
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-security-groups
 extensions:
 - services: ms-identity
 - platform: javascript

6-AdvancedScenarios/1-call-api-obo/README.md

@@ -1,7 +1,6 @@
 ---
 page_type: sample
-name: An Angular single-page application calling an AspNetCore web API which calls the Microsoft Graph API using the on-behalf-of (OBO) flow
-description: An Angular single-page application signing-in a user and calling an AspNetCore Web API protected with Azure AD. The Web API in turn then calls the Microsoft Graph API using the on-behalf-of (OBO) flow
+description: This sample demonstrates an Angular single-page application (SPA) which lets a user authenticate with their Azure AD tenant and obtains an access token to call an ASP.NET Core web API, protected by Azure Active Directory (Azure AD).
 languages:
  - typescript
  - csharp
@@ -10,7 +9,8 @@ products:
  - msal-js
  - msal-angular
  - microsoft-identity-web
-urlFragment: ms-identity-javascript-angular-tutorial
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-graph-obo
 extensions:
 - services: ms-identity
 - platform: javascript
@@ -34,7 +34,7 @@ extensions:
 
 ## Overview
 
-This sample demonstrates an Angular single-page application (SPA) which lets a user authenticate with their Azure AD tenant and  obtains an [access token](https://aka.ms/access-tokens) to call an ASP.NET Core web API, protected by [Azure Active Directory (Azure AD)](https://azure.microsoft.com/services/active-directory/).
+This sample demonstrates an Angular single-page application (SPA) which lets a user authenticate with their Azure AD tenant and obtains an [access token](https://aka.ms/access-tokens) to call an ASP.NET Core web API, protected by [Azure Active Directory (Azure AD)](https://azure.microsoft.com/services/active-directory/).
 The web API then proceeds to obtain another access token for [Microsoft Graph API](https://developer.microsoft.com/graph) using the [OAuth 2.0 on-behalf-of flow](https://docs.microsoft.com/azure/active-directory/develop/v2-oauth2-on-behalf-of-flow).
 The web API's call to Microsoft Graph is made using the [Microsoft Graph SDK](https://docs.microsoft.com/graph/sdks/sdks-overview).
 

6-AdvancedScenarios/2-call-api-mt/README.md

@@ -1,7 +1,6 @@
 ---
 page_type: sample
-name: Integrate an Angular SPA using MSAL Angular to authenticate users with Azure AD and call a protected web API using the multi-tenant integration pattern (SaaS)
-description: Integrate an Angular single-page application (SPA) that uses MSAL Angular to authenticate users with Azure AD and call a protected .NET Core web API using the multi-tenant integration pattern (SaaS)
+description: This sample demonstrates how to integrate an app with Azure AD as a multi-tenant app. This cross-platform application suite comprises of an Angular single-page application (TodoListSPA) authenticating users and calling an ASP.NET Core web API (TodoListAPI) which is also secured with Azure Active Directory (Azure AD). Due to the topology of this application suite (multi-tier, multi-tenant), additional steps are needed for making the apps available to users in other tenants.
 languages:
  - javascript
  - typescript
@@ -11,7 +10,8 @@ products:
  - aspnet-core
  - msal-js
  - msal-angular
-urlFragment: ms-identity-javascript-angular-tutorial
+ - microsoft-authentication-library
+urlFragment: spa-msal-angular-multi-tenant
 extensions:
 - services: ms-identity
 - platform: javascript