update real-project

Author: nasdan

05-testing/01-react/05-real-project/00-boilerplate/package-lock.json

@@ -26,34 +26,34 @@
     "@lemoncode/fonk-formik": "^4.0.1",
     "@lemoncode/fonk-match-field-validator": "^1.0.1",
     "@lemoncode/fonk-required-by-field-validator": "^1.0.1",
-    "@mui/icons-material": "^6.2.0",
-    "@mui/material": "^6.2.0",
-    "@tanstack/react-table": "^8.20.6",
-    "axios": "^1.7.9",
+    "@mui/icons-material": "^7.1.0",
+    "@mui/material": "^7.1.0",
+    "@tanstack/react-table": "^8.21.3",
+    "axios": "^1.9.0",
     "formik": "^2.4.6",
     "graphql-request": "^7.1.2",
     "immer": "^10.1.1",
     "lodash.flowright": "^3.5.0",
     "lodash.get": "^4.4.2",
     "lodash.merge": "^4.6.2",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "react-promise-tracker": "^2.1.1",
-    "react-router-dom": "^7.0.2",
-    "react-spinners": "^0.15.0"
+    "react-router-dom": "^7.5.3",
+    "react-spinners": "^0.17.0"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/react": "^16.1.0",
-    "@types/react": "^19.0.1",
-    "@types/react-dom": "^19.0.2",
-    "@vitejs/plugin-react": "^4.3.4",
-    "jsdom": "^25.0.1",
+    "@testing-library/react": "^16.3.0",
+    "@types/react": "^19.1.3",
+    "@types/react-dom": "^19.1.3",
+    "@vitejs/plugin-react": "^4.4.1",
+    "jsdom": "^26.1.0",
     "npm-run-all": "^4.1.5",
     "rimraf": "^6.0.1",
-    "typescript": "^5.7.2",
-    "vite": "^6.0.3",
-    "vitest": "^2.1.8"
+    "typescript": "^5.8.3",
+    "vite": "^6.3.5",
+    "vitest": "^3.1.3"
   }
 }

05-testing/01-react/05-real-project/00-boilerplate/package.json

@@ -8,7 +8,8 @@ import {
   Toolbar,
   Typography,
 } from '@mui/material';
-import { AccountCircle, Menu as MenuIcon } from '@mui/icons-material';
+import AccountCircle from '@mui/icons-material/AccountCircle';
+import MenuIcon from '@mui/icons-material/Menu';
 import { literals } from '#core/i18n';
 import { AuthContext, useLogout } from '#common-app/auth';
 import { SideMenuComponent } from './components';

05-testing/01-react/05-real-project/00-boilerplate/src/common-app/app-bar/app-bar.component.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { PeopleAlt as PeopleAltIcon } from '@mui/icons-material';
+import PeopleAltIcon from '@mui/icons-material/PeopleAlt';
 import { fireEvent } from '@testing-library/react';
 import { renderWithRouter } from '#common/test';
 import { Route } from 'react-router-dom';

05-testing/01-react/05-real-project/00-boilerplate/src/common/components/dashboard/components/item.component.spec.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { PeopleAlt as PeopleAltIcon } from '@mui/icons-material';
+import PeopleAltIcon from '@mui/icons-material/PeopleAlt';
 import { Route } from 'react-router-dom';
 import { renderWithRouter } from '#common/test';
 import { DashboardComponent } from './dashboard.component';

