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

import { client } from '@operato/graphql'

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

const FETCH_CONNECTIONS_GQL = gql`
  {
    connections {
      items {
        name
        description
      }

      total
    }
  }
`

@customElement('connection-selector')
export class ConnectionSelector extends DynamicSelector {
  async getOptions() {
    var response = await client.query({
      query: FETCH_CONNECTIONS_GQL
    })

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