Fix Errors generated due to dependency updates

Framer Motion 10+ & Recharts 2.15 introduced stricter TypeScript typing rules.

Author: ShahanaFarooqui

apps/backend/source/controllers/auth.ts

@@ -81,7 +81,7 @@ export class AuthController {
   isUserAuthenticated = async (req: Request, res: Response, next: NextFunction) => {
     try {
       const uaRes = isAuthenticated(req.cookies.token);
-      if (req.body.returnResponse) {
+      if (req.body?.returnResponse || false) {
         // Frontend is asking if user is authenticated or not
         if (APP_CONSTANTS.APP_SINGLE_SIGN_ON === 'true') {
           return res.status(201).json({ isAuthenticated: true, isValidPassword: true });

apps/backend/source/controllers/shared.ts

@@ -82,7 +82,9 @@ export class SharedController {
       const FIAT_VENUE = FIAT_VENUES.hasOwnProperty(req.params.fiatCurrency)
         ? FIAT_VENUES[req.params.fiatCurrency]
         : 'COINGECKO';
-      logger.info('Fiat URL: ' + FIAT_RATE_API + FIAT_VENUE + '/pairs/XBT/' + req.params.fiatCurrency);
+      logger.info(
+        'Fiat URL: ' + FIAT_RATE_API + FIAT_VENUE + '/pairs/XBT/' + req.params.fiatCurrency,
+      );
       return axios
         .get(FIAT_RATE_API + FIAT_VENUE + '/pairs/XBT/' + req.params.fiatCurrency)
         .then((response: any) => {
@@ -100,11 +102,11 @@ export class SharedController {
         })
         .catch(err => {
           logger.error('Fiat Error Response: ' + JSON.stringify(err));
-          res.status(200).json({ venue: "NONE", rate: "0" });
+          res.status(200).json({ venue: 'NONE', rate: '0' });
         });
     } catch (error: any) {
       logger.error('Error from Fiat Rate: ' + JSON.stringify(error));
-      res.status(200).json({ venue: "NONE", rate: "0" });
+      res.status(200).json({ venue: 'NONE', rate: '0' });
     }
   };
 

apps/frontend/src/components/bookkeeper/Volume/VolumeGraph/VolumeGraph.tsx

@@ -82,7 +82,7 @@ const VolumeGraph = () => {
   let pieColors: any[] = [];
   const RADIAN = Math.PI / 180;
 
-  const renderLabel = ({ cx, cy, midAngle, innerRadius, outerRadius, index, data, isInner = false }) => {
+  const renderLabel = ({ cx, cy, midAngle, innerRadius, outerRadius, index, data, isInner = false }: any) => {
     const entry = data[index];
     const radius = innerRadius + (outerRadius - innerRadius) * (isInner ? 0.5 : 1.4);
     const x = cx + radius * Math.cos(-midAngle * RADIAN);

apps/frontend/src/utilities/constants.ts

@@ -8,6 +8,7 @@ import {
   faShekelSign,
   faLiraSign,
 } from '@fortawesome/free-solid-svg-icons';
+import { cubicBezier, spring } from 'framer-motion';
 import moment from 'moment';
 
 export const HOST = process.env.NODE_ENV !== 'production' ? 'localhost' : window.location.hostname;
@@ -325,30 +326,38 @@ export const ANIMATION_FINAL_STATE = { opacity: 1, scale: 1 };
 export const ANIMATION_TRANSITION = {
   duration: COUNTUP_DURATION,
   delay: 0,
-  ease: [0, 0.71, 0.2, 1.01],
+  ease: cubicBezier(0, 0.71, 0.2, 1.01),
 };
 export const ANIMATION_DELAYED_TRANSITION = {
   duration: COUNTUP_DURATION,
   delay: 0.5,
-  ease: [0, 0.71, 0.2, 1.01],
+  ease: cubicBezier(0, 0.71, 0.2, 1.01),
 };
 
 export const OPACITY_VARIANTS = { visible: { opacity: 1 }, hidden: { opacity: 0 } };
-export const SPRING_VARIANTS = { type: 'spring', stiffness: 400, damping: 25 };
-export const BOUNCY_SPRING_VARIANTS_1 = { type: 'spring', stiffness: 600, damping: 20 };
-export const BOUNCY_SPRING_VARIANTS_2 = { type: 'spring', stiffness: 700, damping: 10 };
-export const BOUNCY_SPRING_VARIANTS_3 = { type: 'spring', stiffness: 400, damping: 8, delay: 0.2 };
-export const BOUNCY_SPRING_VARIANTS_4 = { type: 'spring', stiffness: 250, damping: 15 };
+export const SPRING_VARIANTS = { type: spring, stiffness: 400, damping: 25 };
+export const BOUNCY_SPRING_VARIANTS_1 = { type: spring, stiffness: 600, damping: 20 };
+export const BOUNCY_SPRING_VARIANTS_2 = { type: spring, stiffness: 700, damping: 10 };
+export const BOUNCY_SPRING_VARIANTS_3 = { type: spring, stiffness: 400, damping: 8, delay: 0.2 };
+export const BOUNCY_SPRING_VARIANTS_4 = { type: spring, stiffness: 250, damping: 15 };
 export const STAGERRED_SPRING_VARIANTS_1 = {
   hidden: { pathLength: 0, opacity: 0 },
-  visible: i => {
-    const delay = 0 + i * 0.5;
+  visible: (i: number) => {
+    const delay = i * 0.5;
     return {
       pathLength: 1,
       opacity: 1,
       transition: {
-        pathLength: { delay, type: 'spring', duration: COUNTUP_DURATION, bounce: 0 },
-        opacity: { delay, duration: 0.02 },
+        pathLength: {
+          delay,
+          type: spring,
+          duration: COUNTUP_DURATION,
+          bounce: 0,
+        },
+        opacity: {
+          delay,
+          duration: 0.02,
+        },
       },
     };
   },
@@ -360,20 +369,20 @@ export const STAGERRED_SPRING_VARIANTS_2 = {
     return {
       x: 0,
       transition: {
-        x: { delay, type: 'spring', stiffness: 700, damping: 10 },
+        x: { delay, type: spring, stiffness: 700, damping: 10 },
       },
     };
   },
 };
 
 export const STAGERRED_SPRING_VARIANTS_3 = {
   hidden: { y: -10 },
-  visible: i => {
+  visible: (i: number) => {
     const delay = 0 + i * 0.5;
     return {
       y: 0,
       transition: {
-        y: { delay, type: 'spring', stiffness: 700, damping: 4 },
+        y: { delay, type: spring, stiffness: 700, damping: 4 },
       },
     };
   },
@@ -386,7 +395,7 @@ export const STAGERRED_SPRING_VARIANTS_4 = {
     return {
       opacity: 1,
       transition: {
-        opacity: { delay, type: 'spring', stiffness: 500, damping: 3 },
+        opacity: { delay, type: spring, stiffness: 500, damping: 3 },
       },
     };
   },
@@ -403,4 +412,4 @@ export const STAGERRED_COLOR_DRAIN = {
       },
     };
   },
-};
+} as const;