fix: update to React 18 (#223)

Author: SimenB

package.json

@@ -57,7 +57,7 @@
     "@tsconfig/node14": "^14.1.2",
     "@types/jest": "^29.0.0",
     "@types/node": "^14.0.0",
-    "@types/react": "^17.0.39",
+    "@types/react": "^18.0.0",
     "@typescript-eslint/eslint-plugin": "^5.0.0",
     "@typescript-eslint/parser": "^5.0.0",
     "@vercel/ncc": "^0.38.0",
@@ -76,7 +76,7 @@
     "jest-util": "^29.0.2",
     "lint-staged": "^13.0.0",
     "prettier": "^3.0.0",
-    "react": "^17.0.2",
+    "react": "^18.0.0",
     "semantic-release": "^23.0.0",
     "slash": "^3.0.0",
     "ts-jest": "^29.0.0",

src/PostMessage.tsx

@@ -5,13 +5,13 @@ import { testPathPatternToRegExp } from 'jest-util';
 import * as React from 'react';
 import { Box, Text } from 'ink';
 
-const LeftPadded: React.FC = ({ children }) => (
+const LeftPadded: React.FC<{ children: React.ReactNode }> = ({ children }) => (
   <Box paddingLeft={1}>{children}</Box>
 );
 
-const HorizontallyPadded: React.FC = ({ children }) => (
-  <Box paddingX={1}>{children}</Box>
-);
+const HorizontallyPadded: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => <Box paddingX={1}>{children}</Box>;
 
 const TestInfo: React.FC<{ config: Config.GlobalConfig }> = ({ config }) => {
   if (config.runTestsByPath) {

src/SnapshotStatus.tsx

@@ -6,22 +6,28 @@ import { Box, Text } from 'ink';
 import { pluralize } from 'jest-util';
 import { Arrow, Dot } from './shared';
 
-const FailText: React.FC = ({ children }) => (
+const FailText: React.FC<{ children: React.ReactNode }> = ({ children }) => (
   <Text bold color="red">
     {children}
   </Text>
 );
-const SnapshotAdded: React.FC = ({ children }) => (
+const SnapshotAdded: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => (
   <Text bold color="green">
     {children}
   </Text>
 );
-const SnapshotUpdated: React.FC = ({ children }) => (
+const SnapshotUpdated: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => (
   <Text bold color="green">
     {children}
   </Text>
 );
-const SnapshotOutdated: React.FC = ({ children }) => (
+const SnapshotOutdated: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => (
   <Text bold color="yellow">
     {children}
   </Text>

src/Summary.tsx

@@ -7,13 +7,15 @@ import { useCounter } from './hooks';
 
 const PROGRESS_BAR_WIDTH = 40;
 
-const SummaryHeading: React.FC = ({ children }) => (
+const SummaryHeading: React.FC<{ children: string }> = ({ children }) => (
   <Box width={13}>
     <Text bold>{children}:</Text>
   </Box>
 );
 
-const RightPaddedWithComma: React.FC = ({ children }) => (
+const RightPaddedWithComma: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => (
   <Box paddingRight={1}>
     <Text>{children},</Text>
   </Box>

yarn.lock

@@ -1780,21 +1780,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react@npm:^17.0.39":
-  version: 17.0.80
-  resolution: "@types/react@npm:17.0.80"
+"@types/react@npm:^18.0.0":
+  version: 18.3.2
+  resolution: "@types/react@npm:18.3.2"
   dependencies:
     "@types/prop-types": "*"
-    "@types/scheduler": ^0.16
     csstype: ^3.0.2
-  checksum: 1c27bfc42305d77ef0da55f8f6d4c4a3471aa02b294fcf29ea0f2cfb0bf02892e5a0a3bc7559fa4a5ba50697b2e31076cb5aa5987f69cfc2e880f6426edb8bdf
-  languageName: node
-  linkType: hard
-
-"@types/scheduler@npm:^0.16":
-  version: 0.16.8
-  resolution: "@types/scheduler@npm:0.16.8"
-  checksum: 6c091b096daa490093bf30dd7947cd28e5b2cd612ec93448432b33f724b162587fed9309a0acc104d97b69b1d49a0f3fc755a62282054d62975d53d7fd13472d
+  checksum: d0b8b9d0ede6cd28dbbe34106d914b5e3652d9d7aa9d0f32fe6171506b6fc7c826d9d6571642976a5422bd29c5022fd893a710ed59a1177a0c1df8e02cf17ffe
   languageName: node
   linkType: hard
 
@@ -5601,7 +5593,7 @@ __metadata:
     "@tsconfig/node14": ^14.1.2
     "@types/jest": ^29.0.0
     "@types/node": ^14.0.0
-    "@types/react": ^17.0.39
+    "@types/react": ^18.0.0
     "@typescript-eslint/eslint-plugin": ^5.0.0
     "@typescript-eslint/parser": ^5.0.0
     "@vercel/ncc": ^0.38.0
@@ -5620,7 +5612,7 @@ __metadata:
     jest-util: ^29.0.2
     lint-staged: ^13.0.0
     prettier: ^3.0.0
-    react: ^17.0.2
+    react: ^18.0.0
     semantic-release: ^23.0.0
     slash: ^3.0.0
     ts-jest: ^29.0.0
@@ -7782,13 +7774,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react@npm:^17.0.2":
-  version: 17.0.2
-  resolution: "react@npm:17.0.2"
+"react@npm:^18.0.0":
+  version: 18.3.1
+  resolution: "react@npm:18.3.1"
   dependencies:
     loose-envify: ^1.1.0
-    object-assign: ^4.1.1
-  checksum: b254cc17ce3011788330f7bbf383ab653c6848902d7936a87b09d835d091e3f295f7e9dd1597c6daac5dc80f90e778c8230218ba8ad599f74adcc11e33b9d61b
+  checksum: a27bcfa8ff7c15a1e50244ad0d0c1cb2ad4375eeffefd266a64889beea6f6b64c4966c9b37d14ee32d6c9fcd5aa6ba183b6988167ab4d127d13e7cb5b386a376
   languageName: node
   linkType: hard