Steve/v3-prepear-react-19

package.json

@@ -40,9 +40,6 @@
     "@babel/core": "^7.25.2",
     "@babel/types": "^7.25.6",
     "@cypress/browserify-preprocessor": "^3.0.2",
-    "@next-core/brick-container": "*",
-    "@next-core/brick-playground": "*",
-    "@next-core/test-next": "*",
     "@types/doctrine": "^0.0.9",
     "@types/fs-extra": "^9.0.13",
     "@types/history": "^4.7.11",

packages/i18n/package.json

@@ -43,11 +43,19 @@
     "@next-core/types": "^1.14.0",
     "@next-core/utils": "^1.7.28",
     "i18next": "^22.5.1",
-    "i18next-browser-languagedetector": "^7.2.1",
-    "react-i18next": "^12.3.1"
+    "i18next-browser-languagedetector": "^7.2.1"
   },
   "devDependencies": {
     "@next-core/build-next-libs": "^1.0.22",
-    "@next-core/test-next": "^1.1.7"
+    "@next-core/test-next": "^1.1.7",
+    "react-i18next": "^12.3.1"
+  },
+  "peerDependencies": {
+    "react-i18next": "^12.3.1"
+  },
+  "peerDependenciesMeta": {
+    "react-i18next": {
+      "optional": true
+    }
   }
 }

packages/react-runtime/package.json

@@ -47,8 +47,6 @@
   "devDependencies": {
     "@next-core/build-next-libs": "^1.0.22",
     "@next-core/test-next": "^1.1.7",
-    "@testing-library/react": "^16.0.1",
-    "@testing-library/react-hooks": "^8.0.1",
     "jest-fetch-mock": "^3.0.3"
   }
 }

packages/react-runtime/src/useProvider/useProvider.spec.tsx

@@ -1,8 +1,7 @@
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook, act } from "@testing-library/react";
 import { FetchMock, GlobalWithFetchMock } from "jest-fetch-mock";
 import React, { Suspense } from "react";
 import "@testing-library/jest-dom";
-import { act } from "react-dom/test-utils";
 import * as fetchProvider from "./fetch.js";
 import { useProvider } from "./useProvider.js";
 import { fireEvent, render, waitFor } from "@testing-library/react";
@@ -33,18 +32,18 @@ describe("useProvider Hook", () => {
   });
 
   it("should fetch provider with object destructuring", async (): Promise<void> => {
-    const { result, waitForNextUpdate } = renderHook(() =>
-      useProvider("easyops.custom_api@test")
-    );
-    result.current.query([]);
+    const { result } = renderHook(() => useProvider("easyops.custom_api@test"));
+    act(() => {
+      result.current.query([]);
+    });
     expect(result.current.data).toBeUndefined();
     expect(result.current.loading).toBe(true);
     expect(result.current.error).toBeUndefined();
     expect(result.current.request.data).toBe(undefined);
     expect(result.current.response).toEqual(undefined);
 
     await act(async () => {
-      await waitForNextUpdate();
+      await (global as any).flushPromises();
     });
 
     expect(result.current.data).toStrictEqual(expected);
@@ -68,7 +67,7 @@ describe("useProvider Hook", () => {
           ]);
 
           onChange(data);
-        } catch (e) {
+        } catch {
           // Do nothing...
         }
       };
