From 8b515435cdb0644d0ca19e2c26ba3e744355bb0b Mon Sep 17 00:00:00 2001 From: Gao Sun Date: Fri, 5 Aug 2022 17:59:03 +0800 Subject: [PATCH] fix: build and types --- package.json | 7 +++ packages/console/package.json | 4 +- packages/console/src/assets/index.d.ts | 2 +- .../src/components/AppBoundary/index.tsx | 2 +- .../Sidebar/components/Contact/index.tsx | 4 +- .../console/src/components/Button/index.tsx | 2 +- .../src/components/CardTitle/index.tsx | 4 +- .../src/components/Dropdown/DropdownItem.tsx | 8 +-- .../src/components/FormField/index.tsx | 2 +- .../src/components/LinkButton/index.tsx | 2 +- .../src/components/RadioGroup/Radio.tsx | 4 +- .../console/src/components/Tooltip/index.tsx | 8 +-- .../console/src/hooks/use-user-preferences.ts | 2 +- .../mdx-components/DetailsSummary/index.tsx | 4 +- .../components/ConnectorTabs/index.tsx | 2 +- .../components/ConnectorName/index.tsx | 4 +- .../components/ConnectorRow/index.tsx | 2 +- .../components/CreateForm/index.tsx | 2 +- .../src/pages/Dashboard/components/Block.tsx | 2 +- .../console/src/pages/GetStarted/index.tsx | 4 +- packages/demo-app/src/App.tsx | 10 ++-- packages/integration-tests/package.json | 9 +--- packages/ui/src/assets/index.d.ts | 2 +- packages/ui/src/components/Button/index.tsx | 6 +-- packages/ui/src/components/Divider/index.tsx | 2 +- packages/ui/src/components/TextLink/index.tsx | 4 +- packages/ui/src/hooks/use-bind-social.ts | 2 +- packages/ui/src/pages/ErrorPage/index.tsx | 4 +- pnpm-lock.yaml | 54 +++++++++---------- 29 files changed, 82 insertions(+), 82 deletions(-) diff --git a/package.json b/package.json index 84684f0db..cdc8d0bc7 100644 --- a/package.json +++ b/package.json @@ -40,5 +40,12 @@ "html-parse-stringify": "html-parse-stringify/dist/html-parse-stringify.module.js", "react-hook-form": "react-hook-form/dist/index.esm.mjs", "superstruct": "superstruct/lib/index.es.js" + }, + "pnpm": { + "peerDependencyRules": { + "allowedVersions": { + "react": "^18.0.0" + } + } } } diff --git a/packages/console/package.json b/packages/console/package.json index 21de41b14..2a3f11d9a 100644 --- a/packages/console/package.json +++ b/packages/console/package.json @@ -23,7 +23,7 @@ "@logto/react": "^1.0.0-beta.0", "@logto/schemas": "^1.0.0-beta.3", "@logto/shared": "^1.0.0-beta.3", - "@mdx-js/react": "^2.1.2", + "@mdx-js/react": "^1.6.22", "@parcel/core": "2.6.2", "@parcel/transformer-mdx": "2.6.2", "@parcel/transformer-sass": "2.6.2", @@ -77,7 +77,7 @@ "recharts": "^2.1.13", "remark-gfm": "^3.0.1", "stylelint": "^14.9.1", - "swr": "^1.2.2", + "swr": "^1.3.0", "typescript": "^4.7.4", "zod": "^3.14.3" }, diff --git a/packages/console/src/assets/index.d.ts b/packages/console/src/assets/index.d.ts index 8ee74434a..128607d74 100644 --- a/packages/console/src/assets/index.d.ts +++ b/packages/console/src/assets/index.d.ts @@ -1,4 +1,4 @@ -interface SvgComponent extends React.StatelessComponent> {} +interface SvgComponent extends React.FunctionComponent> {} declare module '*.svg' { const value: SvgComponent; diff --git a/packages/console/src/components/AppBoundary/index.tsx b/packages/console/src/components/AppBoundary/index.tsx index 9e1fc7e0a..8a7109342 100644 --- a/packages/console/src/components/AppBoundary/index.tsx +++ b/packages/console/src/components/AppBoundary/index.tsx @@ -7,7 +7,7 @@ import initI18n from '@/i18n/init'; import * as styles from './index.module.scss'; type Props = { - children?: ReactNode; + children: ReactNode; }; const AppBoundary = ({ children }: Props) => { diff --git a/packages/console/src/components/AppContent/components/Sidebar/components/Contact/index.tsx b/packages/console/src/components/AppContent/components/Sidebar/components/Contact/index.tsx index 5904145c0..fbbc18fc0 100644 --- a/packages/console/src/components/AppContent/components/Sidebar/components/Contact/index.tsx +++ b/packages/console/src/components/AppContent/components/Sidebar/components/Contact/index.tsx @@ -31,8 +31,8 @@ const Contact = ({ isOpen, onCancel }: Props) => {
-
{t(title)}
-
{t(description)}
+
{String(t(title))}
+
{String(t(description))}
); }; diff --git a/packages/console/src/components/CardTitle/index.tsx b/packages/console/src/components/CardTitle/index.tsx index 686bdd117..e5c6fa7ea 100644 --- a/packages/console/src/components/CardTitle/index.tsx +++ b/packages/console/src/components/CardTitle/index.tsx @@ -20,10 +20,10 @@ const CardTitle = ({ title, subtitle, size = 'large' }: Props) => { return (
-
{typeof title === 'string' ? t(title) : title}
+
{typeof title === 'string' ? String(t(title)) : title}
{subtitle && (
- {typeof subtitle === 'string' ? t(subtitle) : subtitle} + {typeof subtitle === 'string' ? String(t(subtitle)) : subtitle}
)}
diff --git a/packages/console/src/components/Dropdown/DropdownItem.tsx b/packages/console/src/components/Dropdown/DropdownItem.tsx index 5dea0a9ec..85802f635 100644 --- a/packages/console/src/components/Dropdown/DropdownItem.tsx +++ b/packages/console/src/components/Dropdown/DropdownItem.tsx @@ -1,13 +1,13 @@ import classNames from 'classnames'; -import { MouseEvent } from 'react'; +import React, { MouseEvent, ReactNode } from 'react'; import * as styles from './DropdownItem.module.scss'; type Props = { onClick?: (event: MouseEvent) => void; className?: string; - children: React.ReactNode; - icon?: React.ReactNode; + children: ReactNode | Record; + icon?: ReactNode; iconClassName?: string; type?: 'default' | 'danger'; }; @@ -22,7 +22,7 @@ const DropdownItem = ({ }: Props) => (
  • {icon && {icon}} - {children} + {React.isValidElement(children) ? children : String(children)}
    • ); diff --git a/packages/console/src/components/FormField/index.tsx b/packages/console/src/components/FormField/index.tsx index f5f4c9965..377aacdf2 100644 --- a/packages/console/src/components/FormField/index.tsx +++ b/packages/console/src/components/FormField/index.tsx @@ -25,7 +25,7 @@ const FormField = ({ title, children, isRequired, className, tooltip }: Props) = return (
    -
    {typeof title === 'string' ? t(title) : title}
    +
    {typeof title === 'string' ? String(t(title)) : title}
    {tooltip && (
    diff --git a/packages/console/src/components/LinkButton/index.tsx b/packages/console/src/components/LinkButton/index.tsx index 3ab773a79..63f7a1765 100644 --- a/packages/console/src/components/LinkButton/index.tsx +++ b/packages/console/src/components/LinkButton/index.tsx @@ -20,7 +20,7 @@ const LinkButton = ({ to, title, icon, className }: Props) => { return ( {icon} - {typeof title === 'string' ? {t(title)} : title} + {typeof title === 'string' ? {String(t(title))} : title} ); }; diff --git a/packages/console/src/components/RadioGroup/Radio.tsx b/packages/console/src/components/RadioGroup/Radio.tsx index 8791c4d4f..0e7ac3c5f 100644 --- a/packages/console/src/components/RadioGroup/Radio.tsx +++ b/packages/console/src/components/RadioGroup/Radio.tsx @@ -76,9 +76,9 @@ const Radio = ({ {type === 'card' && } {children} {type === 'plain' &&
    } - {title && t(title)} + {title && String(t(title))} {isDisabled && disabledLabel && ( -
    {t(disabledLabel)}
    +
    {String(t(disabledLabel))}
    )}
    ); diff --git a/packages/console/src/components/Tooltip/index.tsx b/packages/console/src/components/Tooltip/index.tsx index 9268a60bf..efe848a0a 100644 --- a/packages/console/src/components/Tooltip/index.tsx +++ b/packages/console/src/components/Tooltip/index.tsx @@ -1,5 +1,5 @@ import classNames from 'classnames'; -import { ReactNode, RefObject, useEffect, useLayoutEffect, useRef, useState } from 'react'; +import React, { ReactNode, RefObject, useEffect, useLayoutEffect, useRef, useState } from 'react'; import { createPortal } from 'react-dom'; import usePosition, { HorizontalAlignment } from '@/hooks/use-position'; @@ -7,7 +7,7 @@ import usePosition, { HorizontalAlignment } from '@/hooks/use-position'; import * as styles from './index.module.scss'; type Props = { - content: ReactNode; + content: ReactNode | Record; anchorRef: RefObject; className?: string; isKeepOpen?: boolean; @@ -131,7 +131,9 @@ const Tooltip = ({ )} style={{ ...position }} > -
    {content}
    +
    + {React.isValidElement(content) ? content : String(content)} +
    , tooltipDom ); diff --git a/packages/console/src/hooks/use-user-preferences.ts b/packages/console/src/hooks/use-user-preferences.ts index d2b6b22d6..d30e5f388 100644 --- a/packages/console/src/hooks/use-user-preferences.ts +++ b/packages/console/src/hooks/use-user-preferences.ts @@ -70,7 +70,7 @@ const useUserPreferences = () => { return { isLoading: !data && !error, - isLoaded: data && !error, + isLoaded: Boolean(data && !error), data: userPreferences, update, error, diff --git a/packages/console/src/mdx-components/DetailsSummary/index.tsx b/packages/console/src/mdx-components/DetailsSummary/index.tsx index 3f6d853a4..a02bfeef5 100644 --- a/packages/console/src/mdx-components/DetailsSummary/index.tsx +++ b/packages/console/src/mdx-components/DetailsSummary/index.tsx @@ -7,11 +7,11 @@ import ArrowRight from '@/assets/images/triangle-right.svg'; import * as styles from './index.module.scss'; type Props = { - children: ReactNode[]; + children?: ReactNode[] | ReactNode; }; const DetailsSummary = ({ children }: Props) => { - const [summary, details] = children; + const [summary, details] = Array.isArray(children) ? children : [children]; const [isExpanded, setIsExpanded] = useState(false); const [height, setHeight] = useState(0); diff --git a/packages/console/src/pages/ConnectorDetails/components/ConnectorTabs/index.tsx b/packages/console/src/pages/ConnectorDetails/components/ConnectorTabs/index.tsx index d27b77c1f..17bf8f87c 100644 --- a/packages/console/src/pages/ConnectorDetails/components/ConnectorTabs/index.tsx +++ b/packages/console/src/pages/ConnectorDetails/components/ConnectorTabs/index.tsx @@ -48,7 +48,7 @@ const ConnectorTabs = ({ target, connectorId }: Props) => {
    )} - {connector.platform && t(connectorPlatformLabel[connector.platform])} + {connector.platform && String(t(connectorPlatformLabel[connector.platform]))} ))}
    diff --git a/packages/console/src/pages/Connectors/components/ConnectorName/index.tsx b/packages/console/src/pages/Connectors/components/ConnectorName/index.tsx index 5d34bf52e..c8004b707 100644 --- a/packages/console/src/pages/Connectors/components/ConnectorName/index.tsx +++ b/packages/console/src/pages/Connectors/components/ConnectorName/index.tsx @@ -34,7 +34,7 @@ const ConnectorName = ({ type, connectors, onClickSetup }: Props) => { -
    {t(connectorTitlePlaceHolder[type])}
    +
    {String(t(connectorTitlePlaceHolder[type]))}
    {type !== ConnectorType.Social && (
    diff --git a/packages/integration-tests/package.json b/packages/integration-tests/package.json index 11de84219..4ecef5664 100644 --- a/packages/integration-tests/package.json +++ b/packages/integration-tests/package.json @@ -37,12 +37,5 @@ "eslintConfig": { "extends": "@silverhand" }, - "prettier": "@silverhand/eslint-config/.prettierrc", - "pnpm": { - "peerDependencyRules": { - "allowedVersions": { - "@mdx-js/react": "2.1.2" - } - } - } + "prettier": "@silverhand/eslint-config/.prettierrc" } diff --git a/packages/ui/src/assets/index.d.ts b/packages/ui/src/assets/index.d.ts index bdd1a8ac3..ac35ba68b 100644 --- a/packages/ui/src/assets/index.d.ts +++ b/packages/ui/src/assets/index.d.ts @@ -1,4 +1,4 @@ -interface SvgComponent extends React.StatelessComponent> {} +interface SvgComponent extends React.FunctionComponent> {} declare module '@/assets/icons/*.svg' { const value: SvgComponent; diff --git a/packages/ui/src/components/Button/index.tsx b/packages/ui/src/components/Button/index.tsx index 6e5a8d42b..a565b48aa 100644 --- a/packages/ui/src/components/Button/index.tsx +++ b/packages/ui/src/components/Button/index.tsx @@ -1,5 +1,5 @@ import classNames from 'classnames'; -import { ReactNode } from 'react'; +import React, { ReactNode } from 'react'; import * as styles from './index.module.scss'; @@ -7,7 +7,7 @@ export type Props = { htmlType?: 'button' | 'submit' | 'reset'; isDisabled?: boolean; className?: string; - children: ReactNode; + children: ReactNode | Record; type?: 'primary' | 'secondary' | 'outline'; size?: 'small' | 'large'; onClick?: React.MouseEventHandler; @@ -34,7 +34,7 @@ const Button = ({ type={htmlType} onClick={onClick} > - {children} + {React.isValidElement(children) ? children : String(children)} ); diff --git a/packages/ui/src/components/Divider/index.tsx b/packages/ui/src/components/Divider/index.tsx index 7964bb498..3df19c15e 100644 --- a/packages/ui/src/components/Divider/index.tsx +++ b/packages/ui/src/components/Divider/index.tsx @@ -14,7 +14,7 @@ const Divider = ({ className, label }: Props) => { return (
    - {label && t(label)} + {label && String(t(label))}
    ); diff --git a/packages/ui/src/components/TextLink/index.tsx b/packages/ui/src/components/TextLink/index.tsx index 8e10648f6..9f7b6fa17 100644 --- a/packages/ui/src/components/TextLink/index.tsx +++ b/packages/ui/src/components/TextLink/index.tsx @@ -19,14 +19,14 @@ const TextLink = ({ className, children, text, type = 'primary', to, ...rest }: if (to) { return ( - {children ?? (text ? t(text) : '')} + {children ?? (text ? String(t(text)) : '')} ); } return ( - {children ?? (text ? t(text) : '')} + {children ?? (text ? String(t(text)) : '')} ); }; diff --git a/packages/ui/src/hooks/use-bind-social.ts b/packages/ui/src/hooks/use-bind-social.ts index 138820b0a..f18f603cc 100644 --- a/packages/ui/src/hooks/use-bind-social.ts +++ b/packages/ui/src/hooks/use-bind-social.ts @@ -23,7 +23,7 @@ const useBindSocial = () => { ); const bindRelatedUserHandler = useCallback( - (connectorId) => { + (connectorId: string) => { void asyncBindSocialRelatedUser(connectorId); }, [asyncBindSocialRelatedUser] diff --git a/packages/ui/src/pages/ErrorPage/index.tsx b/packages/ui/src/pages/ErrorPage/index.tsx index 45d28692e..fcda12f8c 100644 --- a/packages/ui/src/pages/ErrorPage/index.tsx +++ b/packages/ui/src/pages/ErrorPage/index.tsx @@ -24,8 +24,8 @@ const ErrorPage = ({ title = 'description.not_found', message, rawMessage }: Pro
    -
    {t(title)}
    - {errorMessage &&
    {errorMessage}
    } +
    {String(t(title))}
    + {errorMessage &&
    {String(errorMessage)}
    }