Merge #3211 from aws/samsync

feat(sam): "Sync SAM" shows more info if no template.yaml found

Author: justinmk3

.changes/next-release/Feature-c1e800e4-94d4-433d-a545-d6a32b64c7a3.json

@@ -0,0 +1,4 @@
+{
+	"type": "Feature",
+	"description": "\"Sync SAM Application\" command provides Create and Help actions at each step (SAM template, S3 bucket, ECR repo, CloudFormation stack)"
+}

src/shared/awsConsole.ts

@@ -0,0 +1,17 @@
+/*!
+ * Copyright 2018-2019 Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import * as vscode from 'vscode'
+
+export function getAwsConsoleUrl(service: 'ecr' | 'cloudformation', region: string): vscode.Uri {
+    switch (service) {
+        case 'ecr':
+            return vscode.Uri.parse(`https://${region}.console.aws.amazon.com/ecr/repositories?region=${region}`)
+        case 'cloudformation':
+            return vscode.Uri.parse(`https://${region}.console.aws.amazon.com/cloudformation/home?region=${region}`)
+        default:
+            throw Error()
+    }
+}

src/shared/constants.ts

@@ -3,6 +3,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import * as vscode from 'vscode'
+
 import { isCloud9 } from './extensionUtilities'
 
 export const extensionSettingsPrefix = 'aws'
@@ -38,9 +40,11 @@ export const supportedLambdaRuntimesUrl: string =
     'https://docs.aws.amazon.com/lambda/latest/dg/runtime-support-policy.html'
 export const createUrlForLambdaFunctionUrl = 'https://docs.aws.amazon.com/lambda/latest/dg/urls-configuration.html'
 // URLs for samInitWizard
-export const samInitDocUrl: string = isCloud9()
-    ? 'https://docs.aws.amazon.com/cloud9/latest/user-guide/serverless-apps-toolkit.html#sam-create'
-    : 'https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/serverless-apps.html#serverless-apps-create'
+export const samInitDocUrl = vscode.Uri.parse(
+    isCloud9()
+        ? 'https://docs.aws.amazon.com/cloud9/latest/user-guide/serverless-apps-toolkit.html#sam-create'
+        : 'https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/serverless-apps.html#serverless-apps-create'
+)
 export const launchConfigDocUrl: string = isCloud9()
     ? 'https://docs.aws.amazon.com/cloud9/latest/user-guide/sam-debug-config-ref.html'
     : 'https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/serverless-apps-run-debug-config-ref.html'
@@ -50,8 +54,9 @@ export const samDeployDocUrl: string = isCloud9()
     : 'https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/serverless-apps.html#serverless-apps-deploy'
 export const lambdaFunctionUrlConfigUrl: string = 'https://docs.aws.amazon.com/lambda/latest/dg/urls-configuration.html'
 // URLs for "sam sync" wizard.
-export const samSyncUrl: string =
+export const samSyncUrl = vscode.Uri.parse(
     'https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/accelerate-getting-started.html'
+)
 
 // URLs for CDK
 export const cdkProvideFeedbackUrl: string = `${githubUrl}/issues/new/choose`

src/shared/logger/winstonToolkitLogger.ts

@@ -119,11 +119,18 @@ export class WinstonToolkitLogger implements Logger, vscode.Disposable {
     }
 
     private mapError(level: LogLevel, err: Error): Error | string {
+        // Use ToolkitError.trace even if we have source mapping (see below), because:
+        // 1. it is what users will see, we want visibility into that when debugging
+        // 2. it is often more useful than the stacktrace anyway
+        if (err instanceof ToolkitError) {
+            return err.trace
+        }
+
         if (isSourceMappingAvailable() && level === 'error') {
             return err
         }
 
-        return err instanceof ToolkitError ? err.trace : formatError(UnknownError.cast(err))
+        return formatError(UnknownError.cast(err))
     }
 
     private writeToLogs(level: LogLevel, message: string | Error, ...meta: any[]): number {

src/shared/sam/sync.ts

@@ -7,6 +7,7 @@ import globals from '../extensionGlobals'
 
 import * as vscode from 'vscode'
 import * as path from 'path'
+import * as nls from 'vscode-nls'
 import * as localizedText from '../localizedText'
 import { DefaultS3Client } from '../clients/s3Client'
 import { Wizard } from '../wizards/wizard'
@@ -40,7 +41,10 @@ import { parse } from 'semver'
 import { isAutomation } from '../vscode/env'
 import { getOverriddenParameters } from '../../lambda/config/parameterUtils'
 import { addTelemetryEnvVar } from './cli/samCliInvokerUtils'
-import { samSyncUrl } from '../constants'
+import { samSyncUrl, samInitDocUrl } from '../constants'
+import { getAwsConsoleUrl } from '../awsConsole'
+
+const localize = nls.loadMessageBundle()
 
 export interface SyncParams {
     readonly region: string
@@ -68,13 +72,22 @@ function createBucketPrompter(client: DefaultS3Client) {
 
     return createQuickPick(items, {
         title: 'Select an S3 Bucket',
-        placeholder: 'Filter or enter a new bucket name',
+        placeholder: 'Select a bucket (or enter a name to create one)',
         buttons: createCommonButtons(samSyncUrl),
         filterBoxInputSettings: {
             label: 'Create a New Bucket',
             // This is basically a hack. I need to refactor `createQuickPick` a bit.
             transform: v => prefixNewBucketName(v),
         },
+        noItemsFoundItem: {
+            label: localize(
+                'aws.cfn.noStacks',
+                'No S3 buckets for region "{0}". Enter a name to create a new one.',
+                client.regionCode
+            ),
+            data: undefined,
+            onClick: undefined,
+        },
     })
 }
 
@@ -84,6 +97,7 @@ const canShowStack = (s: StackSummary) =>
 
 function createStackPrompter(client: DefaultCloudFormationClient) {
     const recentStack = getRecentResponse(client.regionCode, 'stackName')
+    const consoleUrl = getAwsConsoleUrl('cloudformation', client.regionCode)
     const items = client.listAllStacks().map(stacks =>
         stacks.filter(canShowStack).map(s => ({
             label: s.StackName,
@@ -96,17 +110,27 @@ function createStackPrompter(client: DefaultCloudFormationClient) {
 
     return createQuickPick(items, {
         title: 'Select a CloudFormation Stack',
-        placeholder: 'Filter or enter a new stack name',
+        placeholder: 'Select a stack (or enter a name to create one)',
         filterBoxInputSettings: {
             label: 'Create a New Stack',
             transform: v => v,
         },
-        buttons: createCommonButtons(samSyncUrl),
+        buttons: createCommonButtons(samSyncUrl, consoleUrl),
+        noItemsFoundItem: {
+            label: localize(
+                'aws.cfn.noStacks',
+                'No stacks in region "{0}". Enter a name to create a new one.',
+                client.regionCode
+            ),
+            data: undefined,
+            onClick: undefined,
+        },
     })
 }
 
 function createEcrPrompter(client: DefaultEcrClient) {
     const recentEcrRepo = getRecentResponse(client.regionCode, 'ecrRepoUri')
+    const consoleUrl = getAwsConsoleUrl('ecr', client.regionCode)
     const items = client.listAllRepositories().map(list =>
         list.map(repo => ({
             label: repo.repositoryName,
@@ -118,12 +142,21 @@ function createEcrPrompter(client: DefaultEcrClient) {
 
     return createQuickPick(items, {
         title: 'Select an ECR Repository',
-        placeholder: 'Filter or enter an existing repository URI',
-        buttons: createCommonButtons(samSyncUrl),
+        placeholder: 'Select a repository (or enter repository URI)',
+        buttons: createCommonButtons(samSyncUrl, consoleUrl),
         filterBoxInputSettings: {
             label: 'Existing repository URI',
             transform: v => v,
         },
+        noItemsFoundItem: {
+            label: localize(
+                'aws.ecr.noRepos',
+                'No ECR repositories in region "{0}". Enter a name to create a new one.',
+                client.regionCode
+            ),
+            data: undefined,
+            onClick: undefined,
+        },
     })
 }
 
@@ -138,6 +171,7 @@ export function createEnvironmentPrompter(config: SamConfig, environments = conf
 
     return createQuickPick(items, {
         title: 'Select an Environment to Use',
+        placeholder: 'Select an environment',
         buttons: createCommonButtons(samSyncUrl),
     })
 }
@@ -166,8 +200,14 @@ function createTemplatePrompter() {
 
     const trimmedItems = folders.size === 1 ? items.map(item => ({ ...item, description: undefined })) : items
     return createQuickPick(trimmedItems, {
-        title: 'Select a CloudFormation Template',
+        title: 'Select a SAM CloudFormation Template',
+        placeholder: 'Select a SAM template.yaml file',
         buttons: createCommonButtons(samSyncUrl),
+        noItemsFoundItem: {
+            label: localize('aws.sam.noWorkspace', 'No SAM template.yaml file(s) found. Select for help'),
+            data: undefined,
+            onClick: () => vscode.env.openExternal(samInitDocUrl),
+        },
     })
 }
 

src/shared/ui/buttons.ts

@@ -8,9 +8,11 @@ import * as nls from 'vscode-nls'
 import { documentationUrl } from '../constants'
 import { getIcon } from '../icons'
 import { WizardControl, WIZARD_EXIT, WIZARD_RETRY } from '../wizards/wizard'
+import { getIdeProperties } from '../extensionUtilities'
 
 const localize = nls.loadMessageBundle()
 const helpTooltip = localize('AWS.command.help', 'View Toolkit Documentation')
+const awsConsoleTooltip = () => localize('AWS.button.awsConsole', 'Open {0} Console', getIdeProperties().company)
 
 type WizardButton<T> = QuickInputButton<T | WizardControl> | QuickInputButton<void>
 export type PrompterButtons<T> = readonly WizardButton<T>[]
@@ -109,6 +111,14 @@ export function createBackButton(): QuickInputButton<WizardControl> {
     return vscode.QuickInputButtons.Back as QuickInputButton<WizardControl>
 }
 
+export function createAwsConsoleButton(
+    uri: string | vscode.Uri,
+    tooltip: string = awsConsoleTooltip()
+): QuickInputLinkButton {
+    const iconPath = getIcon('vscode-link-external')
+    return new QuickInputLinkButton(uri, iconPath, tooltip)
+}
+
 export function createExitButton(): QuickInputButton<WizardControl> {
     return {
         iconPath: getIcon('vscode-close'),
@@ -137,8 +147,14 @@ export function createPlusButton(tooltip?: string): QuickInputButton<void> {
  * Currently has: 'help', 'exit', and 'back'
  *
  * @param helpUri optional URI to link to for the 'help' button (see {@link createHelpButton} for defaults)
+ * @param awsConsoleUri optional URI to AWS web console
  * @returns An array of buttons
  */
