Merge pull request #1810 from Gauravjeetsingh/upgrade-node

Update dependencies to work with node 18

Author: Gauravjeetsingh

.babelrc.js

@@ -2,9 +2,9 @@ const alias = require('./webpack.config').resolve.alias;
 
 const plugins = [
   '@babel/plugin-syntax-dynamic-import',
-  '@babel/plugin-proposal-object-rest-spread',
-  '@babel/plugin-proposal-class-properties',
-  '@babel/transform-runtime'
+  '@babel/plugin-transform-object-rest-spread',
+  '@babel/plugin-transform-class-properties',
+  '@babel/transform-runtime',
 ];
 
 const presets = [
@@ -25,18 +25,18 @@ const presets = [
 module.exports = {
   env: {
     production: {
-      presets: presets.map(preset =>
+      presets: presets.map((preset) =>
         preset[0] !== '@babel/preset-env'
           ? preset
           : [
-            '@babel/preset-env',
-            {
-              targets: {
-                browsers: ['ie 11', 'safari 9'],
+              '@babel/preset-env',
+              {
+                targets: {
+                  browsers: ['ie 11', 'safari 9'],
+                },
+                modules: false,
               },
-              modules: false,
-            },
-          ]
+            ]
       ),
       plugins: plugins.concat([
         [

.eslintrc

@@ -1,13 +1,47 @@
 {
-  "parser": "babel-eslint",
+  "parser": "@babel/eslint-parser",
+  "parserOptions": {
+    "requireConfigFile": false,
+    "babelOptions": {
+      "presets": ["@babel/preset-react", "@babel/preset-typescript"]
+    }
+  },
   "extends": [
     "eslint:recommended",
-    "plugin:react/recommended"
+    "plugin:react/recommended",
+    "plugin:@typescript-eslint/recommended"
+  ],
+  "plugins": [
+    "react",
+    "@typescript-eslint"
   ],
   "env": {
     "es6": true,
     "browser": true,
     "node": true,
     "jest": true
-  }
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "rules": {
+    "@typescript-eslint/no-unused-vars": "error",
+    "@typescript-eslint/no-explicit-any": "warn",
+    "react/prop-types": "off"
+  },
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx"],
+      "parser": "@typescript-eslint/parser",
+      "parserOptions": {
+        "ecmaVersion": 2020,
+        "sourceType": "module",
+        "ecmaFeatures": {
+          "jsx": true
+        }
+      }
+    }
+  ]
 }

.github/workflows/dev-sttm-web-AutoDeployTrigger-20952253-f106-4264-a850-1a8fd6340281.yml

@@ -4,22 +4,21 @@ name: Trigger auto deployment for dev-sttm-web
 on:
   # Automatically trigger it when detected changes in repo
   push:
-    branches: 
-      [ dev ]
+    branches: [dev]
     paths:
-    - '**'
-    - '.github/workflows/dev-sttm-web-AutoDeployTrigger-20952253-f106-4264-a850-1a8fd6340281.yml'
+      - '**'
+      - '.github/workflows/dev-sttm-web-AutoDeployTrigger-20952253-f106-4264-a850-1a8fd6340281.yml'
 
-  # Allow manual trigger 
-  workflow_dispatch:      
+  # Allow manual trigger
+  workflow_dispatch:
 
 env:
   NODE_ENV: development
 
 jobs:
   build-and-deploy:
     runs-on: ubuntu-latest
-    permissions: 
+    permissions:
       id-token: write #This is required for requesting the OIDC JWT Token
       contents: read #Required when GH token is used to authenticate with private repo
 
@@ -45,5 +44,5 @@ jobs:
           containerAppName: dev-sttm-web
           resourceGroup: devops
           imageToBuild: khalis.azurecr.io/dev-sttm-web:${{ github.sha }}
-          _buildArgumentsKey_: |
+          buildArguments: |
             NODE_ENV=development

.github/workflows/sttm-web-container-AutoDeployTrigger-fe063408-abd2-49aa-a2a4-d66a6e18443b.yml

@@ -4,22 +4,21 @@ name: Trigger auto deployment for sttm-web-container
 on:
   # Automatically trigger it when detected changes in repo
   push:
-    branches: 
-      [ master ]
+    branches: [master]
     paths:
-    - '**'
-    - '.github/workflows/sttm-web-container-AutoDeployTrigger-fe063408-abd2-49aa-a2a4-d66a6e18443b.yml'
+      - '**'
+      - '.github/workflows/sttm-web-container-AutoDeployTrigger-fe063408-abd2-49aa-a2a4-d66a6e18443b.yml'
 
-  # Allow manual trigger 
-  workflow_dispatch:      
+  # Allow manual trigger
+  workflow_dispatch:
 
 env:
   NODE_ENV: production
 
 jobs:
   build-and-deploy:
     runs-on: ubuntu-latest
-    permissions: 
+    permissions:
       id-token: write #This is required for requesting the OIDC JWT Token
       contents: read #Required when GH token is used to authenticate with private repo
 
@@ -45,7 +44,5 @@ jobs:
           containerAppName: sttm-web-container
           resourceGroup: devops
           imageToBuild: khalis.azurecr.io/sttm-web-container:${{ github.sha }}
-          _buildArgumentsKey_: |
+          buildArguments: |
             NODE_ENV=production
-
-

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:14.21.3
+FROM node:18
 
 # Set working directory
 WORKDIR /app
@@ -16,10 +16,10 @@ RUN apt-get update && apt-get install -y default-mysql-client
 COPY . .
 
 # Install dependencies
-RUN npm install --legacy-peer-deps
+RUN npm install
 
 # Set the environment and expose your app port
-ARG NODE_ENV=production
+ARG NODE_ENV
 RUN echo "Build argument NODE_ENV value: $NODE_ENV"
 ENV NODE_ENV=$NODE_ENV
 RUN echo "Environment variable NODE_ENV value: $NODE_ENV"

common/api-urls-constants.js

@@ -1,7 +1,9 @@
 const isProduction = process.env.NODE_ENV === 'production';
 
 module.exports = {
-  BANIS: isProduction ? '//api.banidb.com/v2/banis' : "//api.khajana.org/v2/banis",
+  BANIS: isProduction
+    ? '//api.banidb.com/v2/banis'
+    : '//api.khajana.org/v2/banis',
   PRODUCTION: '//api.banidb.com/v2/',
   DEVELOPMENT: '//api.khajana.org/v2/',
   AMRIT_KEERTAN: '//api.banidb.com/v2/amritkeertan',
@@ -16,4 +18,4 @@ module.exports = {
   WRITERS: '//api.banidb.com/v2/writers/',
   GURBANIBOT: '//gurbanichatbot.sikhitothemax.org/',
   SP_API: '//serviceprovider.khalis.net',
-};
+};

common/constants.js

@@ -1,5 +1,4 @@
-
-const API_URLS_CONSTANTS = require('./api-urls-constants');
+import API_URLS_CONSTANTS from './api-urls-constants';
 const isProduction = process.env.NODE_ENV === 'production';
 export const DARK_MODE_COOKIE = 'darkmode';
 export const DARK_MODE_CLASS_NAME = 'dark-mode';
@@ -11,4 +10,6 @@ export const OFFLINE_COLOR = '#333333';
 
 export const BASIC_META_DESCRIPTION = `Search Sri Guru Granth Sahib Jee, Sri Dasam Granth Sahib, Bhai Gurdas Vaar, Bhai Nandlal Vaar, Bhai Gurdas Singh Vaar, Tankhanaama, Zafarnaama, Amrit Kirtan.`;
 
-export const API_URL = isProduction ? API_URLS_CONSTANTS.PRODUCTION : API_URLS_CONSTANTS.DEVELOPMENT;
+export const API_URL = isProduction
+  ? API_URLS_CONSTANTS.PRODUCTION
+  : API_URLS_CONSTANTS.DEVELOPMENT;

jest.config.js

@@ -1,5 +1,10 @@
 module.exports = {
-  testURL: 'http://localhost:8080',
+  testEnvironmentOptions: {
+    url: 'http://localhost:8080',
+    environment: 'jest-environment-jsdom-sixteen',
+  },
+  verbose: true,
+  setupFiles: ['<rootDir>/jest/setupTest.js'],
   collectCoverage: true,
   // since we moved config to a deeper folder, we are specifying what <rootDir> should now point to.
   rootDir: './',
@@ -11,7 +16,5 @@ module.exports = {
   testPathIgnorePatterns: ['/node_modules/', '<rootDir>/cypress/*'],
   preset: 'ts-jest',
   testEnvironment: 'jsdom',
-  setupFiles: [
-    "<rootDir>/jest/setupTest.js"
-  ]
+  setupFiles: ['<rootDir>/jest/setupTest.js'],
 };

jest/setupTest.js

@@ -1,4 +1,10 @@
 // Mock data and helper methods
-window.HTMLMediaElement.prototype.load = () => { /* do nothing */ };
-window.HTMLMediaElement.prototype.play = () => { /* do nothing */ };
-window.HTMLMediaElement.prototype.pause = () => { /* do nothing */ };
+window.HTMLMediaElement.prototype.load = () => {
+  /* do nothing */
+};
+window.HTMLMediaElement.prototype.play = () => {
+  /* do nothing */
+};
+window.HTMLMediaElement.prototype.pause = () => {
+  /* do nothing */
+};