feat(appcomposer): prompt for IAM credentials #4247

Problem: SAM Sync feature shows an ambiguous error message when the user
is signed in with SSO or Builder ID (no active IAM credentials).

Solution: Prompt the user with a list of IAM credentials to choose from,
if an IAM connection is not already active.

Co-authored-by: Jacob Largent <[email protected]>

Author: JLargent42

.changes/next-release/Bug Fix-acaea338-3c74-41b5-b09a-839806679551.json

@@ -0,0 +1,4 @@
+{
+	"type": "Bug Fix",
+	"description": "Add invalid auth handling to Application Composer's Sync button"
+}

src/applicationcomposer/webviewManager.ts

@@ -106,7 +106,7 @@ export class ApplicationComposerManager {
     protected handleErr(err: Error): void {
         void vscode.window.showInformationMessage(
             localize(
-                'AWS.applicationcomposer.visualisation.errors.rendering',
+                'AWS.applicationComposer.visualisation.errors.rendering',
                 'There was an error rendering Application Composer, check logs for details.'
             )
         )

src/auth/utils.ts

@@ -53,7 +53,9 @@ import { isValidCodeWhispererCoreConnection } from '../codewhisperer/util/authUt
 // TODO: Look to do some refactoring to handle circular dependency later and move this to ./commands.ts
 export const showConnectionsPageCommand = 'aws.auth.manageConnections'
 
-export async function promptForConnection(auth: Auth, type?: 'iam' | 'sso'): Promise<Connection | void> {
+// iam-only excludes Builder ID and IAM Identity Center from the list of valid connections
+// TODO: Understand if "iam" should include these from the list at all
+export async function promptForConnection(auth: Auth, type?: 'iam' | 'iam-only' | 'sso'): Promise<Connection | void> {
     const resp = await createConnectionPrompter(auth, type).prompt()
     if (!isValidResponse(resp)) {
         throw new CancellationError('user')
@@ -331,7 +333,7 @@ export const createDeleteConnectionButton: () => vscode.QuickInputButton = () =>
     return { tooltip: deleteConnection, iconPath: getIcon('vscode-trash') }
 }
 
-export function createConnectionPrompter(auth: Auth, type?: 'iam' | 'sso') {
+export function createConnectionPrompter(auth: Auth, type?: 'iam' | 'iam-only' | 'sso') {
     const addNewConnection = {
         label: codicon`${getIcon('vscode-plus')} Add New Connection`,
         data: 'addNewConnection' as const,
@@ -341,7 +343,7 @@ export function createConnectionPrompter(auth: Auth, type?: 'iam' | 'sso') {
         data: 'editCredentials' as const,
     }
     const placeholder =
-        type === 'iam'
+        type === 'iam' || type === 'iam-only'
             ? localize('aws.auth.promptConnection.iam.placeholder', 'Select an IAM credential')
             : localize('aws.auth.promptConnection.all.placeholder', 'Select a connection')
 
@@ -375,7 +377,8 @@ export function createConnectionPrompter(auth: Auth, type?: 'iam' | 'sso') {
         return 2
     }
 
-    const prompter = createQuickPick(loadItems(), {
+    const excludeSso = type === 'iam-only'
+    const prompter = createQuickPick(loadItems(excludeSso), {
         placeholder,
         title: localize('aws.auth.promptConnection.title', 'Switch Connection'),
         buttons: [refreshButton, createExitButton()],
@@ -404,10 +407,13 @@ export function createConnectionPrompter(auth: Auth, type?: 'iam' | 'sso') {
 
     return prompter
 
-    async function* loadItems(): AsyncGenerator<
-        DataQuickPickItem<Connection | 'addNewConnection' | 'editCredentials'>[]
-    > {
-        const connections = auth.listAndTraverseConnections()
+    async function* loadItems(
+        excludeSso?: boolean
+    ): AsyncGenerator<DataQuickPickItem<Connection | 'addNewConnection' | 'editCredentials'>[]> {
+        let connections = auth.listAndTraverseConnections()
+        if (excludeSso) {
+            connections = connections.filter(item => item.type !== 'sso')
+        }
 
         let hasShownEdit = false
 

src/shared/sam/sync.ts

@@ -41,12 +41,13 @@ import { parse } from 'semver'
 import { isAutomation } from '../vscode/env'
 import { getOverriddenParameters } from '../../lambda/config/parameterUtils'
 import { addTelemetryEnvVar } from './cli/samCliInvokerUtils'
-import { samSyncUrl, samInitDocUrl, samUpgradeUrl } from '../constants'
+import { samSyncUrl, samInitDocUrl, samUpgradeUrl, credentialHelpUrl } from '../constants'
 import { getAwsConsoleUrl } from '../awsConsole'
 import { openUrl } from '../utilities/vsCodeUtils'
-import { showOnce } from '../utilities/messages'
+import { showMessageWithUrl, showOnce } from '../utilities/messages'
 import { IamConnection } from '../../auth/connection'
 import { CloudFormationTemplateRegistry } from '../fs/templateRegistry'
+import { promptAndUseConnection } from '../../auth/utils'
 
 const localize = nls.loadMessageBundle()
 
@@ -535,6 +536,38 @@ export type SamSyncResult = {
     isSuccess: boolean
 }
 
+async function getAuthOrPrompt() {
+    const connection = Auth.instance.activeConnection
+    if (connection?.type === 'iam' && connection.state === 'valid') {
+        return connection
+    }
+    let errorMessage = localize(
+        'aws.sam.sync.authModal.message',
+        'Syncing requires authentication with IAM credentials.'
+    )
+    if (connection?.state === 'valid') {
+        errorMessage =
+            localize(
+                'aws.sam.sync.authModal.invalidAuth',
+                'Authentication through Builder ID or IAM Identity Center detected. '
+            ) + errorMessage
+    }
+    const acceptMessage = localize('aws.sam.sync.authModal.accept', 'Authenticate with IAM credentials')
+    const modalResponse = await showMessageWithUrl(
+        errorMessage,
+        credentialHelpUrl,
+        localizedText.viewDocs,
+        'info',
+        [acceptMessage],
+        true
+    )
+    if (modalResponse !== acceptMessage) {
+        return
+    }
+    await promptAndUseConnection(Auth.instance, 'iam-only')
+    return Auth.instance.activeConnection
+}
+
 export function registerSync() {
     async function runSync(
         deployType: SyncParams['deployType'],
@@ -543,9 +576,11 @@ export function registerSync() {
     ): Promise<SamSyncResult> {
         telemetry.record({ syncedResources: deployType === 'infra' ? 'AllResources' : 'CodeOnly' })
 
-        const connection = Auth.instance.activeConnection
-        if (connection?.type !== 'iam') {
-            throw new ToolkitError('Syncing SAM applications requires IAM credentials', { code: 'NoIAMCredentials' })
+        const connection = await getAuthOrPrompt()
+        if (connection?.type !== 'iam' || connection?.state !== 'valid') {
+            throw new ToolkitError('Syncing SAM applications requires IAM credentials', {
+                code: 'NoIAMCredentials',
+            })
         }
 
         // Constructor of `vscode.Uri` is marked private but that shouldn't matter when checking the instance type

src/shared/utilities/messages.ts

@@ -35,16 +35,17 @@ export function makeFailedWriteMessage(filename: string): string {
 function showMessageWithItems(
     message: string,
     kind: 'info' | 'warn' | 'error' = 'error',
-    items: string[] = []
+    items: string[] = [],
+    useModal: boolean = false
 ): Thenable<string | undefined> {
     switch (kind) {
         case 'info':
-            return vscode.window.showInformationMessage(message, ...items)
+            return vscode.window.showInformationMessage(message, { modal: useModal }, ...items)
         case 'warn':
-            return vscode.window.showWarningMessage(message, ...items)
+            return vscode.window.showWarningMessage(message, { modal: useModal }, ...items)
         case 'error':
         default:
-            return vscode.window.showErrorMessage(message, ...items)
+            return vscode.window.showErrorMessage(message, { modal: useModal }, ...items)
     }
 }
 
@@ -56,6 +57,7 @@ function showMessageWithItems(
  * @param urlItem URL button text (default: "View Documentation")
  * @param kind  Kind of message to show
  * @param extraItems  Extra buttons shown _before_ the "View Documentation" button
+ * @param useModal Flag to use a modal instead of a toast notification
  * @returns Promise that resolves when a button is clicked or the message is
  * dismissed, and returns the selected button text.
  */
@@ -64,12 +66,13 @@ export async function showMessageWithUrl(
     url: string | vscode.Uri,
     urlItem: string = localizedText.viewDocs,
     kind: 'info' | 'warn' | 'error' = 'error',
-    extraItems: string[] = []
+    extraItems: string[] = [],
+    useModal: boolean = false
 ): Promise<string | undefined> {
     const uri = typeof url === 'string' ? vscode.Uri.parse(url) : url
     const items = [...extraItems, urlItem]
 
-    const p = showMessageWithItems(message, kind, items)
+    const p = showMessageWithItems(message, kind, items, useModal)
     return p.then<string | undefined>(selection => {
         if (selection === urlItem) {
             void openUrl(uri)