import gql from 'graphql-tag'
import { customElement } from 'lit/decorators.js'

import { client } from '@operato/graphql'

import { DynamicSelector } from './dynamic-selector.js'

const FETCH_CONNECTORS_GQL = gql`
  {
    connectors {
      items {
        name
        description
      }

      total
    }
  }
`

@customElement('connector-selector')
export class ConnectorSelector extends DynamicSelector {
  async getOptions() {
    var response = await client.query({
      query: FETCH_CONNECTORS_GQL
    })

    return (response && response.data && response.data.connectors.items) || []
  }
}