import SDK from '@sitecore-feaas/sdk'

const sdk = new SDK({
  // API key to access the library (can be found in Library settings in web app)
  apiKey: 'my-api-key',

  // enable logging
  verbose: true,

  // Optional: Configuring the non-production environment
  backend: 'https://components-qa.sitecore-staging.cloud/api',
  frontend: 'https://components-qa.sitecore-staging.cloud',
  cdn: `https://feaas.blob.core.windows.net`
})

// Optional: Set XM Cloud tenant context to sync datasources with
// sdk.auth.tenant = tenant

// Access library
const library = await sdk.libraries.get({ id: 'my-library' })

// Fetch all dependent resources (components, stylesheets, datasources)
// Everything EXCLUDING component versions
await library.fetchAll()

// Include clientside code that powers web components
import '@sitecore-feaas/clientside'

for (const collection of library.collections) {
  for (const component of collection.components) {
    const element = document.createElement('feaas-component')
    element.setAttribute('src', component.getSourceURL())
    document.appendChild(element)
  }
}