feat: add registerable icon component

packages/app/src/components/icons/index.tsx

@@ -0,0 +1,55 @@
+import React from 'react';
+import {
+  createFromIconfontCN,
+  UserOutlined,
+  TeamOutlined,
+  DatabaseOutlined,
+  DashboardOutlined,
+  SettingOutlined,
+  TableOutlined,
+  MenuOutlined,
+} from '@ant-design/icons';
+
+const IconFont = createFromIconfontCN({
+  scriptUrl: [
+    '//at.alicdn.com/t/font_2261954_u9jzwc44ug.js',
+  ],
+});
+
+const icons = new Map<string, any>();
+
+export function registerIcon(type: string, icon) {
+  icons.set(type.toLowerCase(), icon);
+}
+
+export function registerIcons(components) {
+  Object.keys(components).forEach(type => {
+    registerIcon(type, components[type]);
+  });
+}
+
+registerIcons({
+  MenuOutlined,
+  TableOutlined,
+  SettingOutlined,
+  TeamOutlined,
+  UserOutlined,
+  DatabaseOutlined,
+  DashboardOutlined,
+});
+
+interface IconProps {
+  type: string;
+  [key: string]: any;
+}
+
+export function Icon(props: IconProps) {
+  const { type = '', ...restProps } = props;
+  if (type && icons.has(type.toLowerCase())) {
+    const IconComponent = icons.get(type.toLowerCase());
+    return <IconComponent {...restProps}/>;
+  }
+  return <IconFont type={type} />;
+}
+
+export default Icon;

packages/app/src/components/pages/SideMenuLayout/index.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Layout, Menu, Breadcrumb } from 'antd';
 import { Link } from 'umi';
 import './style.less';
+import Icon from '@/components/icons';
 
 export function SideMenuLayout(props: any) {
   const { menu = [] } = props.page;
@@ -12,7 +13,7 @@ export function SideMenuLayout(props: any) {
         <Menu mode={'inline'}  defaultSelectedKeys={['2']}>
           {menu.map(item => (
             <Menu.Item key={item.path}>
-              <Link to={item.path}>{item.title}</Link>
+              <Link to={item.path}><Icon type={item.icon}/> {item.title}</Link>
             </Menu.Item>
           ))}
         </Menu>

packages/app/src/components/pages/TopMenuLayout/index.tsx

@@ -3,6 +3,7 @@ import { Layout, Menu, Dropdown, Avatar } from 'antd';
 import './style.less';
 import { history, Link, request, useModel } from 'umi';
 import { UserOutlined } from '@ant-design/icons';
+import Icon from '@/components/icons';
 
 const overlay = (
   <Menu>
@@ -28,7 +29,7 @@ export function TopMenuLayout(props: any) {
         <Menu style={{float: 'left'}} theme="dark" mode="horizontal" defaultSelectedKeys={['2']}>
           {menu.map(item => (
             <Menu.Item key={item.path}>
-              <Link to={item.path}>{item.title}</Link>
+              <Link to={item.path}><Icon type={item.icon}/>{item.title}</Link>
             </Menu.Item>
           ))}
         </Menu>

packages/plugin-pages/src/server.ts

@@ -22,9 +22,9 @@ export default async function (options = {}) {
   const [Collection, Page] = database.getModels(['collections', 'pages']);
 
   async function createCollectionPage(model) {
-    if (!model.get('showInDataMenu')) {
+    // if (!model.get('showInDataMenu')) {
-      return;
+    //   return;
-    }
+    // }
     const parent = await Page.findOne({
       where: {
         path: '/collections',
@@ -48,7 +48,7 @@ export default async function (options = {}) {
     page.set({
       title: model.get('title'),
       icon: model.get('icon'),
-      showInMenu: model.get('showInDataMenu'),
+      showInMenu: !!model.get('showInDataMenu'),
     });
     page.save();
   }