feat: replace Azure Storage with SWA (#1296)

OfficeDev · Jul 18, 2024 · 4ae7402 · 4ae7402
1 parent 050ae50
commit 4ae7402
Show file tree

Hide file tree

Showing 67 changed files with 465 additions and 508 deletions.
diff --git a/basic-blazor-tab-app/BasicBlazorTabApp/env/.env.dev b/basic-blazor-tab-app/BasicBlazorTabApp/env/.env.dev
@@ -9,7 +9,7 @@ AZURE_SUBSCRIPTION_ID=
 AZURE_RESOURCE_GROUP_NAME=
 RESOURCE_SUFFIX=
 
-# Generated during provision, you can also add your own variables. 
+# Generated during provision, you can also add your own variables.
 TEAMS_APP_ID=
-TAB_AZURE_STORAGE_RESOURCE_ID=
+TAB_AZURE_APP_SERVICE_RESOURCE_ID=
 TAB_ENDPOINT=
diff --git a/developer-assist-dashboard/env/.env.dev b/developer-assist-dashboard/env/.env.dev
@@ -18,7 +18,7 @@ AAD_APP_ACCESS_AS_USER_PERMISSION_ID=
 AAD_APP_TENANT_ID=
 AAD_APP_OAUTH_AUTHORITY_HOST=
 AAD_APP_OAUTH_AUTHORITY=
-TAB_AZURE_STORAGE_RESOURCE_ID=
+AZURE_STATIC_WEB_APPS_RESOURCE_ID=
 TAB_ENDPOINT=
 M365_TITLE_ID=
 M365_APP_ID=

diff --git a/developer-assist-dashboard/infra/azure.bicep b/developer-assist-dashboard/infra/azure.bicep
@@ -1,7 +1,7 @@
 @maxLength(20)
 @minLength(4)
 param resourceBaseName string
-param storageSku string
+param staticWebAppSku string
 param functionAppSKU string
 
 param aadAppClientId string
@@ -10,7 +10,7 @@ param aadAppOauthAuthorityHost string
 @secure()
 param aadAppClientSecret string
 
-param storageName string = resourceBaseName
+param staticWebAppName string = resourceBaseName
 param location string = resourceGroup().location
 param serverfarmsName string = resourceBaseName
 param functionAppName string = resourceBaseName
@@ -39,20 +39,19 @@ var outlookWebAppClientId = '00000002-0000-0ff1-ce00-000000000000'
 var authorizedClientApplicationIds = '${teamsMobileOrDesktopAppClientId};${teamsWebAppClientId};${officeWebAppClientId1};${officeWebAppClientId2};${outlookDesktopAppClientId};${outlookWebAppClientId}'
 var allowedClientApplications = '"${teamsMobileOrDesktopAppClientId}","${teamsWebAppClientId}","${officeWebAppClientId1}","${officeWebAppClientId2}","${outlookDesktopAppClientId}","${outlookWebAppClientId}"'
 
-// Azure Storage that hosts your static web site
-resource storage 'Microsoft.Storage/storageAccounts@2021-06-01' = {
-  kind: 'StorageV2'
-  location: location
-  name: storageName
-  properties: {
-    supportsHttpsTrafficOnly: true
-  }
+// Azure Static Web Apps that hosts your static web site
+resource swa 'Microsoft.Web/staticSites@2022-09-01' = {
+  name: staticWebAppName
+  // SWA do not need location setting
+  location: 'centralus'
   sku: {
-    name: storageSku
+    name: staticWebAppSku
+    tier: staticWebAppSku
   }
+  properties: {}
 }
 
-var siteDomain = replace(replace(storage.properties.primaryEndpoints.web, 'https://', ''), '/', '')
+var siteDomain = swa.properties.defaultHostname
 var tabEndpoint = 'https://${siteDomain}'
 var aadApplicationIdUri = 'api://${siteDomain}/${aadAppClientId}'
 
@@ -186,7 +185,7 @@ resource authSettings 'Microsoft.Web/sites/config@2021-02-01' = {
 }
 
 // The output will be persisted in .env.{envName}. Visit https://aka.ms/teamsfx-actions/arm-deploy for more details.
-output TAB_AZURE_STORAGE_RESOURCE_ID string = storage.id // used in deploy stage
+output AZURE_STATIC_WEB_APPS_RESOURCE_ID string = swa.id
 output TAB_DOMAIN string = siteDomain
 output TAB_HOSTNAME string = siteDomain
 output TAB_ENDPOINT string = tabEndpoint

diff --git a/developer-assist-dashboard/infra/azure.parameters.json b/developer-assist-dashboard/infra/azure.parameters.json
@@ -5,8 +5,8 @@
     "resourceBaseName": {
       "value": "tab${{RESOURCE_SUFFIX}}"
     },
-    "storageSku": {
-      "value": "Standard_LRS"
+    "staticWebAppSku": {
+      "value": "Free"
     },
     "aadAppClientId": {
       "value": "${{AAD_APP_CLIENT_ID}}"

diff --git a/developer-assist-dashboard/teamsapp.yml b/developer-assist-dashboard/teamsapp.yml
@@ -1,5 +1,5 @@
-# yaml-language-server: $schema=https://aka.ms/teams-toolkit/v1.2/yaml.schema.json
-version: v1.2
+# yaml-language-server: $schema=https://aka.ms/teams-toolkit/v1.5/yaml.schema.json
+version: v1.5
 
 additionalMetadata:
   sampleTag: TeamsFx-Samples:developer-assist-dashboard
@@ -41,11 +41,13 @@ provision:
           deploymentName: Create-resources-for-tab # Required when deploy ARM template
       bicepCliVersion: v0.9.1 # Teams Toolkit will download this bicep CLI version from github for you, will use bicep CLI in PATH if you remove this config.
 
-  - uses: azureStorage/enableStaticWebsite
+  # Get the deployment token from Azure Static Web Apps
+  - uses: azureStaticWebApps/getDeploymentToken
     with:
-      storageResourceId: ${{TAB_AZURE_STORAGE_RESOURCE_ID}}
-      indexPage: index.html
-      errorPage: error.html
+      resourceId: ${{AZURE_STATIC_WEB_APPS_RESOURCE_ID}}
+    # Save deployment token to the environment file for the deployment action
+    writeToEnvironmentFile:
+      deploymentToken: SECRET_TAB_SWA_DEPLOYMENT_TOKEN
 
   - uses: aadApp/update # Apply the AAD manifest to an existing AAD app. Will use the object id in manifest file to determine which AAD app to update.
     with:
@@ -103,16 +105,12 @@ deploy:
       REACT_APP_FUNC_ENDPOINT: ${{API_FUNCTION_ENDPOINT}}
     with:
       args: run build --if-present
-  # Deploy bits to Azure Storage Static Website
-  - uses: azureStorage/deploy
-    with:
-      # Deploy base folder. This folder includes manifest files for AAD app and Teams app that should be ignored using the ignoreFile.
-      artifactFolder: build
-      # The resource id of the cloud resource to be deployed to. 
-      # This key will be generated by arm/deploy action automatically. 
-      # You can replace it with your existing Azure Resource id
-      # or add it to your environment variable file.
-      resourceId: ${{TAB_AZURE_STORAGE_RESOURCE_ID}}
+  # Deploy bits to Azure Static Web Apps
+  - uses: cli/runNpxCommand
+    name: deploy to Azure Static Web Apps
+    with:
+      args: '@azure/static-web-apps-cli deploy ./build -d
+        ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
 
   # Run npm command
   - uses: cli/runNpmCommand

diff --git a/graph-connector-app/env/.env.dev b/graph-connector-app/env/.env.dev
@@ -17,7 +17,7 @@ AAD_APP_ACCESS_AS_USER_PERMISSION_ID=
 AAD_APP_TENANT_ID=
 AAD_APP_OAUTH_AUTHORITY_HOST=
 AAD_APP_OAUTH_AUTHORITY=
-TAB_AZURE_STORAGE_RESOURCE_ID=
+AZURE_STATIC_WEB_APPS_RESOURCE_ID=
 TAB_ENDPOINT=
 TAB_DOMAIN=
 API_FUNCTION_ENDPOINT=

diff --git a/graph-connector-app/infra/azure.bicep b/graph-connector-app/infra/azure.bicep
@@ -1,5 +1,5 @@
 param resourceBaseName string
-param storageSKU string
+param staticWebAppSku string
 param functionAppSKU string
 
 param aadAppClientId string
@@ -8,7 +8,7 @@ param aadAppOauthAuthorityHost string
 @secure()
 param aadAppClientSecret string
 
-param storageName string = resourceBaseName
+param staticWebAppName string = resourceBaseName
 param location string = resourceGroup().location
 param serverfarmsName string = resourceBaseName
 param functionAppName string = resourceBaseName
@@ -23,20 +23,19 @@ var outlookWebAppClientId = '00000002-0000-0ff1-ce00-000000000000'
 var authorizedClientApplicationIds = '${teamsMobileOrDesktopAppClientId};${teamsWebAppClientId};${officeWebAppClientId1};${officeWebAppClientId2};${outlookDesktopAppClientId};${outlookWebAppClientId}'
 var allowedClientApplications = '["${aadAppClientId}","${teamsMobileOrDesktopAppClientId}","${teamsWebAppClientId}","${officeWebAppClientId1}","${officeWebAppClientId2}","${outlookDesktopAppClientId}","${outlookWebAppClientId}"]'
 
-// Azure Storage that hosts your static web site
-resource storage 'Microsoft.Storage/storageAccounts@2021-06-01' = {
-  kind: 'StorageV2'
-  location: location
-  name: storageName
-  properties: {
-    supportsHttpsTrafficOnly: true
-  }
+// Azure Static Web Apps that hosts your static web site
+resource swa 'Microsoft.Web/staticSites@2022-09-01' = {
+  name: staticWebAppName
+  // SWA do not need location setting
+  location: 'centralus'
   sku: {
-    name: storageSKU
+    name: staticWebAppSku
+    tier: staticWebAppSku
   }
+  properties: {}
 }
 
-var siteDomain = replace(replace(storage.properties.primaryEndpoints.web, 'https://', ''), '/', '')
+var siteDomain = swa.properties.defaultHostname
 var tabEndpoint = 'https://${siteDomain}'
 var aadApplicationIdUri = 'api://${siteDomain}/${aadAppClientId}'
 
@@ -130,7 +129,7 @@ resource authSettings 'Microsoft.Web/sites/config@2021-02-01' = {
 }
 
 // The output will be persisted in .env.{envName}. Visit https://aka.ms/teamsfx-actions/arm-deploy for more details.
-output TAB_AZURE_STORAGE_RESOURCE_ID string = storage.id // used in deploy stage
+output AZURE_STATIC_WEB_APPS_RESOURCE_ID string = swa.id
 output TAB_DOMAIN string = siteDomain
 output TAB_ENDPOINT string = tabEndpoint
 output API_FUNCTION_ENDPOINT string = apiEndpoint

diff --git a/graph-connector-app/infra/azure.parameters.json b/graph-connector-app/infra/azure.parameters.json
@@ -20,8 +20,8 @@
     "functionAppSKU": {
       "value": "Y1"
     },
-    "storageSKU": {
-      "value": "Standard_LRS"
+    "staticWebAppSku": {
+      "value": "Free"
     }
   }
 }
diff --git a/graph-connector-app/teamsapp.yml b/graph-connector-app/teamsapp.yml
@@ -1,5 +1,5 @@
-# yaml-language-server: $schema=https://aka.ms/teams-toolkit/v1.2/yaml.schema.json
-version: v1.2
+# yaml-language-server: $schema=https://aka.ms/teams-toolkit/v1.5/yaml.schema.json
+version: v1.5
 
 additionalMetadata:
   sampleTag: TeamsFx-Samples:graph-connector-app
@@ -40,11 +40,13 @@ provision:
           deploymentName: Create-resources-for-tab # Required when deploy ARM template
       bicepCliVersion: v0.9.1 # Teams Toolkit will download this bicep CLI version from github for you, will use bicep CLI in PATH if you remove this config.
 
-  - uses: azureStorage/enableStaticWebsite
+  # Get the deployment token from Azure Static Web Apps
+  - uses: azureStaticWebApps/getDeploymentToken
     with:
-      storageResourceId: ${{TAB_AZURE_STORAGE_RESOURCE_ID}}
-      indexPage: index.html
-      errorPage: error.html
+      resourceId: ${{AZURE_STATIC_WEB_APPS_RESOURCE_ID}}
+    # Save deployment token to the environment file for the deployment action
+    writeToEnvironmentFile:
+      deploymentToken: SECRET_TAB_SWA_DEPLOYMENT_TOKEN
 
   - uses: aadApp/update # Apply the AAD manifest to an existing AAD app. Will use the object id in manifest file to determine which AAD app to update.
     with:
@@ -86,14 +88,12 @@ deploy:
     with:
       workingDirectory: tabs
       args: run build --if-present
-  # Deploy bits to Azure Storage Static Website
-  - uses: azureStorage/deploy
+  # Deploy bits to Azure Static Web Apps
+  - uses: cli/runNpxCommand
+    name: deploy to Azure Static Web Apps
     with:
-      workingDirectory: tabs
-      # Deploy base folder. This folder includes manifest files for AAD app and Teams app that should be ignored using the ignoreFile.
-      artifactFolder: build
-      # The resource id of the cloud resource to be deployed to
-      resourceId: ${{TAB_AZURE_STORAGE_RESOURCE_ID}}
+      args: '@azure/static-web-apps-cli deploy ./tabs/build -d
+        ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
   # Run npm command
   - uses: cli/runNpmCommand
     with:

diff --git a/graph-toolkit-contact-exporter/env/.env.dev b/graph-toolkit-contact-exporter/env/.env.dev
@@ -18,5 +18,5 @@ AAD_APP_ACCESS_AS_USER_PERMISSION_ID=
 AAD_APP_TENANT_ID=
 AAD_APP_OAUTH_AUTHORITY_HOST=
 AAD_APP_OAUTH_AUTHORITY=
-TAB_AZURE_STORAGE_RESOURCE_ID=
+AZURE_STATIC_WEB_APPS_RESOURCE_ID=
 TAB_ENDPOINT=
diff --git a/graph-toolkit-contact-exporter/infra/azure.bicep b/graph-toolkit-contact-exporter/infra/azure.bicep
@@ -1,25 +1,23 @@
 param resourceBaseName string
-param storageSku string
+param staticWebAppSku string
 
-param storageName string = resourceBaseName
-param location string = resourceGroup().location
+param staticWebAppName string = resourceBaseName
 
-// Azure Storage that hosts your static web site
-resource storage 'Microsoft.Storage/storageAccounts@2021-06-01' = {
-  kind: 'StorageV2'
-  location: location
-  name: storageName
-  properties: {
-    supportsHttpsTrafficOnly: true
-  }
+// Azure Static Web Apps that hosts your static web site
+resource swa 'Microsoft.Web/staticSites@2022-09-01' = {
+  name: staticWebAppName
+  // SWA do not need location setting
+  location: 'centralus'
   sku: {
-    name: storageSku
+    name: staticWebAppSku
+    tier: staticWebAppSku
   }
+  properties: {}
 }
 
-var siteDomain = replace(replace(storage.properties.primaryEndpoints.web, 'https://', ''), '/', '')
+var siteDomain = swa.properties.defaultHostname
 
 // The output will be persisted in .env.{envName}. Visit https://aka.ms/teamsfx-actions/arm-deploy for more details.
-output TAB_AZURE_STORAGE_RESOURCE_ID string = storage.id // used in deploy stage
+output AZURE_STATIC_WEB_APPS_RESOURCE_ID string = swa.id
 output TAB_DOMAIN string = siteDomain
 output TAB_ENDPOINT string = 'https://${siteDomain}'
diff --git a/graph-toolkit-contact-exporter/infra/azure.parameters.json b/graph-toolkit-contact-exporter/infra/azure.parameters.json
@@ -5,8 +5,8 @@
       "resourceBaseName": {
         "value": "contactexp${{RESOURCE_SUFFIX}}"
       },
-      "storageSku": {
-        "value": "Standard_LRS"
+      "staticWebAppSku": {
+        "value": "Free"
       }
     }
   }
diff --git a/graph-toolkit-contact-exporter/teamsapp.yml b/graph-toolkit-contact-exporter/teamsapp.yml
@@ -1,7 +1,7 @@
-# yaml-language-server: $schema=https://aka.ms/teams-toolkit/v1.2/yaml.schema.json
+# yaml-language-server: $schema=https://aka.ms/teams-toolkit/v1.5/yaml.schema.json
 # Visit https://aka.ms/teamsfx-v5.0-guide for details on this file
 # Visit https://aka.ms/teamsfx-actions for details on actions
-version: v1.2
+version: v1.5
 
 additionalMetadata:
   sampleTag: TeamsFx-Samples:graph-toolkit-contact-exporter
@@ -43,11 +43,13 @@ provision:
           deploymentName: Create-resources-for-tab # Required when deploy ARM template
       bicepCliVersion: v0.9.1 # Teams Toolkit will download this bicep CLI version from github for you, will use bicep CLI in PATH if you remove this config.
 
-  - uses: azureStorage/enableStaticWebsite
+  # Get the deployment token from Azure Static Web Apps
+  - uses: azureStaticWebApps/getDeploymentToken
     with:
-      storageResourceId: ${{TAB_AZURE_STORAGE_RESOURCE_ID}}
-      indexPage: index.html
-      errorPage: error.html
+      resourceId: ${{AZURE_STATIC_WEB_APPS_RESOURCE_ID}}
+    # Save deployment token to the environment file for the deployment action
+    writeToEnvironmentFile:
+      deploymentToken: SECRET_TAB_SWA_DEPLOYMENT_TOKEN
 
   - uses: aadApp/update # Apply the AAD manifest to an existing AAD app. Will use the object id in manifest file to determine which AAD app to update.
     with:
@@ -90,16 +92,12 @@ deploy:
       REACT_APP_START_LOGIN_PAGE_URL: ${{TAB_ENDPOINT}}/auth-start.html
     with:
       args: run build
-  # Deploy bits to Azure Storage Static Website
-  - uses: azureStorage/deploy
-    with:
-      # Deploy base folder. This folder includes manifest files for AAD app and Teams app that should be ignored using the ignoreFile.
-      artifactFolder: build
-      # The resource id of the cloud resource to be deployed to. 
-      # This key will be generated by arm/deploy action automatically. 
-      # You can replace it with your existing Azure Resource id
-      # or add it to your environment variable file.
-      resourceId: ${{TAB_AZURE_STORAGE_RESOURCE_ID}}
+  # Deploy bits to Azure Static Web Apps
+  - uses: cli/runNpxCommand
+    name: deploy to Azure Static Web Apps
+    with:
+      args: '@azure/static-web-apps-cli deploy ./build -d
+        ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
 
 # Triggered when 'teamsapp publish' is executed
 publish:

diff --git a/graph-toolkit-one-productivity-hub/env/.env.dev b/graph-toolkit-one-productivity-hub/env/.env.dev
@@ -18,5 +18,5 @@ AAD_APP_ACCESS_AS_USER_PERMISSION_ID=
 AAD_APP_TENANT_ID=
 AAD_APP_OAUTH_AUTHORITY_HOST=
 AAD_APP_OAUTH_AUTHORITY=
-TAB_AZURE_STORAGE_RESOURCE_ID=
+AZURE_STATIC_WEB_APPS_RESOURCE_ID=
 TAB_ENDPOINT=