// Import Libs and Handlers
import * as React from 'react'
import { get } from 'lodash'
import { app } from '../../app/global-api' // 取对应子包app
const $app = new Proxy({}, { get: function(obj, prop){ return app[prop] }});
import PageLifeCycle from '../../lowcode/<%= pageName %>/lifecycle'
import initPageState from '../../lowcode/<%= pageName %>/state'
import computed from '../../lowcode/<%= pageName %>/computed'
// import pageAPI from '../../lowcode/<%= pageName %>/index';
import { $$_<%= pageName %> as handler } from '../../app/handlers'
import { $page } from './api'
import { PageRender } from '@cloudbase/lowcode-render'
import '../../lowcode/<%= pageName %>/style.css'

// Import dependencies entry
<%= entryImports %>

// Import Components
<%= componentImports %>

// Import Actions
<%= actionImports %>

const virtualFields = {
  <% useComponents.forEach(compItem => {%>
  '<%= compItem.materialName %>:<%= compItem.name %>': React.forwardRef((props,ref) => <<%= upperFirst(compItem.variableName) %> {...resolveComponentProps(props,  <%= compItem.isPlainProps? 1:0 %>)} pageVirtualFields={virtualFields} ref={ref}/>),
  <% }) %>
};

// Init
export default function App({
  cals,
  pageId,
  componentsMap,
}) {
  // 检查权限
  const page = cals.items.find((item) => item.id === pageId);

  const [lowcodeLoaded, setLowcodeLoaded] = React.useState(true);

  /*
  <style
    type="text/css"
    dangerouslySetInnerHTML={{
      __html: `<%= pageStyleText %>`,
    }}
  />
  */

  return lowcodeLoaded ? (
    <PageRender
      page={page as any}
      generateActionsMap={() => ({})}
      generateComponentsMap={() => {
        return virtualFields;
      }}
      generateLowcodeModule={() => {
        return {
          state: initPageState,
          computed: computed,
          lifecycle: PageLifeCycle,
          handler: handler,
          style: [],
        };
      }}
      generateContext={(ctx, page) => {
        const widgets = <%= widgets %>;
        const dataBinds = <%= dataBinds %>;
        const componentSchema = <%= componentSchema %>;

        return {
          widgetContext: widgets,
          componentSchema,
          dataBinds,
        };
      }}
      injectContext={{
        $page,
      }}
    />
  ) : null;
}