chore: bump typescript to v5.1.1 and bump to react v18

tsedio · Jun 2, 2023 · f4b9f71 · f4b9f71
1 parent 477f84f
commit f4b9f71
Show file tree

Hide file tree

Showing 14 changed files with 2,473 additions and 3,319 deletions.
diff --git a/package.json b/package.json
@@ -21,7 +21,7 @@
     "lint": "lerna run lint --stream",
     "lint:fix": "lerna run lint:fix --stream",
     "prettier": "prettier '**/*.{ts,js,json,md,yml,yaml}' --write",
-    "build": "monorepo build",
+    "build": "lerna run build --stream",
     "publish": "monorepo publish --dry-run",
     "start": "lerna run start --stream --parallel",
     "start:storybook": "lerna run start:storybook --stream",
@@ -34,24 +34,25 @@
   "dependencies": {
     "@formio/choices.js": "^9.0.1",
     "@types/classnames": "^2.2.11",
-    "@types/enzyme": "^3.10.8",
-    "@types/react": "^17.0.2",
-    "@types/react-dom": "^17.0.1",
-    "@types/react-redux": "^7.1.16",
-    "@types/react-router": "^5.1.11",
-    "@types/react-router-dom": "^5.1.7",
-    "@types/react-table": "^7.0.28",
+    "@types/react": "^18.2.8",
+    "@types/react-dom": "^18.2.4",
+    "@types/react-redux": "^7.1.25",
+    "@types/react-router": "^5.1.20",
+    "@types/react-router-dom": "^5.3.3",
+    "@types/react-table": "^7.7.14",
+    "@types/react-dnd": "3.0.2",
+    "@types/react-dnd-html5-backend": "3.0.2",
     "connected-react-router": "6.9.1",
     "formiojs": "^4.14.13",
     "history": "5.3.0",
     "lerna": "5.1.8",
     "lodash": "4.17.20",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-redux": "7.2.6",
     "react-router": "5.2.1",
     "react-router-dom": "5.2.1",
-    "react-table": "^7.7.0",
+    "react-table": "^7.8.0",
     "redux-thunk": "^2.4.1",
     "tooltip.js": "^1.3.3"
   },
@@ -69,7 +70,7 @@
     "@types/jest": "27.0.2",
     "@types/lodash": "4.14.168",
     "@types/node": "^18.11.18",
-    "@types/prop-types": "15.7.3",
+    "@types/prop-types": "^15.7.5",
     "@types/react-dnd": "3.0.2",
     "@types/react-dnd-html5-backend": "3.0.2",
     "autoprefixer": "^10.4.7",
@@ -105,7 +106,7 @@
     "rimraf": "^3.0.2",
     "semantic-release": "19.0.3",
     "semantic-release-slack-bot": "3.5.3",
-    "typescript": "^4.1.3",
+    "typescript": "5.1.3",
     "webpack": "4.44.2"
   },
   "workspaces": {

diff --git a/packages/react-formio-container/package.json b/packages/react-formio-container/package.json
@@ -30,7 +30,7 @@
     "react-redux": "^7.2.6",
     "react-router": "^5.2.1",
     "react-router-dom": "^5.2.1",
-    "react-table": "^7.7.0",
+    "react-table": "^7.8.0",
     "redux-thunk": "^2.4.1",
     "tooltip.js": "^1.3.3"
   },
@@ -91,4 +91,4 @@
     }
   },
   "dependencies": {}
-}
+}
diff --git a/packages/react-formio-container/src/formio.container.tsx b/packages/react-formio-container/src/formio.container.tsx
@@ -1,5 +1,6 @@
 import React from "react";
-import { Route, Switch, useParams } from "react-router";
+import { useParams } from "react-router";
+import { Route, Switch } from "react-router-dom";
 
 import { FormioContainerOptions } from "./interfaces/FormioContainerOptions";
 import { FormView } from "./views/form.view";
