From 8d580b72b2e8ec3f59437bcb6c4ddf3b455e91bd Mon Sep 17 00:00:00 2001 From: sealday Date: Mon, 18 Mar 2024 10:48:28 +0800 Subject: [PATCH] refactor: remove error-fallback and __builtins__ from plugin-core --- .../__builtins__/hooks/index.ts | 3 - .../__builtins__/hooks/useConfig.ts | 5 - .../__builtins__/hooks/usePrefixCls.ts | 17 --- .../__builtins__/hooks/useToken.ts | 13 -- .../schema-components/__builtins__/index.ts | 4 - .../schema-components/__builtins__/loading.ts | 14 -- .../schema-components/__builtins__/portal.tsx | 63 --------- .../schema-components/__builtins__/render.ts | 89 ------------ .../schema-components/__builtins__/style.ts | 130 ------------------ .../error-fallback/ErrorFallback.tsx | 45 ------ .../__tests__/error-fallback.test.tsx | 18 --- .../error-fallback/demos/demo1.tsx | 15 -- .../schema-components/error-fallback/index.md | 10 -- .../schema-components/error-fallback/index.ts | 1 - 14 files changed, 427 deletions(-) delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/index.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useConfig.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/usePrefixCls.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useToken.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/index.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/loading.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/portal.tsx delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/render.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/style.ts delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/ErrorFallback.tsx delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/__tests__/error-fallback.test.tsx delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/demos/demo1.tsx delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.md delete mode 100644 packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.ts diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/index.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/index.ts deleted file mode 100644 index 4d423984a..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -export * from './useConfig'; -export * from './usePrefixCls'; -export * from './useToken'; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useConfig.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useConfig.ts deleted file mode 100644 index b9d05bd59..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useConfig.ts +++ /dev/null @@ -1,5 +0,0 @@ -import { ConfigProvider } from 'antd'; -import { useContext } from 'react'; - -const { ConfigContext } = ConfigProvider; -export const useConfig = () => useContext(ConfigContext); diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/usePrefixCls.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/usePrefixCls.ts deleted file mode 100644 index ca782364c..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/usePrefixCls.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { ConfigProvider } from 'antd'; -import { useContext } from 'react'; - -export const usePrefixCls = ( - tag?: string, - props?: { - prefixCls?: string; - }, -) => { - const { getPrefixCls } = useContext(ConfigProvider.ConfigContext) || {}; - if ('ConfigContext' in ConfigProvider) { - return getPrefixCls?.(tag, props?.prefixCls) || ''; - } else { - const prefix = props?.prefixCls ?? 'ant-'; - return `${prefix}${tag ?? ''}`; - } -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useToken.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useToken.ts deleted file mode 100644 index f4ff65445..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/hooks/useToken.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { theme } from 'antd'; -import { CustomToken } from '../style'; - -interface Result extends ReturnType { - token: CustomToken; -} - -const useToken = () => { - const result = theme.useToken(); - return result as Result; -}; - -export { useToken }; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/index.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/index.ts deleted file mode 100644 index d76631860..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export * from './hooks'; -export * from './loading'; -export * from './portal'; -export * from './style'; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/loading.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/loading.ts deleted file mode 100644 index 3746651f0..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/loading.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { message } from 'antd'; - -export const loading = async (title: React.ReactNode = 'Loading...', processor: () => Promise) => { - let hide: any = null; - const loading = setTimeout(() => { - hide = message.loading(title); - }, 100); - try { - return await processor(); - } finally { - hide?.(); - clearTimeout(loading); - } -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/portal.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/portal.tsx deleted file mode 100644 index fb060dcbd..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/portal.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { Observer, ReactFC } from '@formily/react'; -import { observable } from '@formily/reactive'; -import React, { Fragment } from 'react'; -import { createPortal } from 'react-dom'; -import { render as reactRender, unmount as reactUnmount } from './render'; -export interface IPortalProps { - id?: string | symbol; -} - -const PortalMap = observable(new Map()); - -export const createPortalProvider = (id: string | symbol) => { - const Portal: ReactFC = (props) => { - if (props.id && !PortalMap.has(props.id)) { - PortalMap.set(props.id, null); - } - - return ( - - {props.children} - - {() => { - if (!props.id) return <>; - const portal = PortalMap.get(props.id); - if (portal) return createPortal(portal, document.body); - return <>; - }} - - - ); - }; - Portal.defaultProps = { - id, - }; - return Portal; -}; - -export function createPortalRoot(host: HTMLElement, id: string) { - function render(renderer?: () => T) { - if (PortalMap.has(id)) { - PortalMap.set(id, renderer?.()); - } else if (host) { - reactRender({renderer?.()}, host); - } - } - - function unmount() { - if (PortalMap.has(id)) { - PortalMap.set(id, null); - } - if (host) { - const unmountResult = reactUnmount(host); - if (unmountResult && host.parentNode) { - host.parentNode?.removeChild(host); - } - } - } - - return { - render, - unmount, - }; -} diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/render.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/render.ts deleted file mode 100644 index f1e04482f..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/render.ts +++ /dev/null @@ -1,89 +0,0 @@ -import { ReactElement } from 'react'; -import * as ReactDOM from 'react-dom'; -import type { Root } from 'react-dom/client'; - -// 移植自rc-util: https://github.com/react-component/util/blob/master/src/React/render.ts - -type CreateRoot = (container: ContainerType) => Root; - -// Let compiler not to search module usage -const fullClone = { - ...ReactDOM, -} as typeof ReactDOM & { - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED?: { - usingClientEntryPoint?: boolean; - }; - createRoot?: CreateRoot; -}; - -const { version, render: reactRender, unmountComponentAtNode } = fullClone; - -let createRoot: CreateRoot; -try { - const mainVersion = Number((version || '').split('.')[0]); - if (mainVersion >= 18 && fullClone.createRoot) { - // eslint-disable-next-line @typescript-eslint/no-var-requires - createRoot = fullClone.createRoot; - } -} catch (e) { - // Do nothing; -} - -function toggleWarning(skip: boolean) { - const { __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED } = fullClone; - - if ( - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED && - typeof __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED === 'object' - ) { - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.usingClientEntryPoint = skip; - } -} - -const MARK = '__antd_mobile_root__'; - -// ========================== Render ========================== -type ContainerType = (Element | DocumentFragment) & { - [MARK]?: Root; -}; - -function legacyRender(node: ReactElement, container: ContainerType) { - reactRender(node, container); -} - -function concurrentRender(node: ReactElement, container: ContainerType) { - toggleWarning(true); - const root = container[MARK] || createRoot(container); - toggleWarning(false); - root.render(node); - container[MARK] = root; -} - -export function render(node: ReactElement, container: ContainerType) { - if (createRoot as unknown) { - concurrentRender(node, container); - return; - } - legacyRender(node, container); -} - -// ========================== Unmount ========================= -function legacyUnmount(container: ContainerType) { - return unmountComponentAtNode(container); -} - -async function concurrentUnmount(container: ContainerType) { - // Delay to unmount to avoid React 18 sync warning - return Promise.resolve().then(() => { - container[MARK]?.unmount(); - delete container[MARK]; - }); -} - -export function unmount(container: ContainerType) { - if (createRoot as unknown) { - return concurrentUnmount(container); - } - - return legacyUnmount(container); -} diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/style.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/style.ts deleted file mode 100644 index 334074572..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/__builtins__/style.ts +++ /dev/null @@ -1,130 +0,0 @@ -import type { CSSInterpolation, CSSObject } from '@ant-design/cssinjs'; -import { useStyleRegister } from '@ant-design/cssinjs'; -import { merge } from '@formily/shared'; -import type { ComponentTokenMap, GlobalToken } from 'antd/es/theme/interface'; -import { AliasToken } from 'antd/es/theme/internal'; -import { useConfig, usePrefixCls, useToken } from './hooks'; - -export interface CustomToken extends AliasToken { - /** 顶部导航栏主色 */ - colorPrimaryHeader: string; - /** 导航栏背景色 */ - colorBgHeader: string; - /** 导航栏菜单背景色悬浮态 */ - colorBgHeaderMenuHover: string; - /** 导航栏菜单背景色激活态 */ - colorBgHeaderMenuActive: string; - /** 导航栏菜单文本色 */ - colorTextHeaderMenu: string; - /** 导航栏菜单文本色悬浮态 */ - colorTextHeaderMenuHover: string; - /** 导航栏菜单文本色激活态 */ - colorTextHeaderMenuActive: string; - - /** UI 配置色 */ - colorSettings: string; - /** 鼠标悬浮时显示的背景色 */ - colorBgSettingsHover: string; - /** 鼠标悬浮时显示的边框色 */ - colorBorderSettingsHover: string; -} - -export type OverrideComponent = keyof ComponentTokenMap | string; - -export interface StyleInfo { - hashId: string; - prefixCls: string; - rootPrefixCls: string; - iconPrefixCls: string; -} - -export type TokenWithCommonCls = T & { - /** Wrap component class with `.` prefix */ - componentCls: string; - /** Origin prefix which do not have `.` prefix */ - prefixCls: string; - /** Wrap icon class with `.` prefix */ - iconCls: string; - /** Wrap ant prefixCls class with `.` prefix */ - antCls: string; -}; - -export type GenerateStyle< - ComponentToken extends object = TokenWithCommonCls, - ReturnType = CSSInterpolation, -> = (token: ComponentToken, options?: any) => ReturnType; - -export const genCommonStyle = (token: any, componentPrefixCls: string): CSSObject => { - const { fontFamily, fontSize } = token; - - const rootPrefixSelector = `[class^="${componentPrefixCls}"], [class*=" ${componentPrefixCls}"]`; - - return { - [rootPrefixSelector]: { - fontFamily, - fontSize, - boxSizing: 'border-box', - - '&::before, &::after': { - boxSizing: 'border-box', - }, - - [rootPrefixSelector]: { - boxSizing: 'border-box', - - '&::before, &::after': { - boxSizing: 'border-box', - }, - }, - }, - }; -}; -export type UseComponentStyleResult = { - wrapSSR: ReturnType; - hashId: string; - componentCls: string; - rootPrefixCls: string; -}; - -export const genStyleHook = ( - component: ComponentName, - styleFn: (token: TokenWithCommonCls, props: any, info: StyleInfo) => CSSInterpolation, -) => { - return (props?: any): UseComponentStyleResult => { - const { theme, token, hashId } = useToken(); - const { getPrefixCls, iconPrefixCls } = useConfig(); - const prefixCls = usePrefixCls(component); - const rootPrefixCls = getPrefixCls(); - - return { - wrapSSR: useStyleRegister( - { - theme: theme as any, - token, - hashId, - path: ['formily-antd', component, prefixCls, iconPrefixCls], - }, - () => { - const componentCls = `.${prefixCls}`; - const mergedToken: TokenWithCommonCls = merge(token, { - componentCls, - prefixCls, - iconCls: `.${iconPrefixCls}`, - antCls: `.${rootPrefixCls}`, - }); - - const styleInterpolation = styleFn(mergedToken, props, { - hashId, - prefixCls, - rootPrefixCls, - iconPrefixCls, - }); - return [genCommonStyle(token, prefixCls), styleInterpolation]; - }, - ), - hashId, - componentCls: prefixCls, - rootPrefixCls, - }; - }; -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/ErrorFallback.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/ErrorFallback.tsx deleted file mode 100644 index 995d6e843..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/ErrorFallback.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import { Button, Result, Typography } from 'antd'; -import React, { FC } from 'react'; -import { FallbackProps, useErrorBoundary } from 'react-error-boundary'; -import { Trans, useTranslation } from 'react-i18next'; - -const { Paragraph, Text, Link } = Typography; - -export const ErrorFallback: FC = ({ error }) => { - const { resetBoundary } = useErrorBoundary(); - const { t } = useTranslation(); - - const subTitle = ( - - {'This is likely a NocoBase internals bug. Please open an issue at '} - - here - - - ); - - return ( -
- - {t('Feedback')} - , - , - ]} - > - - - {error.stack} - - - -
- ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/__tests__/error-fallback.test.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/__tests__/error-fallback.test.tsx deleted file mode 100644 index d03184e79..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/__tests__/error-fallback.test.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; -import { render, screen } from 'testUtils'; -import App1 from '../demos/demo1'; - -describe('ErrorFallback', () => { - it('should render correctly', () => { - render(); - - expect(screen.getByText(/render failed/i)).toBeInTheDocument(); - expect(screen.getByText(/this is likely a nocobase internals bug\. please open an issue at/i)).toBeInTheDocument(); - expect(screen.getByRole('link', { name: /feedback/i })).toBeInTheDocument(); - expect(screen.getByText(/try again/i)).toBeInTheDocument(); - expect(screen.getByText(/error: error message/i)).toBeInTheDocument(); - - // 底部复制按钮 - expect(document.querySelector('.ant-typography-copy')).toBeInTheDocument(); - }); -}); diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/demos/demo1.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/demos/demo1.tsx deleted file mode 100644 index 183fcae57..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/demos/demo1.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import { ErrorBoundary } from 'react-error-boundary'; -import { ErrorFallback } from '../ErrorFallback'; - -const App = () => { - throw new Error('error message'); -}; - -export default () => { - return ( - - - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.md b/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.md deleted file mode 100644 index 3e6f1cdc6..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -group: - title: Schema Components ---- - -# ErrorFallback - -## Example - - diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.ts b/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.ts deleted file mode 100644 index 12bb8db1b..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/error-fallback/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './ErrorFallback';