adding local metrics dashboard for quickstart

CHANGELOG.md

@@ -11,6 +11,7 @@
 1. [13520](https://github.com/influxdata/influxdb/pull/13520): Add cautioning to bucket renaming
 1. [13560](https://github.com/influxdata/influxdb/pull/13560): Add option to generate all access token in tokens tab
 1. [13601](https://github.com/influxdata/influxdb/pull/13601): Add option to generate read/write token in tokens tab
+1. [13715](https://github.com/influxdata/influxdb/pull/13715): Added a new Local Metrics Dashboard template that is created during Quick Start
 
 ### Bug Fixes
 1. [13584](https://github.com/influxdata/influxdb/pull/13584): Fixed scroll clipping found in label editing flow

ui/src/onboarding/actions/index.ts

@@ -89,6 +89,10 @@ export const setupAdmin = (params: ISetupParams) => async (
       ...defaultTemplates.gettingStartedWithFluxTemplate(),
       orgID,
     })
+    await client.templates.create({
+      ...defaultTemplates.localMetricsTemplate(),
+      orgID,
+    })
 
     dispatch(notify(SetupSuccess))
     dispatch(setStepStatus(1, StepStatus.Complete))

ui/src/onboarding/components/CompletionStep.tsx

@@ -12,11 +12,15 @@ import FancyScrollbar from 'src/shared/components/fancy_scrollbar/FancyScrollbar
 import {
   QuickstartScraperCreationSuccess,
   QuickstartScraperCreationError,
+  QuickstartDashboardCreationSuccess,
+  QuickstartDashboardCreationError,
 } from 'src/shared/copy/notifications'
+import {QUICKSTART_DASHBOARD_NAME} from 'src/onboarding/constants'
 
 // APIs
 import {getDashboards} from 'src/organizations/apis'
 import {client} from 'src/utils/api'
+import {createDashboardFromTemplate as createDashboardFromTemplateAJAX} from 'src/templates/api'
 
 // Types
 import {
@@ -26,6 +30,7 @@ import {
   Columns,
   Grid,
 } from '@influxdata/clockface'
+import {DashboardTemplate} from 'src/types'
 import {Organization, Dashboard, ScraperTargetRequest} from '@influxdata/influx'
 import {OnboardingStepProps} from 'src/onboarding/containers/OnboardingWizard'
 import {QUICKSTART_SCRAPER_TARGET_URL} from 'src/dataLoaders/constants/pluginConfigs'
@@ -151,7 +156,28 @@ class CompletionStep extends PureComponent<Props> {
     } catch (err) {
       this.props.notify(QuickstartScraperCreationError)
     }
-
+    try {
+      const templatesEntries = await client.templates.getAll(this.props.orgID)
+      const templatesToGet = templatesEntries.filter(t => {
+        return (
+          t.meta.name.toLowerCase() == QUICKSTART_DASHBOARD_NAME.toLowerCase()
+        )
+      })
+      const pendingTemplates = templatesToGet.map(t =>
+        client.templates.get(t.id)
+      )
+      const templates = await Promise.all(pendingTemplates)
+      const pendingDashboards = templates.map(t =>
+        createDashboardFromTemplateAJAX(
+          t as DashboardTemplate,
+          this.props.orgID
+        )
+      )
+      await Promise.all(pendingDashboards)
+      this.props.notify(QuickstartDashboardCreationSuccess)
+    } catch (err) {
+      this.props.notify(QuickstartDashboardCreationError)
+    }
     this.props.onExit()
   }
 

ui/src/onboarding/constants/index.ts

@@ -0,0 +1 @@
+export const QUICKSTART_DASHBOARD_NAME = 'Local Metrics-Template'

ui/src/organizations/actions/orgs.ts

@@ -159,6 +159,10 @@ export const createOrgWithBucket = (
       ...defaultTemplates.gettingStartedWithFluxTemplate(),
       orgID: createdOrg.id,
     })
+    await client.templates.create({
+      ...defaultTemplates.localMetricsTemplate(),
+      orgID: createdOrg.id,
+    })
     dispatch(notify(orgCreateSuccess()))
 
     dispatch(addOrg(createdOrg))

ui/src/shared/copy/notifications.ts

@@ -84,6 +84,16 @@ export const QuickstartScraperCreationError: Notification = {
   message: `Failed to configure InfluxDB Scraper`,
 }
 
+export const QuickstartDashboardCreationSuccess: Notification = {
+  ...defaultSuccessNotification,
+  message: `The Local Metrics Dashboard has been created`,
+}
+
+export const QuickstartDashboardCreationError: Notification = {
+  ...defaultErrorNotification,
+  message: `Failed to create the Local Metrics Dashboard`,
+}
+
 export const TelegrafConfigCreationSuccess: Notification = {
   ...defaultSuccessNotification,
   message: `Your configurations have been saved`,