import { initializeWysiwyg } from '@iteria-app/wysiwyg/dist/index.esm.js'

import { addFrontendListeners } from './frontendListeners'
import { WindowMessaging } from './messaging'
import { DevWorkbench } from './workbench/Workbench'
import { FrontendActions } from './messaging/actions'
import { addElementHighlight } from './react-instrumentation/elementHighlight'

const messagingService = new WindowMessaging(window)
export const workbench = new DevWorkbench(messagingService)
export const frontendActions = new FrontendActions(messagingService)

interface IteriaProps {
  fsPort?: number
  graphQLEndpoint?: string
}

export const iteriaApp = (props?: IteriaProps) => {
  initializeWysiwyg()
  if (props.fsPort) workbench.setPort(props.fsPort)
  if (props.graphQLEndpoint) workbench.setGraphQLEndpoint(props.graphQLEndpoint)
  addFrontendListeners(messagingService)
  addElementHighlight(window)
}