@@ -31,13 +32,15 @@ export function FormioContainer(props: FormioContainerOptions) {
   };
 
   return (
-    <Switch>
-      <Route path={options.basePath} exact={true}>
-        <FormsView {...(options as any)} />
-      </Route>
-      <Route path={[options.basePath, ":formId", ":formAction?"].join("/")}>
-        <FormView {...(options as any)} />
-      </Route>
-    </Switch>
+    <>
+      <Switch>
+        <Route path={options.basePath} exact={true}>
+          <FormsView {...(options as any)} />
+        </Route>
+        <Route path={[options.basePath, ":formId", ":formAction?"].join("/")}>
+          <FormView {...(options as any)} />
+        </Route>
+      </Switch>
+    </>
   );
 }
diff --git a/packages/react-formio-container/src/hooks/useFormExport.tsx b/packages/react-formio-container/src/hooks/useFormExport.tsx
@@ -31,7 +31,7 @@ export function useFormExport(props: UseFormProps) {
           message: i18n(`The ${type} has been successfully exported!`),
           data: form
         });
-      } catch (error) {
+      } catch (error: any) {
         onError({
           name: `export:${type}`,
           title: i18n(`Export ${type} failed`),

diff --git a/packages/react-formio-container/src/hooks/useQuery.hook.tsx b/packages/react-formio-container/src/hooks/useQuery.hook.tsx
@@ -9,7 +9,7 @@ export function shouldUpdate(options: Partial<QueryOptions>, cmp: Partial<QueryO
 
 export function useQuery(fetch: any, parameters: Partial<QueryOptions>) {
   return useCallback(
-    (options) => {
+    (options: any) => {
       if (shouldUpdate(options, parameters)) {
         fetch(options);
       }

diff --git a/packages/react-formio/src/components/form/useForm.hook.ts b/packages/react-formio/src/components/form/useForm.hook.ts
@@ -114,7 +114,7 @@ export function useForm<Data = any>(props: UseFormHookProps<Data>) {
     if (hasEvent("onAsyncSubmit")) {
       try {
         await emit("onAsyncSubmit", submission, instance.current);
-      } catch (err) {
+      } catch (err: any) {
         callback(err?.errors || err);
       }
     } else {

diff --git a/packages/react-formio/src/components/forms-table/formsTable.component.tsx b/packages/react-formio/src/components/forms-table/formsTable.component.tsx
@@ -38,5 +38,5 @@ export function FormsTable({ Cell, ...props }: FormsTableProps) {
     }
   ];
 
-  return <Table {...props} columns={columns} />;
+  return <Table {...(props as any)} columns={columns} />;
 }
diff --git a/packages/react-formio/src/components/modal/removeModal.component.tsx b/packages/react-formio/src/components/modal/removeModal.component.tsx
@@ -1,5 +1,4 @@
 import classnames from "classnames";
-import noop from "lodash/noop";
 import React, { PropsWithChildren, useState } from "react";
 
 import { iconClass } from "../../utils/iconClass";
@@ -37,7 +36,7 @@ export interface RemoveModalProps extends ModalProps {
 }
 
 export function RemoveModal({ maxWidth = "300px", children, ...props }: PropsWithChildren<RemoveModalProps>) {
-  const { i18n = noop } = props;
+  const { i18n = (f) => f } = props;
   const [value, setValue] = useState();
 
   return (
@@ -49,8 +48,8 @@ export function RemoveModal({ maxWidth = "300px", children, ...props }: PropsWit
       value={value}
       footer={RemoveModalFooter}
     >
-      <div className={"px-4 pt-3 pb-5"}>
-        <div className={"pb-1"}>
+      <div className='px-4 pt-3 pb-5'>
+        <div className='pb-1'>
           {children}
           {i18n("To drop")} <strong>{props.valueToCompare}</strong>,&nbsp;
           {i18n("type the")}&nbsp;

diff --git a/packages/react-formio/src/components/table/components/defaultCellHeader.component.tsx b/packages/react-formio/src/components/table/components/defaultCellHeader.component.tsx
@@ -9,11 +9,11 @@ export function DefaultCellHeader<Data extends Record<string, unknown> = {}>({ c
   return (
     <div className={"table-cell-header"}>
       <div className='table-cell-header__label' {...column.getSortByToggleProps()}>
-        <span>{column.render("Header")}</span>
+        <span>{column.render("Header") as any}</span>
 
-        {column.render("ArrowSort")}
+        {column.render("ArrowSort") as any}
       </div>
-      {column.canFilter ? <div className='table-cell-header__filter'>{column.render("Filter")}</div> : null}
+      {column.canFilter ? <div className='table-cell-header__filter'>{column.render("Filter") as any}</div> : null}
     </div>
   );
 }
diff --git a/packages/react-formio/src/components/table/components/defaultCells.component.tsx b/packages/react-formio/src/components/table/components/defaultCells.component.tsx
@@ -13,7 +13,7 @@ export function DefaultCells<Data extends object = {}>({ row }: { row: Row<Data>
 
         return (
           <td colSpan={colspan} {...cell.getCellProps()} key={`tableInstance.page.cells.${cell.value || "value"}.${i}`}>
-            {cell.render("Cell")}
+            {cell.render("Cell") as any}
           </td>
         );
       })}

diff --git a/packages/react-formio/src/components/table/filters/defaultColumnFilter.component.tsx b/packages/react-formio/src/components/table/filters/defaultColumnFilter.component.tsx
@@ -15,7 +15,7 @@ export function DefaultColumnFilter<D extends Record<string, unknown> = {}>(
   const [value, setValue] = useState(filterValue || "");
 
   const onChange = useCallback(
-    (name, value) => {
+    (name: string, value: any) => {
       setValue(value);
       setFilterId(id);
       setFilter(value || undefined);

diff --git a/packages/react-formio/src/components/table/hooks/useCustomTable.hook.tsx b/packages/react-formio/src/components/table/hooks/useCustomTable.hook.tsx
@@ -1,6 +1,17 @@
 import noop from "lodash/noop";
 import React, { PropsWithChildren, useEffect, useState } from "react";
-import { CellProps, FilterProps, Renderer, TableOptions, useFilters, useGroupBy, usePagination, useSortBy, useTable } from "react-table";
+import {
+  CellProps,
+  FilterProps,
+  Renderer,
+  TableInstance,
+  TableOptions,
+  useFilters,
+  useGroupBy,
+  usePagination,
+  useSortBy,
+  useTable
+} from "react-table";
 
 import { OnClickOperation, Operation, QueryOptions } from "../../../interfaces";
 import { Pagination as DefaultPagination } from "../../pagination/pagination.component";
@@ -156,7 +167,7 @@ export function useCustomTable<Data extends object = {}>(props: PropsWithChildre
   const [filterId, setFilterId] = React.useState(controlledFilterId);
 
   // DND
-  const [records, setRecords] = useState<Data[]>(data);
+  const [records, setRecords] = useState<readonly Data[]>(data);
 
   useEffect(() => {
     setRecords(data);
@@ -212,12 +223,10 @@ export function useCustomTable<Data extends object = {}>(props: PropsWithChildre
   }, [onChange, pageIndex, pageSize, sortBy, filters, filterId]);
 
   return {
-    ...props,
     className,
     tableInstance,
     CellHeader,
     isLoading,
-    onClick: _onClick,
     Loader,
     EmptyData,
     Row,
@@ -230,7 +239,9 @@ export function useCustomTable<Data extends object = {}>(props: PropsWithChildre
     setPageSize,
     i18n,
     children,
+    onClick: _onClick as any,
     onDrag: _onDrag,
-    onDrop: onDrop
+    onDrop: onDrop,
+    enableDragNDrop: props.enableDragNDrop
   };
 }
diff --git a/packages/react-formio/tsconfig.json b/packages/react-formio/tsconfig.json
@@ -1,7 +1,8 @@
 {
   "extends": "@tsed/config/tsconfig.web.json",
   "compilerOptions": {
-    "rootDir": "src"
+    "rootDir": "src",
+    "moduleResolution": "node"
   },
   "include": ["src"],
   "references": [
-Original file line number
+Diff line change
@@ Expand Up @@
         }
       ];
-      return <Table {...props} columns={columns} />;
+      return <Table {...(props as any)} columns={columns} />;
     }