build: update node version

.github/workflows/main.yml

@@ -2,9 +2,9 @@ name: Tests
 
 on:
   push:
-    branches: [ main ]
+    branches: [main]
   pull_request:
-    branches: [ main ]
+    branches: [main]
 
 jobs:
   test:
@@ -24,4 +24,3 @@ jobs:
         run: yarn run lint
       - name: Run tests
         run: yarn test
-

.prettierrc.js

@@ -1,5 +1,5 @@
 module.exports = {
-  trailingComma: 'all',
+  trailingComma: 'es5',
   semi: true,
   singleQuote: true,
 };

README.md

@@ -6,7 +6,7 @@ The simplest task tracking tool for dev teams.
 
 ![Scrumboard](scrumboard.gif)
 
-## ⚙️  Technologies used
+## ⚙️ Technologies used
 
 - [Next.js](https://nextjs.org)
 - [Socket.io](https://socket.io)

_api/controllers/taskController.ts

@@ -10,7 +10,7 @@ type UserType = {
 
 const createUserIfNotExists = async (
   req: NextApiRequest,
-  boardName: string,
+  boardName: string
 ): Promise<void> => {
   const board = await Board.findOne({
     where: { name: boardName },

_api/models/Board.ts

@@ -23,7 +23,7 @@ Board.init(
     tableName: 'board',
     indexes: [{ unique: true, fields: ['name'] }],
     paranoid: true,
-  },
+  }
 );
 
 Board.hasMany(Story);

_api/models/Story.ts

@@ -27,7 +27,7 @@ Story.init(
     tableName: 'story',
     indexes: [{ unique: true, fields: ['id'] }],
     paranoid: true,
-  },
+  }
 );
 
 Story.hasMany(Task);

_api/models/Task.ts

@@ -31,7 +31,7 @@ Task.init(
     tableName: 'task',
     indexes: [{ unique: true, fields: ['id'] }],
     paranoid: true,
-  },
+  }
 );
 
 export default Task;

_api/models/User.ts

@@ -26,7 +26,7 @@ User.init(
     modelName: 'user',
     tableName: 'user',
     paranoid: true,
-  },
+  }
 );
 
 export default User;

jest.config.js

@@ -1,5 +1,7 @@
 module.exports = {
   roots: ['<rootDir>'],
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
   moduleFileExtensions: ['ts', 'tsx', 'js', 'json', 'jsx'],
   testPathIgnorePatterns: ['<rootDir>[/\\\\](node_modules|.next)[/\\\\]'],
   transformIgnorePatterns: ['[/\\\\]node_modules[/\\\\].+\\.(ts|tsx)$'],

next-env.d.ts

@@ -1,2 +1,5 @@
 /// <reference types="next" />
-/// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.

next.config.js

@@ -0,0 +1,22 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  transpilePackages: [
+    'antd',
+    '@ant-design/icons',
+    '@ant-design/icons-svg',
+    'rc-pagination',
+    'rc-util',
+    'rc-picker',
+    'rc-input',
+    'rc-tree',
+    'rc-table',
+    '@react-dnd/asap',
+    '@react-dnd/invariant',
+    '@react-dnd/shallowequal',
+    'dnd-core',
+    'react-dnd',
+    'react-dnd-html5-backend',
+  ],
+};
+
+module.exports = nextConfig;

package.json

@@ -3,6 +3,11 @@
   "author": "@erikdstock",
   "license": "MIT",
   "version": "1.0.0",
+  "engines": {
+    "node": ">=18",
+    "npm": ">=8"
+  },
+  "type": "commonjs",
   "scripts": {
     "dev": "nodemon",
     "build": "next build && tsc --project tsconfig.server.json",
@@ -43,50 +48,53 @@
   },
   "dependencies": {
     "@ant-design/icons": "^4.3.0",
+    "@testing-library/dom": "^10.4.0",
     "@types/socket.io": "^2.1.11",
-    "antd": "^4.8.2",
+    "antd": "^5.23.3",
     "basic-auth": "^2.0.1",
     "cross-env": "^7.0.3",
     "dotenv": "^8.2.0",
     "mobx": "^6.0.4",
     "mobx-react": "^7.0.5",
-    "next": "^10",
+    "next": "^15.1.6",
     "pg": "^8.5.0",
     "pg-hstore": "^2.3.3",
-    "react": "^16.13.1",
-    "react-dnd": "^11.1.3",
-    "react-dnd-html5-backend": "^11.1.3",
-    "react-dom": "^16.13.1",
+    "react": "^18.3.1",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
+    "react-dom": "^18.3.1",
     "react-markdown": "^5.0.3",
-    "sequelize": "^6.3.5",
+    "sequelize": "^6.37.5",
     "socket.io": "^3.0.3",
     "socket.io-client": "^3.0.3",
+    "ts-jest": "^29.2.5",
     "tsscmp": "^1.0.6",
     "uuid": "^8.3.1"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^5.11.5",
-    "@testing-library/react": "^10.0.1",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
     "@types/basic-auth": "^1.1.3",
-    "@types/jest": "^25.1.4",
-    "@types/node": "^13.9.5",
-    "@types/react": "^16.9.27",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^22.13.1",
+    "@types/react": "^19.0.8",
     "@typescript-eslint/eslint-plugin": "^2.25.0",
     "@typescript-eslint/parser": "^2.25.0",
-    "babel-jest": "^25.2.3",
+    "babel-jest": "^29.7.0",
     "eslint": "^6.8.0",
     "eslint-config-prettier": "^6.10.1",
     "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-react": "^7.19.0",
     "husky": "^4.3.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^25.2.3",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
     "jest-watch-typeahead": "^0.5.0",
     "lint-staged": "^10.0.10",
     "nodemon": "^2.0.6",
     "prettier": "^2.0.2",
     "sass": "^1.29.0",
     "ts-node": "^9.1.0",
-    "typescript": "^3.8.3"
+    "typescript": "^5.7.3"
   }
 }

