chore(core): update dependencies and fix new errors (#1022)

Prepare for new demo app update (#1021) by aligning some dependencies versions and fixing some resulting errors. --------- Co-authored-by: flochtililoch <[email protected]>
Instawork · Jan 23, 2025 · 2bab9c6 · 2bab9c6
1 parent 09cfebb
commit 2bab9c6
Show file tree

Hide file tree

Showing 13 changed files with 4,910 additions and 4,687 deletions.
diff --git a/babel.config.js b/babel.config.js
@@ -8,5 +8,5 @@ module.exports = {
       },
     ],
   ],
-  presets: ['module:metro-react-native-babel-preset'],
+  presets: ['module:@react-native/babel-preset'],
 };
diff --git a/package.json b/package.json
@@ -54,20 +54,21 @@
     "@react-navigation/bottom-tabs": "^6.5.7",
     "@react-navigation/native": "^6.1.6",
     "@react-navigation/stack": "^6.3.16",
-    "@types/react": "^17.0.67",
-    "react": "^17.0.2",
-    "react-native": "^0.67.4",
+    "@types/react": "~18.3.12",
+    "react": "^18.2.0",
+    "react-native": "^0.76.6",
     "react-native-gesture-handler": "^2.11.0",
     "react-native-keyboard-aware-scrollview": "^2.1.0",
     "react-native-safe-area-context": "^4.2.4",
     "react-native-webview": "^13.2.2"
   },
   "devDependencies": {
-    "@babel/cli": "7.13.0",
-    "@babel/core": "7.13.1",
-    "@babel/eslint-parser": "7.13.4",
-    "@babel/node": "7.13.0",
-    "@babel/runtime": "7.13.7",
+    "@babel/cli": "7.26.4",
+    "@babel/core": "7.26.0",
+    "@babel/eslint-parser": "7.26.5",
+    "@babel/node": "7.26.0",
+    "@babel/preset-env": "7.26.0",
+    "@babel/runtime": "7.26.0",
     "@prettier/plugin-xml": "0.13.0",
     "@react-native-community/datetimepicker": "7.6.2",
     "@react-native-picker/picker": "2.6.1",
@@ -79,44 +80,37 @@
     "@storybook/react-native": "4.1.18",
     "@tsconfig/react-native": "3.0.2",
     "@types/glob": "8.1.0",
-    "@types/jest": "29.4.0",
+    "@types/jest": "29.5.14",
     "@types/lodash": "4.14.198",
     "@types/node": "20.8.2",
-    "@types/react": "17.0.67",
-    "@types/react-native": "0.67.8",
-    "@types/react-test-renderer": "18.0.0",
+    "@types/react": "~18.3.12",
     "@types/url-parse": "1.4.9",
     "babel-eslint": "10.1.0",
-    "babel-jest": "26.6.3",
-    "babel-plugin-module-resolver": "4.1.0",
-    "babel-preset-react-native": "4.0.1",
+    "babel-jest": "29.7.0",
+    "babel-plugin-module-resolver": "5.0.2",
     "chokidar": "3.5.1",
     "eslint": "7.20.0",
+    "eslint-import-resolver-babel-module": "5.2.0",
     "eslint-plugin-instawork": "0.12.0",
     "glob": "7.1.6",
     "humps": "2.0.1",
     "husky": "5.1.1",
-    "jest": "26.6.3",
-    "metro-react-native-babel-preset": "0.63.0",
+    "jest": "29.7.0",
+    "metro-react-native-babel-preset": "0.76.9",
     "mkdirp": "1.0.4",
     "nunjucks": "^3.2.4",
     "patch-package": "6.2.2",
     "prettier": "2.2.1",
     "pretty-quick": "3.1.0",
-    "react": "17.0.2",
-    "react-dom": "16.8.0",
-    "react-native": "0.67.4",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "react-native": "0.76.6",
     "react-native-gesture-handler": "2.11.0",
     "react-native-keyboard-aware-scrollview": "2.1.0",
     "react-native-webview": "13.2.2",
-    "react-test-renderer": "16.13.1",
+    "react-test-renderer": "18.3.1",
     "ts-node": "10.9.2",
-    "typescript": "5.2.2"
-  },
-  "resolutions": {
-    "@types/react": "17.0.67",
-    "@typescript-eslint/eslint-plugin": "6.7.4",
-    "@typescript-eslint/parser": "6.7.4"
+    "typescript": "5.7.3"
   },
   "jest": {
     "preset": "react-native",

diff --git a/src/components/hv-list/index.tsx b/src/components/hv-list/index.tsx
@@ -29,6 +29,8 @@ export default class HvList extends PureComponent<HvComponentProps, State> {
 
   static localNameAliases = [];
 
+  context: React.ContextType<typeof Contexts.DocContext> = null;
+
   static contextType = Contexts.DocContext;
 
   parser: DOMParser = new DOMParser();
@@ -65,7 +67,7 @@ export default class HvList extends PureComponent<HvComponentProps, State> {
       Logging.warn('[behaviors/scroll]: missing "target" attribute');
       return;
     }
-    const doc: Document | null | undefined = this.context.getDoc();
+    const doc: Document | null | undefined = this.context?.getDoc();
     const targetElement: Element | null | undefined = Dom.getElementById(
       doc,
       targetId,

diff --git a/src/components/hv-section-list/index.tsx b/src/components/hv-section-list/index.tsx
@@ -68,6 +68,8 @@ export default class HvSectionList extends PureComponent<
 
   static localNameAliases = [];
 
+  context: React.ContextType<typeof Contexts.DocContext> = null;
+
   static contextType = Contexts.DocContext;
 
   parser: DOMParser = new DOMParser();
@@ -104,7 +106,7 @@ export default class HvSectionList extends PureComponent<
       Logging.warn('[behaviors/scroll]: missing "target" attribute');
       return;
     }
-    const doc: Document | null | undefined = this.context.getDoc();
+    const doc: Document | null | undefined = this.context?.getDoc();
     const targetElement: Element | null | undefined = Dom.getElementById(
       doc,
       targetId,

diff --git a/src/components/hv-view/index.tsx b/src/components/hv-view/index.tsx
@@ -84,21 +84,22 @@ export default class HvView extends PureComponent<HvComponentProps> {
     return { accessibilityLabel: id, style };
   };
 
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  getScrollViewProps = (children: Array<any>): ScrollViewProps => {
+  getScrollViewProps = (
+    children: Array<React.ReactElement<HvComponentProps> | null | string>,
+  ): ScrollViewProps => {
     const horizontal =
       this.attributes[ATTRIBUTES.SCROLL_ORIENTATION] === 'horizontal';
     const showScrollIndicator =
       this.attributes[ATTRIBUTES.SHOWS_SCROLL_INDICATOR] !== 'false';
 
-    const contentContainerStyle = (this.attributes[
+    const contentContainerStyle = this.attributes[
       ATTRIBUTES.CONTENT_CONTAINER_STYLE
     ]
       ? createStyleProp(this.props.element, this.props.stylesheets, {
           ...this.props.options,
           styleAttr: ATTRIBUTES.CONTENT_CONTAINER_STYLE,
         })
-      : undefined) as ViewStyle;
+      : undefined;
 
     // Fix scrollbar rendering issue in iOS 13+
     // https://github.com/facebook/react-native/issues/26610#issuecomment-539843444
@@ -108,14 +109,16 @@ export default class HvView extends PureComponent<HvComponentProps> {
         : undefined;
 
     // add sticky indices
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const stickyHeaderIndices = children.reduce<Array<any>>(
-      // eslint-disable-next-line no-confusing-arrow
-      (acc, element, index) =>
-        typeof element !== 'string' &&
-        element.props?.element?.getAttribute('sticky') === 'true'
-          ? [...acc, index]
-          : acc,
+    const stickyHeaderIndices = children.reduce<Array<number>>(
+      (acc, element, index) => {
+        if (
+          typeof element !== 'string' &&
+          element?.props.element?.getAttribute('sticky') === 'true'
+        ) {
+          return [...acc, index];
+        }
+        return acc;
+      },
       [],
     );
 

diff --git a/src/core/components/hv-navigator/index.tsx b/src/core/components/hv-navigator/index.tsx
@@ -189,7 +189,7 @@ export default class HvNavigator extends PureComponent<Props> {
     type: string,
     href: string | undefined,
     isModal: boolean,
-    isFirstScreen: boolean = false,
+    isFirstScreen = false,
     routeId?: string | undefined,
   ): React.ReactElement => {
     const initialParams = NavigatorService.isDynamicRoute(id)

diff --git a/src/core/components/hv-route/index.tsx b/src/core/components/hv-route/index.tsx
@@ -40,6 +40,8 @@ import { NavigationContainerRefContext } from '@react-navigation/native';
 class HvRouteInner extends PureComponent<Types.InnerRouteProps, ScreenState> {
   static contextType = NavigationContainerRefContext;
 
+  context: React.ContextType<typeof NavigationContainerRefContext> = undefined;
+
   parser?: DomService.Parser;
 
   navLogic: NavigatorService.Navigator;

diff --git a/src/core/hyper-ref/index.tsx b/src/core/hyper-ref/index.tsx
@@ -57,6 +57,8 @@ export const createEventHandler = (
 export default class HyperRef extends PureComponent<Props, State> {
   static contextType = BackBehaviorContext;
 
+  context: React.ContextType<typeof BackBehaviorContext> = null;
+
   state: State = {
     pressed: false,
     refreshing: false,

diff --git a/src/services/components/index.ts b/src/services/components/index.ts
@@ -71,7 +71,7 @@ export class Registry {
     }
 
     const formData: FormData = new FormData();
-    let formHasData: boolean = false;
+    let formHasData = false;
 
     this.components
       .filter(c =>

diff --git a/src/services/navigator/helpers.ts b/src/services/navigator/helpers.ts
@@ -664,7 +664,7 @@ const getUrlFromState = (
     return undefined;
   }
 
-  for (let i: number = 0; i < state.routes.length; i += 1) {
+  for (let i = 0; i < state.routes.length; i += 1) {
     const route = state.routes[i];
     if (route.name === id) {
       const params = route.params as RouteParams;

diff --git a/src/services/render/index.tsx b/src/services/render/index.tsx
@@ -5,6 +5,7 @@ import type {
   HvComponent,
   HvComponentOnUpdate,
   HvComponentOptions,
+  HvComponentProps,
   StyleSheets,
 } from 'hyperview/src/types';
 import { LOCAL_NAME, NODE_TYPE } from 'hyperview/src/types';
@@ -15,8 +16,7 @@ export const renderElement = (
   stylesheets: StyleSheets,
   onUpdate: HvComponentOnUpdate,
   options: HvComponentOptions,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-): React.ReactElement<any> | null | string => {
+): React.ReactElement<HvComponentProps> | null | string => {
   if (!element) {
     return null;
   }
@@ -146,7 +146,7 @@ export const renderChildren = (
   stylesheets: StyleSheets,
   onUpdate: HvComponentOnUpdate,
   options: HvComponentOptions,
-) => {
+): Array<React.ReactElement<HvComponentProps> | null | string> => {
   if (element.childNodes) {
     return renderChildNodes(
       Array.from(element.childNodes),
@@ -167,7 +167,7 @@ export const renderChildNodes = (
   stylesheets: StyleSheets,
   onUpdate: HvComponentOnUpdate,
   options: HvComponentOptions,
-) => {
+): Array<React.ReactElement<HvComponentProps> | null | string> => {
   const children = [];
   for (let i = 0; i < childNodes.length; i += 1) {
     const e = renderElement(childNodes[i] as Element, stylesheets, onUpdate, {

diff --git a/tsconfig.json b/tsconfig.json
@@ -24,7 +24,7 @@
     "paths": {
       "hyperview/*": ["./*"]
     },
-    "types": ["react-native", "jest", "node"],
+    "types": ["jest", "node"],
     "typeRoots": ["./node_modules/@types", "./@types"]
   },
   "exclude": ["**/*.js", "**/*.jsx", "demo/**/*"]
-Original file line number
+Diff line change
@@ Expand Up / @@ -8,5 +8,5 @@ module.exports = { @@
           },
         ],
       ],
-      presets: ['module:metro-react-native-babel-preset'],
+      presets: ['module:@react-native/babel-preset'],
     };