Merge pull request #6043 from Shopify/clickable-link-fix

fix: make dev store creation links clickable in CLI

Author: amcaplan

.changeset/mean-keys-add.md

@@ -0,0 +1,5 @@
+---
+'@shopify/app': patch
+---
+
+Make dev store creation link clickable

packages/app/src/cli/utilities/developer-platform-client.ts

@@ -59,6 +59,7 @@ import {
   AppLogsSubscribeMutation,
   AppLogsSubscribeMutationVariables,
 } from '../api/graphql/app-management/generated/app-logs-subscribe.js'
+import {TokenItem} from '@shopify/cli-kit/node/ui'
 import {blockPartnersAccess} from '@shopify/cli-kit/node/environment'
 import {UnauthorizedHandler} from '@shopify/cli-kit/node/api/graphql'
 
@@ -326,7 +327,7 @@ export interface DeveloperPlatformClient {
   devSessionCreate: (input: DevSessionCreateOptions) => Promise<DevSessionCreateMutation>
   devSessionUpdate: (input: DevSessionUpdateOptions) => Promise<DevSessionUpdateMutation>
   devSessionDelete: (input: DevSessionSharedOptions) => Promise<DevSessionDeleteMutation>
-  getCreateDevStoreLink: (org: Organization) => Promise<string>
+  getCreateDevStoreLink: (org: Organization) => Promise<TokenItem>
 }
 
 const inProgressRefreshes = new WeakMap<DeveloperPlatformClient, Promise<string>>()

packages/app/src/cli/utilities/developer-platform-client/app-management-client.ts

@@ -161,6 +161,7 @@ import {CLI_KIT_VERSION} from '@shopify/cli-kit/common/version'
 import {versionSatisfies} from '@shopify/cli-kit/node/node-package-manager'
 import {outputDebug} from '@shopify/cli-kit/node/output'
 import {developerDashboardFqdn} from '@shopify/cli-kit/node/context/fqdn'
+import {TokenItem} from '@shopify/cli-kit/node/ui'
 import {functionsRequestDoc, FunctionsRequestOptions} from '@shopify/cli-kit/node/api/functions'
 import {fileExists, readFile} from '@shopify/cli-kit/node/fs'
 import {JsonMapType} from '@shopify/cli-kit/node/toml'
@@ -1045,12 +1046,12 @@ export class AppManagementClient implements DeveloperPlatformClient {
     return this.appDevRequest({query: DevSessionDelete, shopFqdn, variables: {appId: appIdNumber}})
   }
 
-  async getCreateDevStoreLink(org: Organization): Promise<string> {
+  async getCreateDevStoreLink(org: Organization): Promise<TokenItem> {
     const url = `https://${await developerDashboardFqdn()}/dashboard/${org.id}/stores`
-    return (
-      `Looks like you don't have any dev stores associated with ${org.businessName}'s Dev Dashboard.` +
-      ` Create one now \n${url}`
-    )
+    return [
+      `Looks like you don't have any dev stores associated with ${org.businessName}'s Dev Dashboard.`,
+      {link: {url, label: 'Create one now'}},
+    ]
   }
 
   private async activeAppVersionRawResult({organizationId, apiKey}: AppApiKeyAndOrgId): Promise<ActiveAppReleaseQuery> {

packages/app/src/cli/utilities/developer-platform-client/partners-client.ts

@@ -162,6 +162,7 @@ import {generateFetchAppLogUrl, partnersRequest, partnersRequestDoc} from '@shop
 import {CacheOptions, GraphQLVariables, UnauthorizedHandler} from '@shopify/cli-kit/node/api/graphql'
 import {ensureAuthenticatedPartners} from '@shopify/cli-kit/node/session'
 import {partnersFqdn} from '@shopify/cli-kit/node/context/fqdn'
+import {TokenItem} from '@shopify/cli-kit/node/ui'
 import {RequestModeInput, Response, shopifyFetch} from '@shopify/cli-kit/node/http'
 import {CLI_KIT_VERSION} from '@shopify/cli-kit/common/version'
 
@@ -645,12 +646,12 @@ export class PartnersClient implements DeveloperPlatformClient {
     return Promise.resolve()
   }
 
-  async getCreateDevStoreLink(org: Organization): Promise<string> {
+  async getCreateDevStoreLink(org: Organization): Promise<TokenItem> {
     const url = `https://${await partnersFqdn()}/${org.id}/stores`
-    return (
-      `Looks like you don't have any dev stores associated with ${org.businessName}'s Partner Dashboard.` +
-      ` Create one now \n${url}`
-    )
+    return [
+      `Looks like you don't have any dev stores associated with ${org.businessName}'s Partner Dashboard.`,
+      {link: {url, label: 'Create one now'}},
+    ]
   }
 
   private async fetchOrgAndApps(orgId: string, title?: string): Promise<OrgAndAppsResponse> {