Skip to content

[MOO-2205] Update RN version to 0.78.2#160

Open
NikolaSimsic wants to merge 4 commits intomendix:masterfrom
NikolaSimsic:master
Open

[MOO-2205] Update RN version to 0.78.2#160
NikolaSimsic wants to merge 4 commits intomendix:masterfrom
NikolaSimsic:master

Conversation

@NikolaSimsic
Copy link

  • Updated RN to 0.78.2 to match the one used in Native Widgets.
  • Tested with automated generating different variations of widgets
  • All 14 widget configurations tested successfully:

✅ Web TypeScript (8.0, 8.6, 8.9, latest) - full & empty
✅ Web JavaScript (8.7, latest) - full & empty
✅ Native TypeScript (8.6, 8.9, latest) - full & empty
✅ Native JavaScript (latest) - full & empty

  • Every test passed including:

  • Widget generation

  • Build commands

  • Release commands

  • Dependencies files

  • npm start (watch mode)

  • Native dependency management

Copy link
Contributor

@LEGIO-SEXTA-FERRATA LEGIO-SEXTA-FERRATA left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

First round of review is done. 👍

widgetPackageJson.devDependencies["@mendix/pluggable-widgets-tools"] = toolsPackagePath;

// Adds compatibility to new React 18 and React native 0.72
fixPackageJson(widgetPackageJson);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This removes the last call to fixPackageJson() which is now unused, but has changes in this PR. Should we remove the method entirely?


// React 19 + RN 0.78.x: RN's built-in types still expect legacy component typings (e.g. `refs`).
// We return and assert `ReactNode` here to avoid JSX element type errors until upstream types align.
render(): ReactNode {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Based on the other files, shouldn't this return type be removed or changed to JSX.Element as well?

@@ -14,7 +14,7 @@ export interface BadgeProps {
export function Badge({ value, style, onClick }: BadgeProps): ReactElement {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the return type should be JSX.Element


export class HelloWorldSample extends Component<HelloWorldSampleProps> {
render(): ReactNode {
render(): React.JSX.Element {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we add JSX to the import of React, and skip the React prefix?

private readonly onClickHandler = this.onClick.bind(this);

render(): ReactNode {
render(): React.JSX.Element | null {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we need to include null here?

_writeCompilerOptions() {
if (this.widget.isLanguageTS) {
this._copyFile("commons/tsconfig.json", "tsconfig.json");
this._copyFile("commons/react-jsx.d.ts", "typings/react-jsx.d.ts");
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we can limit this to just native widgets?

"module": "esnext",
"target": "es6",
"lib": ["esnext", "dom"],
"types": ["jest", "node"],
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why are these removed?

{ name: "react-native", ...reactNativePackage },
{ name: "@types/react", ...reactPackage },
{ name: "@types/react-dom", ...reactDomPackage },
{ name: "@types/react-native", ...reactNativePackage }
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't we need to maintain these resolutions for the types?

"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-native": "0.78.2",
"mendix": {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If this override is truly needed, shouldn't we add it to the dependency migration for existing widgets as well? This generator change only affects new widgets.

import "react";

// React Native 0.78.x types expect a `refs` property on class components.
// React 19 removed `refs` from the Component instance type, so we re-add it here
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are there specific dependencies that refer to this.refs? Won't it "explode" in runtime when code assuming this.refs is available tries to call it?

Maybe to ensure widget developers don't accidentally use it we can mark it @deprecated

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

Comments