upgrade-package-reacti18next (#2229)

package.json

@@ -42,7 +42,7 @@
     "react-datepicker": "^7.3.0",
     "react-dom": "^17.0.2",
     "react-google-recaptcha": "^3.1.0",
-    "react-i18next": "^11.18.1",
+    "react-i18next": "^12.3.1",
     "react-icons": "^5.2.1",
     "react-infinite-scroll-component": "^6.1.0",
     "react-multi-carousel": "^2.8.5",

src/utils/errorHandler.test.tsx

@@ -1,4 +1,5 @@
-import type { TFunction } from 'react-i18next';
+type TFunction = (key: string, options?: Record<string, unknown>) => string;
+
 import { errorHandler } from './errorHandler';
 import { toast } from 'react-toastify';
 
@@ -9,8 +10,9 @@ jest.mock('react-toastify', () => ({
 }));
 
 describe('Test if errorHandler is working properly', () => {
-  const t: TFunction<'translation', string> = (key: string) => key;
-  const tErrors: TFunction<'errors', string> = (key: string) => key;
+  const t: TFunction = (key: string) => key;
+  const tErrors: TFunction = (key: string, options?: Record<string, unknown>) =>
+    key;
 
   it('should call toast.error with the correct message if error message is "Failed to fetch"', () => {
     const error = new Error('Failed to fetch');

src/utils/errorHandler.tsx

@@ -1,4 +1,5 @@
-import type { TFunction } from 'react-i18next';
+type TFunction = (key: string, options?: Record<string, unknown>) => string;
+
 import { toast } from 'react-toastify';
 import i18n from './i18n';
 /** 
@@ -7,10 +8,7 @@ import i18n from './i18n';
   If the error is due to the Talawa API being unavailable, it displays a custom message.
 */
 export const errorHandler = (a: unknown, error: unknown): void => {
-  const tErrors = i18n.getFixedT(
-    null,
-    'errors',
-  ) as unknown as TFunction<string>;
+  const tErrors: TFunction = i18n.getFixedT(null, 'errors');
   if (error instanceof Error) {
     switch (error.message) {
       case 'Failed to fetch':