Add capabilities to text mentioning storage provider extensions (#4015)

iterative · May 31, 2023 · 7df876c · 7df876c
1 parent 4f48372
commit 7df876c
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 8 deletions.
diff --git a/webview/src/setup/components/remotes/AmazonS3.tsx b/webview/src/setup/components/remotes/AmazonS3.tsx
@@ -14,7 +14,11 @@ export const AmazonS3 = () => (
       </a>
       . This reads the default AWS credentials file (if available) or env vars.
     </p>
-    <ShowExtension id="AmazonWebServices.aws-toolkit-vscode" name="AWS" />
+    <ShowExtension
+      id="AmazonWebServices.aws-toolkit-vscode"
+      name="AWS Toolkit"
+      capabilities="manage AWS profiles and S3 buckets"
+    />
     <InfoText>
       The AWS user needs the following permissions: s3:ListBucket, s3:GetObject,
       s3:PutObject, s3:DeleteObject.

diff --git a/webview/src/setup/components/remotes/AzureBlobStorage.tsx b/webview/src/setup/components/remotes/AzureBlobStorage.tsx
@@ -13,6 +13,7 @@ export const AzureBlobStorage = () => (
       for details on how to authenticate.
     </p>
     <ShowExtension
+      capabilities="create storage accounts and manage blob containers"
       id="ms-azuretools.vscode-azurestorage"
       name="Azure Storage"
     />

diff --git a/webview/src/setup/components/remotes/GoogleCloudStorage.tsx b/webview/src/setup/components/remotes/GoogleCloudStorage.tsx
@@ -15,7 +15,11 @@ export const GoogleCloudStorage: React.FC = () => (
       </a>
       . This reads the default GCP key file.
     </p>
-    <ShowExtension id="GoogleCloudTools.cloudcode" name="Google Cloud Code" />
+    <ShowExtension
+      id="GoogleCloudTools.cloudcode"
+      name="Google Cloud Code"
+      capabilities="create projects and provides snippets for working with the Cloud Storage API"
+    />
     <p>
       <Icon icon={Warning} width={16} height={16} className={styles.warnIcon} />{' '}
       Make sure to run{' '}

diff --git a/webview/src/setup/components/remotes/ShowExtension.tsx b/webview/src/setup/components/remotes/ShowExtension.tsx
@@ -3,10 +3,11 @@ import styles from './styles.module.scss'
 import { Icon } from '../../../shared/components/Icon'
 import { Extensions } from '../../../shared/components/icons'
 
-export const ShowExtension: React.FC<{ id: string; name: string }> = ({
-  id,
-  name
-}) => {
+export const ShowExtension: React.FC<{
+  capabilities: string
+  id: string
+  name: string
+}> = ({ capabilities, id, name }) => {
   const idQuery = `"@id:${id}"`
 
   return (
@@ -17,15 +18,15 @@ export const ShowExtension: React.FC<{ id: string; name: string }> = ({
         height={16}
         className={styles.infoIcon}
       />{' '}
-      View the{' '}
+      The{' '}
       <a
         href={`command:workbench.extensions.search?${encodeURIComponent(
           idQuery
         )}`}
       >
         {name}
       </a>{' '}
-      extension.
+      extension can be used to <span>{capabilities}</span>.
     </p>
   )
 }