pages/_app.tsx

@@ -1,3 +1,4 @@
+import { JSX } from 'react';
 import '../styles/global.scss';
 
 // eslint-disable-next-line react/prop-types

pages/api/boards/[boardName].ts

@@ -3,7 +3,7 @@ import Board from '../../../_api/models/Board';
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   if (req.method === 'GET') {
     const board = await Board.findOne({

pages/api/boards/[boardName]/stories/[storyId].ts

@@ -4,7 +4,7 @@ import Task from '../../../../../_api/models/Task';
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   switch (req.method) {
     case 'PUT':
@@ -13,7 +13,7 @@ export default async (
           { name: req.body.name, link: req.body.link },
           {
             where: { id: req.query.storyId, boardName: req.query.boardName },
-          },
+          }
         );
         res.status(200).json(req.body);
       } catch (error) {

pages/api/boards/[boardName]/stories/[storyId]/tasks/[taskId].ts

@@ -4,7 +4,7 @@ import createUserIfNotExists from '../../../../../../../_api/controllers/taskCon
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   switch (req.method) {
     case 'PUT':
@@ -17,7 +17,7 @@ export default async (
           },
           {
             where: { id: req.query.taskId, storyId: req.query.storyId },
-          },
+          }
         );
         await createUserIfNotExists(req, `${req.query.boardName}`);
 

pages/api/boards/[boardName]/stories/[storyId]/tasks/index.ts

@@ -5,7 +5,7 @@ import createUserIfNotExists from '../../../../../../../_api/controllers/taskCon
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   switch (req.method) {
     case 'POST':

pages/api/boards/[boardName]/stories/index.ts

@@ -5,7 +5,7 @@ import Task from '../../../../../_api/models/Task';
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   switch (req.method) {
     case 'GET':

pages/api/boards/[boardName]/users/index.ts

@@ -3,7 +3,7 @@ import User from '../../../../../_api/models/User';
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   switch (req.method) {
     case 'GET':

pages/api/boards/index.ts

@@ -4,7 +4,7 @@ import { boardNameRegex } from '../../../constants';
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   switch (req.method) {
     case 'POST':

pages/api/index.ts

@@ -6,7 +6,7 @@ import User from '../../_api/models/User';
 
 export default async (
   req: NextApiRequest,
-  res: NextApiResponse,
+  res: NextApiResponse
 ): Promise<void> => {
   await Board.sync();
   await Story.sync();

pages/index.tsx

@@ -25,7 +25,7 @@ export const Home: React.FC = () => {
       <div className={styles.divider} />
 
       <Typography.Paragraph type="secondary">
-        Craete new or access existing board
+        Create new or access existing board
       </Typography.Paragraph>
       <div className={styles.formContainer}>
         <BoardNameForm onSubmit={onSubmit} />

server/index.ts

@@ -43,7 +43,7 @@ app.prepare().then(() => {
     WEBSOCKET_EVENTS.forEach((event) => {
       socket.on(event.name, (message) => {
         if (boardName) {
-          socket.to(boardName).broadcast.emit(event.name, message);
+          socket.to(boardName).emit(event.name, message);
         }
       });
     });
@@ -53,6 +53,6 @@ app.prepare().then(() => {
   console.log(
     `> Server listening at http://localhost:${port} as ${
       dev ? 'development' : process.env.NODE_ENV
-    }`,
+    }`
   );
 });

styles/global.scss

@@ -1,4 +1,4 @@
-@import '~antd/dist/antd.css';
+@import '~antd/dist/reset.css';
 
 html,
 body {

test/setupTests.ts

@@ -1,4 +1,20 @@
-import '@testing-library/jest-dom';
+require('@testing-library/jest-dom');
+import { useRouter } from 'next/router';
+
+jest.mock('next/router', () => ({
+  useRouter: jest.fn(),
+}));
+
+const mockedUseRouter = useRouter as jest.Mock;
+
+beforeEach(() => {
+  mockedUseRouter.mockReturnValue({
+    route: '/',
+    pathname: '/',
+    query: {},
+    asPath: '/',
+  });
+});
 
 global.fetch = jest.fn();
 

test/testUtils.ts

@@ -1,4 +1,5 @@
 import { render, RenderResult } from '@testing-library/react';
+import { JSX } from 'react';
 // import { ThemeProvider } from "my-ui-lib"
 // import { TranslationProvider } from "my-i18n-lib"
 // import defaultStrings from "i18n/en-x-default"

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es6",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
@@ -13,7 +13,9 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
-    "useDefineForClassFields": true
+    "useDefineForClassFields": true,
+    "incremental": true,
+    "types": ["@testing-library/jest-dom"]
   },
   "exclude": ["node_modules", ".next", "out"],
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"]

ui/api/createBoard.ts

@@ -21,7 +21,7 @@ const createBoard = async (values: FormValues): Promise<Board> => {
     return board;
   }
   message.error(
-    'Some error occurred while creating your board. Please try again.',
+    'Some error occurred while creating your board. Please try again.'
   );
   return null;
 };

ui/api/createStory.ts

@@ -15,7 +15,7 @@ const createStory = async (story: Story): Promise<Story> => {
     return story;
   }
   message.error(
-    'Some error occurred while creating your story. Please try again.',
+    'Some error occurred while creating your story. Please try again.'
   );
   return null;
 };