Merge pull request #1115 from neptune-mutual-blue/develop

Develop -> Main

.eslintignore

@@ -0,0 +1,2 @@
+node_modules/
+lib/react-currency-input-field/

.eslintrc.json

@@ -1,21 +1,9 @@
 {
-  "extends": [
-    "standard",
-    "standard-jsx",
-    "next/core-web-vitals"
-  ],
-  "plugins": [
-    "unused-imports"
-  ],
+  "extends": ["standard", "standard-jsx", "next/core-web-vitals"],
+  "plugins": ["unused-imports", "lingui"],
   "rules": {
-    "arrow-body-style": [
-      "error",
-      "always"
-    ],
-    "curly": [
-      "error",
-      "all"
-    ],
+    "arrow-body-style": ["error", "always"],
+    "curly": ["error", "all"],
     "padding-line-between-statements": [
       "error",
       {
@@ -31,6 +19,11 @@
     ],
     "@next/next/no-img-element": 0,
     "unused-imports/no-unused-imports": "error",
+    "lingui/t-call-in-function": 2,
+    "lingui/no-single-variables-to-translate": 2,
+    "lingui/no-expression-in-message": 2,
+    "lingui/no-single-tag-to-translate": 2,
+    "lingui/no-trans-inside-trans": 2,
     "unused-imports/no-unused-vars": [
       "warn",
       {
@@ -44,4 +37,4 @@
   "env": {
     "jest": true
   }
-}
+}

.github/workflows/build.yml

@@ -1,4 +1,4 @@
-name: Build
+name: Lint and Build
 
 on:
   push:
@@ -12,18 +12,14 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - name: Checkout 🛎️
-        uses: actions/checkout@v2.3.1
-
-      - name: Read .nvmrc
-        run: echo "##[set-output name=NVMRC;]$(cat .nvmrc)"
-        id: nvm
-
-      - name: Setup Nodejs with yarn caching (.nvmrc)
-        uses: actions/setup-node@v2
-        with:
-          node-version: "${{ steps.nvm.outputs.NVMRC }}"
-          cache: yarn
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup Volta
+        uses: volta-cli/action@v4
+
+      - name: Check versions
+        run: node -v && npm -v && yarn -v
 
       - name: Install dependencies
         run: yarn install --frozen-lockfile

__mocks__/@lingui/macro.js

@@ -1,4 +1,4 @@
 module.exports = ({
-  Trans: jest.fn(({ children }) => children),
-  t: jest.fn((x) => x)
+  Trans: jest.fn(({ children }) => { return children }),
+  t: jest.fn((x) => { return x })
 })

__mocks__/styleMock.js

@@ -1 +1 @@
-module.exports = {};
+module.exports = {}

__tests__/src/pages/covers/[coverId]/products/[productId]/index-coming-soon.test.js

@@ -23,7 +23,7 @@ describe('Options test', () => {
   test('Should display No Data Found', () => {
     rerenderFn({}, () => {
       mockHooksOrMethods.useCoversAndProducts2(() => {
-        return { ...testData.coversAndProducts2, loading: false, getProduct: () => undefined }
+        return { ...testData.coversAndProducts2, loading: false, getProduct: () => { return undefined } }
       })
     })
     const noDataFound = screen.getByText('No Data Found')

__tests__/src/pages/covers/[coverId]/products/[productId]/index.test.js

@@ -3,11 +3,13 @@ import { mockHooksOrMethods } from '@/utils/unit-tests/mock-hooks-and-methods'
 import { testData } from '@/utils/unit-tests/test-data'
 import { screen } from '@testing-library/react'
 
-jest.mock('@/src/modules/cover/CoverOptionsPage', () => ({
-  CoverOptionsPage: () => {
-    return <div data-testid='cover-options-page' />
+jest.mock('@/src/modules/cover/CoverOptionsPage', () => {
+  return {
+    CoverOptionsPage: () => {
+      return <div data-testid='cover-options-page' />
+    }
   }
-}))
+})
 
 describe('Options test', () => {
   const OLD_ENV = process.env
@@ -18,7 +20,7 @@ describe('Options test', () => {
       require('@/src/pages/covers/[coverId]/products/[productId]').default
     const { initialRender } = initiateTest(Index, {}, () => {
       mockHooksOrMethods.useRouter()
-      mockHooksOrMethods.useCoversAndProducts2(() => ({ ...testData.coversAndProducts2, getProduct: (...args) => (true), loading: false }))
+      mockHooksOrMethods.useCoversAndProducts2(() => { return { ...testData.coversAndProducts2, getProduct: () => { return (true) }, loading: false } })
     })
     initialRender()
   })

__tests__/src/pages/index.test.js

@@ -1,25 +1,25 @@
-import { initiateTest } from "@/utils/unit-tests/helpers";
-import { screen } from "@testing-library/react";
-import Index from "@/src/pages/index";
+import { initiateTest } from '@/utils/unit-tests/helpers'
+import { screen } from '@testing-library/react'
+import Index from '@/src/pages/index'
 
-jest.mock("@/modules/home", () => {
+jest.mock('@/modules/home', () => {
   return {
     __esModule: true,
     default: () => {
-      return <div data-testid="homepage"></div>;
-    },
-  };
-});
+      return <div data-testid='homepage' />
+    }
+  }
+})
 
-describe("Index test", () => {
-  const { initialRender } = initiateTest(Index);
+describe('Index test', () => {
+  const { initialRender } = initiateTest(Index)
 
   beforeEach(() => {
-    initialRender();
-  });
+    initialRender()
+  })
 
-  test("should display homepage", () => {
-    const homepage = screen.getByTestId("homepage");
-    expect(homepage).toBeInTheDocument();
-  });
-});
+  test('should display homepage', () => {
+    const homepage = screen.getByTestId('homepage')
+    expect(homepage).toBeInTheDocument()
+  })
+})

__tests__/src/pages/my-liquidity/[coverId]/index-coming-soon.test.js

@@ -2,9 +2,11 @@ import { mockHooksOrMethods } from '@/utils/unit-tests/mock-hooks-and-methods'
 import { initiateTest } from '@/utils/unit-tests/helpers'
 import { screen } from '@testing-library/react'
 
-jest.mock('@/common/ComingSoon', () => ({
-  ComingSoon: () => <div data-testid='coming-soon' />
-}))
+jest.mock('@/common/ComingSoon', () => {
+  return {
+    ComingSoon: () => { return <div data-testid='coming-soon' /> }
+  }
+})
 
 describe('MyLiquidityCover test', () => {
   const OLD_ENV = process.env

__tests__/src/pages/my-liquidity/[coverId]/index.test.js

@@ -2,11 +2,13 @@ import { initiateTest } from '@/utils/unit-tests/helpers'
 import { screen } from '@testing-library/react'
 import MyLiquidityCover from '@/pages/my-liquidity/[coverId]/index'
 
-jest.mock('@/src/modules/my-liquidity/details', () => ({
-  ProvideLiquidityToCover: () => {
-    return <div data-testid='provide-liquidity-to-cover' />
+jest.mock('@/src/modules/my-liquidity/details', () => {
+  return {
+    ProvideLiquidityToCover: () => {
+      return <div data-testid='provide-liquidity-to-cover' />
+    }
   }
-}))
+})
 
 describe('MyLiquidityCover test', () => {
   const { initialRender } = initiateTest(MyLiquidityCover)

i18n.config.js

@@ -1,3 +1,4 @@
+/** @type {{i18n: (import("next").NextConfig)['i18n']}} */
 module.exports = {
   i18n: {
     locales: [

jest.setup.js

@@ -1,3 +1,3 @@
-jest.setTimeout(90 * 1000);
+import '@testing-library/jest-dom/extend-expect'
 
-import "@testing-library/jest-dom/extend-expect";
+jest.setTimeout(90 * 1000)

jsconfig.json

@@ -1,21 +1,45 @@
 {
   "compilerOptions": {
     "module": "commonjs",
+    "lib": [
+      "es6",
+      "dom"
+    ],
     "target": "es2016",
     "jsx": "preserve",
     "resolveJsonModule": true,
     "checkJs": true,
     "baseUrl": ".",
     "paths": {
-      "@/lib/*": ["lib/*"],
-      "@/locales/*": ["locales/*"],
-      "@/utils/*": ["src/utils/*"],
-      "@/icons/*": ["src/icons/*"],
-      "@/common/*": ["src/common/*"],
-      "@/modules/*": ["src/modules/*"],
-      "@/pages/*": ["src/pages/*"],
-      "@/src/*": ["src/*"]
+      "@/lib/*": [
+        "lib/*"
+      ],
+      "@/locales/*": [
+        "locales/*"
+      ],
+      "@/utils/*": [
+        "src/utils/*"
+      ],
+      "@/icons/*": [
+        "src/icons/*"
+      ],
+      "@/common/*": [
+        "src/common/*"
+      ],
+      "@/modules/*": [
+        "src/modules/*"
+      ],
+      "@/pages/*": [
+        "src/pages/*"
+      ],
+      "@/src/*": [
+        "src/*"
+      ]
     }
   },
-  "exclude": ["node_modules", "**/node_modules/*", "out"]
-}
+  "exclude": [
+    "node_modules",
+    "**/node_modules/*",
+    "out"
+  ]
+}

lib/connect-wallet/components/ConnectWallet/ConnectWallet.jsx

@@ -4,7 +4,6 @@ import { useWeb3React } from '@web3-react/core'
 
 import { useAuth } from '../../hooks/useAuth'
 import { Popup } from './Popup'
-import { WalletDisclaimerPoup } from '@/lib/connect-wallet/components/ConnectWallet/WalletDisclaimerPopup'
 
 export default function ConnectWallet ({ networkId, notifier, children }) {
   const [isOpen, setIsOpen] = useState(false)
@@ -33,8 +32,6 @@ export default function ConnectWallet ({ networkId, notifier, children }) {
         networkId={networkId}
         notifier={notifier}
       />
-
-      <WalletDisclaimerPoup />
     </>
   )
 }

lib/connect-wallet/components/ConnectWallet/WalletDisclaimerPopup.jsx

@@ -133,10 +133,10 @@ I hereby further represent and warrant that:
 
         <hr className='h-px my-6 text-F6F7F9' />
 
-        <div className='flex justify-end gap-4'>
-          <OutlinedButton className='text-sm font-semibold leading-6 rounded-big' onClick={handleDisAgree}>Cancel</OutlinedButton>
+        <div className='flex flex-wrap-reverse justify-end gap-4'>
+          <OutlinedButton className='w-full text-sm font-semibold leading-6 sm:w-auto rounded-big' onClick={handleDisAgree}>Cancel</OutlinedButton>
           <RegularButton
-            className='rounded-big py-2.5 px-4 text-sm leading-6 font-semibold'
+            className='w-full sm:w-auto rounded-big py-2.5 px-4 text-sm leading-6 font-semibold'
             onClick={handleAgree}
             disabled={acceptDisabled}
           >Agree & Login

lib/countdown/useCountdown.jsx

@@ -1,4 +1,7 @@
-import { useEffect, useState } from 'react'
+import {
+  useEffect,
+  useState
+} from 'react'
 
 const defaultState = {
   hours: 0,
@@ -37,7 +40,7 @@ export const useCountdown = ({ target, getTime }) => {
       })
     }
 
-    const intervalId = setInterval(() => {
+    const intervalId = window.setInterval(() => {
       updateState(intervalId)
     }, 1000)
 

lib/date/DateLib.js

@@ -101,9 +101,9 @@ class DateLib {
   /**
    *
    * @param {string | number | Date} date
-   * @param {string} locale
+   * @param {string} [locale]
    * @param {string} [preferTimezone]
-   * @param {Object.<string, string>} options
+   * @param {Object.<string, string>} [options]
    * @returns
    */
   static toLongDateFormat (
@@ -121,7 +121,10 @@ class DateLib {
       timeZoneName: 'short'
     }
   ) {
-    if (parseInt(date) === 0) {
+    if (
+      (typeof date === 'number' || typeof date === 'string') &&
+      (parseInt(date.toString()) === 0)
+    ) {
       return 'Not Available'
     }
 

lib/hl-calendar/index.jsx

@@ -5,7 +5,7 @@ import { useRouter } from 'next/router'
 import ChevronLeftLgIcon from '@/icons/ChevronLeftLgIcon'
 import ChevronRightLgIcon from '@/icons/ChevronRightLgIcon'
 import { getMonthNames } from '@/lib/dates'
-import { t } from '@lingui/macro'
+import { Trans } from '@lingui/macro'
 
 // HlCalendar - Highlight Calendar
 export const HlCalendar = ({ startDate, endDate }) => {
@@ -57,7 +57,7 @@ export const HlCalendar = ({ startDate, endDate }) => {
             )}
             onClick={handlePrev}
           >
-            <span className='sr-only'>{t`Previous`}</span>
+            <span className='sr-only'><Trans>Previous</Trans></span>
             <ChevronLeftLgIcon aria-hidden='true' className='w-3 h-3 text-lg' />
           </button>
           <button
@@ -67,7 +67,7 @@ export const HlCalendar = ({ startDate, endDate }) => {
             )}
             onClick={handleNext}
           >
-            <span className='sr-only'>{t`Next`}</span>
+            <span className='sr-only'><Trans>Next</Trans></span>
             <ChevronRightLgIcon
               aria-hidden='true'
               className='w-3 h-3 text-lg'