-export function createCommonButtons(helpUri?: string | vscode.Uri): PrompterButtons<WizardControl> {
-    return [createHelpButton(helpUri), createBackButton(), createExitButton()]
+export function createCommonButtons(
+    helpUri?: string | vscode.Uri,
+    awsConsoleUri?: string | vscode.Uri
+): PrompterButtons<WizardControl> {
+    const buttons2 = [createHelpButton(helpUri), createBackButton(), createExitButton()]
+    const buttons1: typeof buttons2 = awsConsoleUri ? [createAwsConsoleButton(awsConsoleUri)] : []
+    return buttons1.concat(buttons2)
 }

src/shared/ui/pickerPrompter.ts

@@ -137,7 +137,7 @@ export function createQuickPick<T>(
 
     const prompter =
         mergedOptions.filterBoxInputSettings !== undefined
-            ? new FilterBoxQuickPickPrompter<T>(picker, mergedOptions.filterBoxInputSettings)
+            ? new FilterBoxQuickPickPrompter<T>(picker, mergedOptions)
             : new QuickPickPrompter<T>(picker, mergedOptions)
 
     prompter.loadItems(items)
@@ -578,12 +578,12 @@ export class FilterBoxQuickPickPrompter<T> extends QuickPickPrompter<T> {
         }
     }
 
-    constructor(quickPick: DataQuickPick<T>, private readonly settings: FilterBoxInputSettings<T>) {
+    constructor(quickPick: DataQuickPick<T>, protected override options: ExtendedQuickPickOptions<T>) {
         super(quickPick)
 
         this.transform(selection => {
             if ((selection as T | typeof customUserInput) === customUserInput) {
-                return settings.transform(quickPick.value) ?? selection
+                return options?.filterBoxInputSettings?.transform(quickPick.value) ?? selection
             }
             return selection
         })
@@ -600,10 +600,13 @@ export class FilterBoxQuickPickPrompter<T> extends QuickPickPrompter<T> {
 
     private addFilterBoxInput(): void {
         const picker = this.quickPick as DataQuickPick<T | symbol>
-        const validator = (input: string) =>
-            this.settings.validator !== undefined ? this.settings.validator(input) : undefined
+        const settings = this.options?.filterBoxInputSettings
+        if (!settings) {
+            throw Error()
+        }
+        const validator = (input: string) => (settings.validator !== undefined ? settings.validator(input) : undefined)
         const items = picker.items.filter(item => item.data !== customUserInput)
-        const { label } = this.settings
+        const { label } = settings
 
         function update(value: string = '') {
             if (value !== '') {

src/test/shared/sam/sync.test.ts

@@ -21,7 +21,7 @@ describe('SyncWizard', function () {
     const createTester = (params?: Partial<SyncParams>) =>
         createWizardTester(new SyncWizard({ deployType: 'code', ...params }))
 
-    it('prompts for region -> template -> stackName -> bucketName', function () {
+    it('shows steps in correct order', function () {
         const tester = createTester()
         tester.region.assertShowFirst()
         tester.template.assertShowSecond()

src/test/shared/ui/pickerPrompter.test.ts

@@ -296,6 +296,9 @@ describe('FilterBoxQuickPickPrompter', function () {
         transform: (resp: string) => Number.parseInt(resp),
         validator: (resp: string) => (Number.isNaN(Number.parseInt(resp)) ? 'NaN' : undefined),
     }
+    const options = {
+        filterBoxInputSettings: filterBoxInputSettings,
+    }
 
     let picker: TestQuickPick<DataQuickPickItem<number>>
     let testPrompter: FilterBoxQuickPickPrompter<number>
@@ -306,7 +309,7 @@ describe('FilterBoxQuickPickPrompter', function () {
 
     beforeEach(function () {
         picker = getTestWindow().createQuickPick() as typeof picker
-        testPrompter = new FilterBoxQuickPickPrompter(picker, filterBoxInputSettings)
+        testPrompter = new FilterBoxQuickPickPrompter(picker, options)
     })
 
     it('adds a new item based off the filter box', async function () {