import { SDKModel } from '../../core/model.js'
import {
  ObjectSchema,
  UISchema,
  ExternalComponent as ExternalComponentOriginal,
  registerComponent,
  normalizeOptions,
  ExternalComponentHandler
} from '@sitecore/byoc'
import { ComponentModel, SDKCollection, getEmbedDefinition } from '../../index.js'
import { Form, FormModel } from './forms.js'
import { Context } from '../../style/context.js'
import { DatasourceModel } from '../datasources.js'
export type { ObjectSchema, UISchema } from '@sitecore/byoc'
export type ExternalComponent = ExternalComponentOriginal
export type EmbeddableComponent = ExternalComponent | ComponentModel

export class ExternalComponentModel extends SDKModel<ExternalComponent> implements ExternalComponent {
  name: string
  id: string
  schema: ObjectSchema
  title: string
  uiSchema: UISchema
  component: any
  thumbnail: string
  group: string
  isHidden: boolean
  datasourceIds: string[]
  links: Record<string, string>
  meta: Record<string, string>

  /** Get settings for all datasoruces used in component */
  getDataSettings() {
    return DatasourceModel.getSettingsFromDatasources(this.datasourceIds, this.sdk.datasources)
  }

  /** We consider that components that come from @sitecore/components package will have a name with the "Sitecore" prefix */
  isSitecoreComponent() {
    return !!this.name.startsWith('Sitecore')
  }

  getImportStatement() {
    if (this.meta?.importStatement) return this.meta?.importStatement
    else if (this.isSitecoreComponent())
      return this.links?.github
        ? `import @sitecore/components/${this.links.github.substring(this.links.github.lastIndexOf('/') + 1)}`
        : null
    else if (this.links?.npm) return `import ${this.links?.npm.replace('https://www.npmjs.com/package/', '')}`
    else return null
  }

  static getDefinition(context: Context) {
    return getEmbedDefinition(context)
  }

  static loadFromSessionStorage() {
    return JSON.parse(sessionStorage.getItem('feaas-external-components'))
  }
  static storeToSessionStorage(components: ExternalComponent[]) {
    if (typeof sessionStorage != 'undefined')
      sessionStorage.setItem('feaas-external-components', JSON.stringify(components))
  }
  static components: ExternalComponent[]
  static setComponents(components: ExternalComponent[]) {
    this.components = components
  }

  static forms: Form[]
  static setForms(forms: Form[]) {
    this.forms = forms
  }

  static updateComponents(
    collection: SDKCollection<typeof ExternalComponentModel>,
    expandedCollection: SDKCollection<typeof ExternalComponentModel>,
    expandedList = this.getExpandedComponents(),
    components: ExternalComponent[] = this.components || []
  ) {
    collection.setItems(components)
    expandedCollection.setItems(expandedList)
    this.storeToSessionStorage(expandedList)
    expandedList.map((c) => registerComponent(c.component as ExternalComponentHandler<any>, c))
  }

  // combine components & forms
  static isFormsEnabled = false
  static getExpandedComponents() {
    //   if (!this.components) return []
    var components = (this.components || []).filter((c) => !c.isHidden)
    if (this.forms) {
      ExternalComponentModel.isFormsEnabled ||= (this.components || []).some((c) => c.name == 'SitecoreForm')
      if (ExternalComponentModel.isFormsEnabled) {
        components = components
          .filter((c) => !ExternalComponentModel.isComponentForm(c))
          .concat(
            this.forms.map(
              (form) =>
                normalizeOptions(
                  {
                    ...form,
                    id: 'SitecoreForm?formId=' + form.id,
                    name: 'SitecoreForm',
                    title: form.name,
                    group: 'Forms',
                    isHidden: false
                  },
                  null
                ) as ExternalComponent
            )
          )
      }
    }
    return components
  }

  static isComponentForm(component: ExternalComponent) {
    return component && component.name == 'SitecoreForm'
  }

  static isExternalComponent(component: any): component is ExternalComponent {
    return component && 'schema' in component
  }
}