Merge pull request #11644 from influxdata/feat/switch-scrapers-client-lib

Move scraper api calls to client library

ui/src/dataLoaders/actions/dataLoaders.ts

@@ -5,11 +5,10 @@ import _ from 'lodash'
 import {
   createTelegrafConfig,
   updateTelegrafConfig,
-  createScraperTarget,
-  updateScraperTarget,
   getTelegrafConfig,
 } from 'src/onboarding/apis/index'
 import {client} from 'src/utils/api'
+import {ScraperTargetRequest} from 'src/api'
 
 // Utils
 import {createNewPlugin} from 'src/dataLoaders/utils/pluginConfigs'
@@ -440,9 +439,15 @@ export const saveScraperTarget = () => async (
 
   try {
     if (id) {
-      await updateScraperTarget(id, url, bucketID)
+      await client.scrapers.update(id, {url, bucketID})
     } else {
-      const newTarget = await createScraperTarget(url, orgID, bucketID)
+      const newTarget = await client.scrapers.create({
+        name: 'new target',
+        type: ScraperTargetRequest.TypeEnum.Prometheus,
+        url,
+        bucketID,
+        orgID,
+      })
       dispatch(setScraperTargetID(newTarget.id))
     }
   } catch (error) {

ui/src/onboarding/apis/index.ts

@@ -1,18 +1,10 @@
 // Libraries
 import _ from 'lodash'
 
-import {setupAPI, sourcesAPI} from 'src/utils/api'
-
 // Utils
-import {telegrafsAPI, scraperTargetsApi} from 'src/utils/api'
+import {telegrafsAPI, setupAPI, sourcesAPI} from 'src/utils/api'
 
-import {
-  Telegraf,
-  TelegrafRequest,
-  OnboardingResponse,
-  ScraperTargetRequest,
-  ScraperTargetResponse,
-} from 'src/api'
+import {Telegraf, TelegrafRequest, OnboardingResponse} from 'src/api'
 
 import {getDeep} from 'src/utils/wrappers'
 
@@ -122,32 +114,3 @@ export const updateTelegrafConfig = async (
     console.error(error)
   }
 }
-
-export const createScraperTarget = async (
-  url: string,
-  orgID: string,
-  bucketID: string
-): Promise<ScraperTargetResponse> => {
-  const response = await scraperTargetsApi.scrapersPost({
-    name: 'new target',
-    type: ScraperTargetRequest.TypeEnum.Prometheus,
-    url,
-    orgID,
-    bucketID,
-  })
-
-  return response.data
-}
-
-export const updateScraperTarget = async (
-  id: string,
-  url: string,
-  bucketID: string
-): Promise<ScraperTargetResponse> => {
-  const response = await scraperTargetsApi.scrapersScraperTargetIDPatch(id, {
-    url,
-    bucketID,
-  })
-
-  return response.data
-}

ui/src/onboarding/components/CompletionStep.tsx

@@ -16,7 +16,6 @@ import {
 
 // APIs
 import {getDashboards} from 'src/organizations/apis'
-import {createScraperTarget} from 'src/onboarding/apis'
 import {client} from 'src/utils/api'
 
 // Types
@@ -27,7 +26,7 @@ import {
   Grid,
   Columns,
 } from 'src/clockface'
-import {Organization, Dashboard} from 'src/api'
+import {Organization, Dashboard, ScraperTargetRequest} from 'src/api'
 import {OnboardingStepProps} from 'src/onboarding/containers/OnboardingWizard'
 import {QUICKSTART_SCRAPER_TARGET_URL} from 'src/dataLoaders/constants/pluginConfigs'
 
@@ -140,11 +139,13 @@ class CompletionStep extends PureComponent<Props> {
 
   private handleQuickStart = async () => {
     try {
-      await createScraperTarget(
-        QUICKSTART_SCRAPER_TARGET_URL,
-        this.props.orgID,
-        this.props.bucketID
-      )
+      await client.scrapers.create({
+        name: 'new target',
+        type: ScraperTargetRequest.TypeEnum.Prometheus,
+        url: QUICKSTART_SCRAPER_TARGET_URL,
+        bucketID: this.props.bucketID,
+        orgID: this.props.orgID,
+      })
       this.props.notify(QuickstartScraperCreationSuccess)
     } catch (err) {
       this.props.notify(QuickstartScraperCreationError)

ui/src/organizations/apis/index.ts

@@ -4,10 +4,10 @@ import _ from 'lodash'
 // Utils
 import {getDeep} from 'src/utils/wrappers'
 
-import {dashboardsAPI, telegrafsAPI, scraperTargetsApi} from 'src/utils/api'
+import {dashboardsAPI, telegrafsAPI} from 'src/utils/api'
 
 // Types
-import {Organization, Telegraf, ScraperTargetResponses} from 'src/api'
+import {Organization, Telegraf} from 'src/api'
 import {Dashboard} from 'src/types/v2'
 
 // CRUD APIs for Organizations and Organization resources
@@ -71,22 +71,3 @@ export const deleteTelegrafConfig = async (
     console.error(error)
   }
 }
-
-// Scrapers
-export const getScrapers = async (): Promise<ScraperTargetResponses> => {
-  try {
-    const response = await scraperTargetsApi.scrapersGet()
-
-    return response.data
-  } catch (error) {
-    console.error(error)
-  }
-}
-
-export const deleteScraper = async (scraperTargetID: string): Promise<void> => {
-  try {
-    await scraperTargetsApi.scrapersScraperTargetIDDelete(scraperTargetID)
-  } catch (error) {
-    console.error(error)
-  }
-}

ui/src/organizations/components/Scrapers.tsx

@@ -3,7 +3,7 @@ import _ from 'lodash'
 import React, {PureComponent, ChangeEvent} from 'react'
 
 // APIs
-import {deleteScraper} from 'src/organizations/apis/index'
+import {client} from 'src/utils/api'
 
 // Components
 import TabbedPageHeader from 'src/shared/components/tabbed_page/TabbedPageHeader'
@@ -23,12 +23,12 @@ import DataLoadersWizard from 'src/dataLoaders/components/DataLoadersWizard'
 import {ErrorHandling} from 'src/shared/decorators/errors'
 
 // Types
-import {ScraperTargetResponses, ScraperTargetResponse, Bucket} from 'src/api'
+import {ScraperTargetResponse, Bucket} from 'src/api'
 import {OverlayState} from 'src/types/v2'
 import {DataLoaderType, DataLoaderStep} from 'src/types/v2/dataLoaders'
 
 interface Props {
-  scrapers: ScraperTargetResponses
+  scrapers: ScraperTargetResponse[]
   onChange: () => void
   orgName: string
   buckets: Bucket[]
@@ -96,11 +96,11 @@ export default class Scrapers extends PureComponent<Props, State> {
     const {scrapers} = this.props
     const {searchTerm} = this.state
 
-    if (!scrapers || !scrapers.configurations) {
+    if (!scrapers || !scrapers) {
       return []
     }
 
-    return scrapers.configurations.filter(c => {
+    return scrapers.filter(c => {
       if (!searchTerm) {
         return true
       }
@@ -162,7 +162,7 @@ export default class Scrapers extends PureComponent<Props, State> {
   }
 
   private handleDeleteScraper = async (scraper: ScraperTargetResponse) => {
-    await deleteScraper(scraper.id)
+    await client.scrapers.deleteScraper(scraper.id)
     this.props.onChange()
   }
 

ui/src/organizations/containers/OrganizationView.tsx

@@ -5,10 +5,13 @@ import {connect} from 'react-redux'
 import _ from 'lodash'
 
 // APIs
-import {getDashboards, getCollectors, getScrapers} from 'src/organizations/apis'
-
+import {getDashboards, getCollectors} from 'src/organizations/apis'
 import {client} from 'src/utils/api'
 
+const getScrapers = async () => {
+  return await client.scrapers.getAll()
+}
+
 const getBuckets = async (org: Organization) => {
   return client.buckets.getAllByOrg(org)
 }
@@ -43,7 +46,7 @@ import {
   Organization,
   Task,
   Telegraf,
-  ScraperTargetResponses,
+  ScraperTargetResponse,
 } from 'src/api'
 import * as NotificationsActions from 'src/types/actions/notifications'
 
@@ -197,7 +200,7 @@ class OrganizationView extends PureComponent<Props> {
                 url="scrapers_tab"
                 title="Scrapers"
               >
-                <GetOrgResources<ScraperTargetResponses>
+                <GetOrgResources<ScraperTargetResponse[]>
                   organization={org}
                   fetcher={getScrapers}
                 >

ui/src/utils/api.ts

@@ -6,7 +6,6 @@ import {
   SourcesApi,
   QueryApi,
   SetupApi,
-  ScraperTargetsApi,
   ProtosApi,
 } from 'src/api'
 
@@ -23,5 +22,4 @@ export const telegrafsAPI = new TelegrafsApi({basePath})
 export const sourcesAPI = new SourcesApi({basePath})
 export const queryAPI = new QueryApi({basePath})
 export const setupAPI = new SetupApi({basePath})
-export const scraperTargetsApi = new ScraperTargetsApi({basePath})
 export const protosAPI = new ProtosApi({basePath})