05-testing/01-react/05-real-project/00-boilerplate/src/common/components/dashboard/dashboard.component.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { TextField } from '@mui/material';
-import { Search as SearchIcon } from '@mui/icons-material';
+import SearchIcon from '@mui/icons-material/Search';
 
 interface LabelProps {
   placeholder: string;

05-testing/01-react/05-real-project/00-boilerplate/src/common/components/search-bar/search-bar.component.tsx

@@ -5,7 +5,7 @@ import {
   SnackbarContent,
   IconButton,
 } from '@mui/material';
-import { Close as CloseIcon } from '@mui/icons-material';
+import CloseIcon from '@mui/icons-material/Close';
 import { SnackbarContext } from './snackbar.context';
 import * as classes from './snackbar.styles';
 

05-testing/01-react/05-real-project/00-boilerplate/src/common/components/snackbar/snackbar.component.tsx

@@ -4,31 +4,30 @@ import { render } from '@testing-library/react';
 import { BodyComponent } from './body.component';
 import { RowComponent } from './row.component';
 import { CellComponent } from './cell.component';
-import { RowRendererProps } from '../table.vm';
+
+interface TestRow {
+  testRow: number;
+}
 
 describe('common/table/BodyComponent', () => {
   it('should render as expected', () => {
     // Arrange
-    const TestRowComponent: React.FunctionComponent<RowRendererProps<any>> = (
-      props
-    ) => (
-      <RowComponent>
-        <CellComponent>{props.row.testRow}</CellComponent>
-      </RowComponent>
-    );
-
     const props = {
       rows: [
         { original: { testRow: 1 } },
         { original: { testRow: 2 } },
         { original: { testRow: 3 } },
-      ] as unknown as Row<any>[],
-      rowRenderer: TestRowComponent,
+      ] as unknown as Row<TestRow>[],
+      rowRenderer: (props) => (
+        <RowComponent>
+          <CellComponent>{props.row.testRow}</CellComponent>
+        </RowComponent>
+      ),
       prepareRow: vi.fn(),
     };
 
     // Act
-    const { getByText } = render(<BodyComponent {...props} />);
+    const { getByText } = render(<BodyComponent<TestRow> {...props} />);
 
     // Assert
     expect(getByText('1')).toBeInTheDocument();

05-testing/01-react/05-real-project/00-boilerplate/src/common/components/table/components/body.component.spec.tsx

@@ -3,12 +3,12 @@ import { Row } from '@tanstack/react-table';
 import { TableBody } from '@mui/material';
 import { RowRendererProps } from '../table.vm';
 
-interface Props<T extends object = {}> {
+interface Props<T> {
   rows: Row<T>[];
   rowRenderer: (props: RowRendererProps<T>) => React.ReactNode;
 }
 
-export const BodyComponent: React.FunctionComponent<Props> = (props) => {
+export const BodyComponent = <T,>(props: Props<T>) => {
   const { rows, rowRenderer } = props;
   return (
     <TableBody>

05-testing/01-react/05-real-project/00-boilerplate/src/common/components/table/components/body.component.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Checkbox, IconButton } from '@mui/material';
-import { Edit as EditIcon, Delete as DeleteIcon } from '@mui/icons-material';
+import EditIcon from '@mui/icons-material/Edit';
+import DeleteIcon from '@mui/icons-material/Delete';
 import {
   RowRendererProps,
   RowComponent,

05-testing/01-react/05-real-project/00-boilerplate/src/pods/employee-list/components/employee-row.component.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Container, Avatar, Typography } from '@mui/material';
-import { LockOutlined as LockOutlinedIcon } from '@mui/icons-material';
+import LockOutlinedIcon from '@mui/icons-material/LockOutlined';
 import * as classes from './container.styles';
 
 interface Props {

05-testing/01-react/05-real-project/00-boilerplate/src/pods/login/components/container.component.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Checkbox, IconButton } from '@mui/material';
-import { Edit as EditIcon, Delete as DeleteIcon } from '@mui/icons-material';
+import EditIcon from '@mui/icons-material/Edit';
+import DeleteIcon from '@mui/icons-material/Delete';
 import {
   RowRendererProps,
   RowComponent,

05-testing/01-react/05-real-project/00-boilerplate/src/pods/project-list/components/project-row.component.tsx

@@ -1,8 +1,6 @@
 import React from 'react';
-import {
-  AccountBalance as AccountBalanceIcon,
-  Group as GroupIcon,
-} from '@mui/icons-material';
+import AccountBalanceIcon from '@mui/icons-material/AccountBalance';
+import GroupIcon from '@mui/icons-material/Group';
 import { SumoduleListComponent } from './submodule-list.component';
 import { DashboardItemProps } from '#common/components';
 import { routes } from '#core/router';