Skip to content

Commit

Permalink
[flow][react] Update react-rule related error messages to link to rel…
Browse files Browse the repository at this point in the history 
…evant react docs sections

Summary: Changelog: [internal]

Reviewed By: gkz

Differential Revision: D66895668

fbshipit-source-id: b6787a5aa539dbb1767ba4affe871cfbd16967bb
  • Loading branch information
@SamChou19815 @facebook-github-bot
SamChou19815 authored and facebook-github-bot committed Dec 7, 2024
1 parent e84f7c7 commit 0bfdc57
Show file tree
Hide file tree
Showing 7 changed files with 471 additions and 246 deletions.
36 changes: 26 additions & 10 deletions src/typing/errors/flow_intermediate_error.ml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1173,13 +1173,16 @@ let to_printable_error :
[
text "React ";
hardcoded_string_desc_ref "component properties" props_loc;
text " and their nested props and elements cannot be written to";
text " and their nested props and elements cannot be written to. ";
text "(https://react.dev/reference/rules/components-and-hooks-must-be-pure#props)";
]
| ExplanationReactHookArgsDeepReadOnly props_loc ->
[
text "React ";
hardcoded_string_desc_ref "hook arguments" props_loc;
text " and their nested elements cannot be written to";
text " and their nested elements cannot be written to. ";
text
"(https://react.dev/reference/rules/components-and-hooks-must-be-pure#return-values-and-arguments-to-hooks-are-immutable)";
]
| ExplanationReactHookIncompatibleWithEachOther ->
[
Expand All @@ -1195,7 +1198,9 @@ let to_printable_error :
[
text "The return value of a ";
hardcoded_string_desc_ref "React hook" hook_loc;
text " cannot be written to";
text " cannot be written to. ";
text
"(https://react.dev/reference/rules/components-and-hooks-must-be-pure#return-values-and-arguments-to-hooks-are-immutable)";
]
| ExplanationReactImmutable annot_loc ->
[
Expand Down Expand Up @@ -1498,15 +1503,17 @@ let to_printable_error :
@ non_hook_blame
@ [
text
". Function callees must either be definitely a hook or definitely not a hook, because the same hook must be called every time a component renders.";
". Function callees must either be definitely a hook or definitely not a hook, because the same hook must be called every time a component renders. ";
]
@ [text "(https://react.dev/reference/rules/rules-of-hooks)"]
| MessageCannotCallNonReactHookWithIllegalName callee_loc ->
[
text "Cannot call function because ";
hardcoded_string_desc_ref "callee" callee_loc;
text " has a name that indicates it is a React hook (starting with ";
code "use";
text ") but it is defined as a non-hook function.";
text ") but it is defined as a non-hook function. ";
text "(https://react.dev/reference/rules/rules-of-hooks)";
]
| MessageCannotCallObjectFunctionOnEnum { reason; enum_reason } ->
let suggestion =
Expand Down Expand Up @@ -1536,7 +1543,8 @@ let to_printable_error :
[
text "Cannot call ";
ref reason;
text " because React components cannot be called. Use JSX instead.";
text " because React components cannot be called. Use JSX instead. ";
text "(https://react.dev/reference/rules/react-calls-components-and-hooks)";
]
| MessageCannotCallReactFunctionWithoutAtLeastNArgs { fn_name; n } ->
[
Expand All @@ -1558,21 +1566,24 @@ let to_printable_error :
[
text "Cannot call ";
hardcoded_string_desc_ref "hook" callee_loc;
text " because React hooks cannot be called in conditional contexts.";
text " because React hooks cannot be called in conditional contexts. ";
text "(https://react.dev/reference/rules/rules-of-hooks)";
]
| MessageCannotCallReactHookInNonComponentOrHook callee_loc ->
[
text "Cannot call ";
hardcoded_string_desc_ref "hook" callee_loc;
text " because React hooks can only be called within components or hooks.";
text " because React hooks can only be called within components or hooks. ";
text "(https://react.dev/reference/rules/rules-of-hooks)";
]
| MessageCannotCallReactHookWithIllegalName callee_loc ->
[
text "Cannot call hook because ";
hardcoded_string_desc_ref "callee" callee_loc;
text "'s name does not conform to React hook rules. Hook names must begin with ";
code "use";
text " followed by a capitalized letter.";
text " followed by a capitalized letter. ";
text "(https://react.dev/reference/rules/rules-of-hooks)";
]
| MessageCannotCallFunctionWithExtraArg { def_reason; param_count } ->
let msg =
Expand Down Expand Up @@ -2933,7 +2944,12 @@ let to_printable_error :
| MessageInvalidGraphQL Graphql.InvalidGraphQL ->
[text "Expected a GraphQL fragment, query, mutation, or subscription."]
| MessageInvalidHookNaming ->
[text "Hooks must have names that begin with "; code "use"; text "."]
[
text "Hooks must have names that begin with ";
code "use";
text ". ";
text "(https://react.dev/reference/rules/rules-of-hooks)";
]
| MessageInvalidImportStarUse import_star_reason ->
[
text "The default export of a module cannot be accessed from an ";
Expand Down
12 changes: 8 additions & 4 deletions tests/component_syntax/component_syntax.exp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -653,7 +653,8 @@ References:

Error ------------------------------------------------------------------------------------------------------ call.js:5:1

Cannot call component Foo [1] because React components cannot be called. Use JSX instead. [react-rule-call-component]
Cannot call component Foo [1] because React components cannot be called. Use JSX instead.
(https://react.dev/reference/rules/react-calls-components-and-hooks) [react-rule-call-component]

call.js:5:1
5| Foo(); // ERROR, even with fixme
Expand Down Expand Up @@ -1400,7 +1401,8 @@ Components may not be nested directly within other components. [nested-component

Error --------------------------------------------------------------------------------------------------- errors.js:45:1

Cannot call component Baz [1] because React components cannot be called. Use JSX instead. [react-rule-call-component]
Cannot call component Baz [1] because React components cannot be called. Use JSX instead.
(https://react.dev/reference/rules/react-calls-components-and-hooks) [react-rule-call-component]

errors.js:45:1
45| Baz(); // error
Expand All @@ -1414,7 +1416,8 @@ References:

Error --------------------------------------------------------------------------------------------------- errors.js:48:1

Cannot call component Poly [1] because React components cannot be called. Use JSX instead. [react-rule-call-component]
Cannot call component Poly [1] because React components cannot be called. Use JSX instead.
(https://react.dev/reference/rules/react-calls-components-and-hooks) [react-rule-call-component]

errors.js:48:1
48| Poly(); // error
Expand All @@ -1428,7 +1431,8 @@ References:

Error --------------------------------------------------------------------------------------------------- errors.js:49:1

Cannot call component Poly [1] because React components cannot be called. Use JSX instead. [react-rule-call-component]
Cannot call component Poly [1] because React components cannot be called. Use JSX instead.
(https://react.dev/reference/rules/react-calls-components-and-hooks) [react-rule-call-component]

errors.js:49:1
49| Poly<number>(); // error
Expand Down
Loading

0 comments on commit 0bfdc57

Please sign in to comment.