diff --git a/compiler/packages/babel-plugin-react-forget/src/Validation/ValidateNoCapitalizedCalls.ts b/compiler/packages/babel-plugin-react-forget/src/Validation/ValidateNoCapitalizedCalls.ts index 17c156267d..96ec3cf899 100644 --- a/compiler/packages/babel-plugin-react-forget/src/Validation/ValidateNoCapitalizedCalls.ts +++ b/compiler/packages/babel-plugin-react-forget/src/Validation/ValidateNoCapitalizedCalls.ts @@ -49,7 +49,8 @@ export function validateNoCapitalizedCalls(fn: HIRFunction): void { const calleeName = capitalLoadGlobals.get(calleeIdentifier); if (calleeName != null) { CompilerError.throwInvalidReact({ - reason: `Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error`, + reason: + "Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter", description: `${calleeName} may be a component.`, loc: value.loc, suggestions: null, @@ -69,7 +70,8 @@ export function validateNoCapitalizedCalls(fn: HIRFunction): void { const propertyName = capitalizedProperties.get(propertyIdentifier); if (propertyName != null) { CompilerError.throwInvalidReact({ - reason: `Capitalized method calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error`, + reason: + "Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter", description: `${propertyName} may be a component.`, loc: value.loc, suggestions: null, diff --git a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md index 66aca1702a..3fb394fb2e 100644 --- a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md +++ b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md @@ -17,7 +17,7 @@ function Foo() { 2 | function Foo() { 3 | let x = Bar; > 4 | x(); // ERROR - | ^^^ InvalidReact: Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. Bar may be a component. (4:4) + | ^^^ InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Bar may be a component. (4:4) 5 | } 6 | ``` diff --git a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md index 9add8315db..e6e6d1b924 100644 --- a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md +++ b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md @@ -18,7 +18,7 @@ function Component() { 1 | // @validateNoCapitalizedCalls 2 | function Component() { > 3 | const x = SomeFunc(); - | ^^^^^^^^^^ InvalidReact: Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. SomeFunc may be a component. (3:3) + | ^^^^^^^^^^ InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. SomeFunc may be a component. (3:3) 4 | 5 | return x; 6 | } diff --git a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md index 813c6dab5e..a5c5fb842a 100644 --- a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md +++ b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md @@ -18,7 +18,7 @@ function Component() { 1 | // @validateNoCapitalizedCalls 2 | function Component() { > 3 | const x = someGlobal.SomeFunc(); - | ^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Capitalized method calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. SomeFunc may be a component. (3:3) + | ^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. SomeFunc may be a component. (3:3) 4 | 5 | return x; 6 | }