@@ -115,7 +114,7 @@ describe("Error handing", () => {
   });
 
   it("should handing error", async (): Promise<void> => {
-    const { result, waitForNextUpdate } = renderHook(() =>
+    const { result } = renderHook(() =>
       useProvider(
         "easyops.custom_api@test",
         {
@@ -133,7 +132,7 @@ describe("Error handing", () => {
     expect(result.current.request.loading).toBe(true);
 
     await act(async () => {
-      await waitForNextUpdate();
+      await (global as any).flushPromises();
     });
 
     expect(onError).toBeCalled();

packages/react-runtime/src/useProvider/useProviderArgs.spec.ts

@@ -1,4 +1,4 @@
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react";
 import useProviderArgs from "./useProviderArgs.js";
 import { useProviderArgsDefaults } from "./useProviderArgsDefaults.js";
 

packages/test-next/package.json

@@ -35,7 +35,7 @@
     "@babel/core": "^7.25.2",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.5.0",
-    "@testing-library/react": "^16.0.1",
+    "@testing-library/react": "^16.1.0",
     "babel-jest": "^29.7.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",

packages/test-next/src/transforms/file.js

@@ -5,30 +5,29 @@ import { pascalCase } from "pascal-case";
 // https://github.com/facebook/create-react-app/blob/d960b9e38c062584ff6cfb1a70e1512509a966e7/packages/react-scripts/config/jest/fileTransform.js
 export default {
   /**
-   * @param {string} src
+   * @param {string} _src
    * @param {string} filename
    */
-  process(src, filename) {
+  process(_src, filename) {
     const assetFilename = JSON.stringify(path.basename(filename));
     if (filename.endsWith(".svg")) {
       const pascalCaseFilename = pascalCase(path.parse(filename).name);
       const componentName = `Svg${pascalCaseFilename}`;
       return {
-        code: `const React = require('react');
-          module.exports = {
-          __esModule: true,
-          default: React.forwardRef(function ${componentName}(props, ref) {
-            return {
-              $$typeof: Symbol.for('react.element'),
-              type: 'svg',
-              ref: ref,
-              key: null,
-              props: Object.assign({}, props, {
-                children: ${assetFilename}
-              })
-            };
-          }),
-        };`,
+        code: `"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+var _default = exports.default = /*#__PURE__*/_react.default.forwardRef(function ${componentName}(props, ref) {
+  return /*#__PURE__*/_react.default.createElement("svg", _extends({}, props, {
+    ref: ref
+  }), ${assetFilename});
+});`,
       };
     }
     return {

packages/yo/src/templates/brick/i18n.ts

@@ -1,3 +1,5 @@
+import { i18n } from "@next-core/i18n";
+
 export enum K {}
 // HELLO = "HELLO",
 
@@ -13,6 +15,8 @@ export const NS = "bricks/{{pkgName}}/{{>lastTagName}}";
 
 export const locales = { en, zh };
 
+export const t = i18n.getFixedT(null, NS);
+
 type Locale = { [k in K]: string } & {
   [k in K as `${k}_plural`]?: string;
 };

packages/yo/src/templates/brick/index.tsx.hbs

@@ -3,13 +3,13 @@ import { createDecorators } from "@next-core/element";
 import { ReactNextElement } from "@next-core/react-element";
 import "@next-core/theme";
 {{#if useI18n}}
-import { useTranslation, initializeReactI18n } from "@next-core/i18n/react";
-import { K, NS, locales } from "./i18n.js";
+import { initializeI18n } from "@next-core/i18n";
+import { K, NS, locales, t } from "./i18n.js";
 {{/if}}
 import styleText from "./styles.shadow.css";
 
 {{#if useI18n}}
-initializeReactI18n(NS, locales);
+initializeI18n(NS, locales);
 
 {{/if}}
 const { defineElement, property } = createDecorators();
@@ -39,7 +39,6 @@ export interface {{>className}}ComponentProps extends {{>className}}Props {
 
 export function {{>className}}Component(props: {{>className}}ComponentProps) {
 {{#if useI18n}}
-  const { t } = useTranslation(NS);
   const hello = t(K.HELLO);
   return <div>{hello} world!</div>;
 {{else}}

yarn.lock

@@ -2658,18 +2658,10 @@
     lodash "^4.17.21"
     redent "^3.0.0"
 
-"@testing-library/react-hooks@^8.0.1":
-  version "8.0.1"
-  resolved "https://registry.npmmirror.com/@testing-library/react-hooks/-/react-hooks-8.0.1.tgz#0924bbd5b55e0c0c0502d1754657ada66947ca12"
-  integrity sha512-Aqhl2IVmLt8IovEVarNDFuJDVWVvhnr9/GCU6UUnrYXwgDFF9h2L2o2P9KBni1AST5sT6riAyoukFLyjQUgD/g==
-  dependencies:
-    "@babel/runtime" "^7.12.5"
-    react-error-boundary "^3.1.0"
-
-"@testing-library/react@^16.0.1":
-  version "16.0.1"
-  resolved "https://registry.npmjs.org/@testing-library/react/-/react-16.0.1.tgz#29c0ee878d672703f5e7579f239005e4e0faa875"
-  integrity sha512-dSmwJVtJXmku+iocRhWOUFbrERC76TX2Mnf0ATODz8brzAZrMBbzLwQixlBSanZxR6LddK3eiwpSFZgDET1URg==
+"@testing-library/react@^16.1.0":
+  version "16.1.0"
+  resolved "https://registry.npmjs.org/@testing-library/react/-/react-16.1.0.tgz#aa0c61398bac82eaf89776967e97de41ac742d71"
+  integrity sha512-Q2ToPvg0KsVL0ohND9A3zLJWcOXXcO8IDu3fj11KhNt0UlCWyFyvnCIBkd12tidB2lkiVRG8VFqdhcqhqnAQtg==
   dependencies:
     "@babel/runtime" "^7.12.5"
 
@@ -11521,13 +11513,6 @@ [email protected]:
     loose-envify "^1.1.0"
     scheduler "0.0.0-experimental-ee8509801-20230117"
 
-react-error-boundary@^3.1.0:
-  version "3.1.4"
-  resolved "https://registry.npmmirror.com/react-error-boundary/-/react-error-boundary-3.1.4.tgz#255db92b23197108757a888b01e5b729919abde0"
-  integrity sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==
-  dependencies:
-    "@babel/runtime" "^7.12.5"
-
 react-i18next@^12.3.1:
   version "12.3.1"
   resolved "https://registry.npmjs.org/react-i18next/-/react-i18next-12.3.1.tgz#30134a41a2a71c61dc69c6383504929aed1c99e7"