import { defineBackend } from '@vue-devtools/app-backend-api'
import { HookEvents, backendInjections } from '@vue-devtools/shared-utils'
import { ComponentWalker } from './components/tree'
import { editState, getCustomInstanceDetails, getCustomObjectDetails, getInstanceDetails } from './components/data'
import { getComponentInstances, getInstanceName } from './components/util'
import { getComponentInstanceFromElement, getInstanceOrVnodeRect, getRootElementsFromComponentInstance } from './components/el'

export const backend = defineBackend({
  frameworkVersion: 3,

  features: [],

  setup(api) {
    api.on.getAppRecordName((payload) => {
      if (payload.app._component) {
        payload.name = payload.app._component.name
      }
    })

    api.on.getAppRootInstance((payload) => {
      if (payload.app._instance) {
        payload.root = payload.app._instance
      }
      else if (payload.app._container?._vnode?.component) {
        payload.root = payload.app._container?._vnode?.component
      }
    })

    api.on.walkComponentTree(async (payload, ctx) => {
      const walker = new ComponentWalker(payload.maxDepth, payload.filter, payload.recursively, api, ctx)
      payload.componentTreeData = await walker.getComponentTree(payload.componentInstance)
    })

    api.on.walkComponentParents((payload, ctx) => {
      const walker = new ComponentWalker(0, null, false, api, ctx)
      payload.parentInstances = walker.getComponentParents(payload.componentInstance)
    })

    api.on.inspectComponent((payload, ctx) => {
      // @TODO refactor
      backendInjections.getCustomInstanceDetails = getCustomInstanceDetails
      backendInjections.getCustomObjectDetails = getCustomObjectDetails
      backendInjections.instanceMap = ctx.currentAppRecord.instanceMap
      backendInjections.isVueInstance = val => val._ && Object.keys(val._).includes('vnode')
      payload.instanceData = getInstanceDetails(payload.componentInstance, ctx)
    })

    api.on.getComponentName((payload) => {
      payload.name = getInstanceName(payload.componentInstance)
    })

    api.on.getComponentBounds((payload) => {
      payload.bounds = getInstanceOrVnodeRect(payload.componentInstance)
    })

    api.on.getElementComponent((payload) => {
      payload.componentInstance = getComponentInstanceFromElement(payload.element)
    })

    api.on.getComponentInstances((payload) => {
      payload.componentInstances = getComponentInstances(payload.app)
    })

    api.on.getComponentRootElements((payload) => {
      payload.rootElements = getRootElementsFromComponentInstance(payload.componentInstance)
    })

    api.on.editComponentState((payload, ctx) => {
      editState(payload, api.stateEditor, ctx)
    })

    api.on.getComponentDevtoolsOptions((payload) => {
      payload.options = payload.componentInstance.type.devtools
    })

    api.on.getComponentRenderCode((payload) => {
      payload.code = !(payload.componentInstance.type instanceof Function) ? payload.componentInstance.render.toString() : payload.componentInstance.type.toString()
    })

    api.on.transformCall((payload) => {
      if (payload.callName === HookEvents.COMPONENT_UPDATED) {
        const component = payload.inArgs[0]
        payload.outArgs = [
          component.appContext.app,
          component.uid,
          component.parent ? component.parent.uid : undefined,
          component,
        ]
      }
    })

    api.stateEditor.isRef = value => !!value?.__v_isRef
    api.stateEditor.getRefValue = ref => ref.value
    api.stateEditor.setRefValue = (ref, value) => {
      ref.value = value
    }
  },
})