Merge pull request #1104 from ankitkarna99/nextjs-13-update

Nextjs 13 update

.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"],
   "rules": {
-    "arrow-body-style": [
-      "error",
-      "always"
-    ],
-    "curly": [
-      "error",
-      "all"
-    ],
+    "arrow-body-style": ["error", "always"],
+    "curly": ["error", "all"],
     "padding-line-between-statements": [
       "error",
       {
@@ -44,4 +32,4 @@
   "env": {
     "jest": true
   }
-}
+}

__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: (...args) => { 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)

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)

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'

lingui.config.js

@@ -1,29 +1,19 @@
+const nextConfigFactory = require('./next.config')
+
+const nextConfig = nextConfigFactory()
+
 module.exports = {
-  locales: [
-    'en',
-    // "es",
-    'fr',
-    'ja',
-    'zh'
-    // "de",
-    // "id",
-    // "it",
-    // "ko",
-    // "ru",
-    // "el",
-    // "tr",
-    // "vi",
-  ],
+  locales: nextConfig.i18n.locales,
   catalogs: [
     {
       path: '<rootDir>/locales/{locale}/messages',
       include: ['<rootDir>/src', '<rootDir>/lib']
     }
   ],
+  sourceLocale: nextConfig.i18n.defaultLocale,
   fallbackLocales: {
-    default: 'en'
+    default: nextConfig.i18n.defaultLocale
   },
-  sourceLocale: 'en',
   format: 'po',
   formatOptions: { origins: true, lineNumbers: true }
 }