import '@material/web/icon/icon.js'
import '@operato/i18n/ox-i18n.js'
import '@operato/attribute/grist-editor' /* for register data-grist editor type 'attributes' */

import { html } from 'lit-html'

import { navigate, store } from '@operato/shell'
import { TOOL_POSITION } from '@operato/layout'
import { OxGristEditorPrivilege } from '@operato/app/grist-editor/ox-grist-editor-privilege.js'
import {
  registerEditor as registerGristEditor,
  registerRenderer as registerGristRenderer,
  OxGristRendererJson5
} from '@operato/data-grist'

import { auth } from '@things-factory/auth-base/dist-client/auth.js'
import { ADD_MORENDA } from '@things-factory/more-base/client'

export default async function bootstrap() {
  registerGristEditor('privilege', OxGristEditorPrivilege)
  registerGristRenderer('privilege', OxGristRendererJson5)

  /* add user profile morenda */
  store.dispatch({
    type: ADD_MORENDA,
    morenda: {
      icon: html` <md-icon>account_circle</md-icon> `,
      name: html` <ox-i18n msgid="text.auth profile"></ox-i18n> `,
      position: TOOL_POSITION.FRONT_END,
      action: () => {
        navigate('profile')
      }
    }
  })

  /* add sign-out morenda */
  store.dispatch({
    type: ADD_MORENDA,
    morenda: {
      icon: html` <md-icon>exit_to_app</md-icon> `,
      name: html` <ox-i18n msgid="field.sign out"></ox-i18n> `,
      position: TOOL_POSITION.FRONT_END,
      action: () => {
        auth.signout()
      }
    }
  })

  /* 
    Get user profile information from server. 
    As soon as response received, auth.on('profile', ...) handlers start to work.
    It's very important point to build UI for the user.
  */
  await auth.profile()
}
